개발 공부 115

[모던 자바스크립트 입문] 1-3장

1장. 자바스크립트의 개요 1. 프로그래밍 언어란 컴퓨터 프로그램을 작성하기 위한, 즉 알고리즘을 설명하기 위한 언어이다. 2. 프로그래밍 언어는 컴파일 언어와 인터프리터 언어로 나뉜다. 3. 프로그래밍 언어는 방식에 따라 절차적 언어, 객체 지향 언어, 함수형 언어, 논리형 언어로 나뉜다. 자바스크립트는 객체 지향 언어이지만 함수형 언어의 특징도 가진다. 4. 자바스크립트는 인터프리터 언어이다. 실행 속도가 느릴 것 같지만 최근 웹브라우저 대부분에 실행시간에 자바스크립트 코드를 컴파일하는 JIT 컴파일러가 내장돼있어 실행 속도가 매우 빨라졌다. 이는 자바스크립틀르 활용한 고기능 웹 애플리케이션을 구현할 수 있게 된 중요한 요인 중 하나이다. 5. 자바스크립트는 C++나 Java처럼 클래스를 이용해 객체..

프로토타입을 철학적으로 이해하기 (주의: 매우 이해 쉬움)

자바스크립트 프로토타입은 이해하기 매우 어려운 주제이다. 책을 읽었지만 그래도 이해하지 못했는데, 프로토타입을 철학의 맥락에서 살펴본 아래 자료를 읽고 이해를 한방에 했다! 정말 이해하기 쉽게 되어있고 문과라면 오히려 더 잘 이해할 수 있으니 꼭 읽어보시는 걸 추천! 자바스크립트는 왜 프로토타입을 선택했을까 프로토타입으로 검색하면 으레 나오는 서두처럼 저 또한 자바스크립트를 처음 접했을 때 가장 당황스러웠던 게 프로토타입이었습니다. medium.com 정리 - 프로토타입은 이미 존재하는 객체, 즉 생성된 객체를 통해 정의하는 방식이다. - 그래서 프로토타입 선언 시에 객체 선언의 과정이 포함되어 있는 것이다! - 프로토타입을 적용한 후, 적용시킨 객체가 해당 속성을 변경해도 프로토타입의 객체 속성은 변경..

JavaScript 기초 - array

1. array의 Constructor :Array() 2. array의 Property: 1) Array[@@species] => 현재 이 기능은 사라질 준비 중. toReserved() 같은 최신 배열 메서드가 새 Array 기반 클래스 인스턴스를 반환한다. 기존 배열을 변경하지 않고, 새 배열 인스턴스를 반환하는 배열 메서드(filter(), map())에서 생성자로 작용해, 반환된 생성자는 원 배열과 관련 없는 새로운 배열 메서드의 반환 값을 구성하게끔 된다. 2) Array.prototype[@@unscopables] => 이 속성이 있음으로서 ECMAScript 2015에 도입된 Array 속성이 with 문 바인딩 목적으로 무시돼 2015 이전에 작성된 코드가 중단되지 않고 예상대로 계속 작..

타입스크립트 핸드북 (1~4)

https://joshua1988.github.io/ts/guide/functions.html#this 함수 | 타입스크립트 핸드북 타입스크립트에서의 함수 웹 애플리케이션을 구현할 때 자주 사용되는 함수는 타입스크립트로 크게 다음 3가지 타입을 정의할 수 있습니다. 함수의 파라미터(매개변수) 타입 함수의 반환 타입 joshua1988.github.io 1. 기본타입 기본 타입은 크게 12가지가 있다. Boolean - 타입이 진위값인 경우 let isLoggedIn : boolean = false; Number - 타입이 숫자일 때 let num : number = 10; String - 타입이 문자일 때 let str : string = 'hi'; Object Array - 타입이 배열인 경우는 아래처..

타입스크립트 가이드 읽기 - 1. The Basics

1. The Basics Typescript는 함수, string, object 등 타입을 명확하게 정의해주어, 사용할 수 없는 메서드를 사용하는 일이 없도록 방지한다. (ex. function.toLowerCase();) javascript는 동적 타입 검사(타입 오류를 동작 수행 전에는 알 수 없고, 코드 실행해 호출해봐야 안다)만 제공한다. 그래서 어떤 동작 결과를 보일지 코드를 작성하는 동안 확인하기 위해 Typescript 사용하는 것이다. 정적 타입 검사 필요한 이유 1) JavaScript가 런타임 시 내보내는 오류는 ECMA Script 명세에 적힌 대응법 기반이다. 그런데 당연히 오류를 띄워야 할 상황에서 아래처럼 이상하게 작동할 때가 있다. 아예 정의되지 않은 속성을 불러오는데 오류가 ..

왜 Call by reference가 필요할까?

면접에서 call by value와 call by reference의 차이를 물어보시는 질문에는 잘 답했지만, 이어지는 후속 질문인 '왜 call by reference를 쓰는 지 아나요?' 란 질문에는 답변을 못했다. 메모리 주소만 복사되기 때문에 변수를 복사해 수정하면 원본 값에도 손상이 가는 call by reference는 과연 왜 쓴는 걸까? 어떤 상황에서 쓰게 되는 걸까? 를 조사해봤다. 1. 함수 내부에서 변수가 가리키는 메모리 그 자체를 변화시킨 것이 반영된다. (참고로 JS에서 함수에 값을 넣으면, 그 변수에 담긴 메모리에 대한 참조값이 원시값처럼 복사되므로, 함수 안에서 메모리의 값 자체를 변경한건 적용되나, 함수에 아예 다른 메모리 주소를 할당하면 함수 외부의 원래 변수와는 연결이 아..

React 디자인패턴 공부 - 1. 컨테이너와 프리젠터

참고한 자료: https://burning-camp.tistory.com/84#%EC%BB%A-%ED%--%-C%EC%-D%B-%EB%--%--%--%ED%--%--%EB%A-%AC%EC%A-%A-%ED%--%B--container-presenter-%--%ED%-C%A-%ED%--%B- - 컨테이너와 프리젠터(container-presenter) 디자인 패턴은 비지니스 로직과 뷰를 분리하는 방식이다. MVC 패턴과 유사함을 느낄 수 있다. 컨테이너 프리젠터 패턴이란? - 컨테이너는 data와 state를 가지고, api를 불러온다. 그리고 모든 로직을 처리한다. - 프리젠터는 데이터를 보여줄 뿐이며, state를 갖고 있지 않은 단순한 함수형 컴포넌트이다. - 프리젠터는 스타일, 컨테이너는 데이터의 개..

개발 공부/React 2022.12.22

가장 쉬운 리액트 12강

가장 쉬운 웹개발 with Boaz 12강. React component, element, instance 끝내기 React Components, Elements, and Instances 번역글 Managing the Instances hkc7180.medium.com 더보기 Managing the Instances 기존 UI model(OOP) class Form extends TraditionalObjectOrientedView { render() { // Read some data passed to the view const { isSubmitted, buttonText } = this.attrs; if (!isSubmitted && !this.button) { // Form is not yet ..

개발 공부/React 2022.12.16