JavaScript (34) 썸네일형 리스트형 변수의 유효범위와 클로저 변수의 유효범위와 클로저 ko.javascript.info 자바스크립트는 함수 지향 언어입니다. 이런 특징은 개발자에게 많은 자유를 줍니다. 함수를 동적으로 생성할 수 있고, 생성한 함수를 다른 함수에 인수로 넘길 수 있으며, 생성된 곳이 아닌 곳에서 함수를 호출할 수도 있기 때문입니다. 코드 블록 코드 블록 {...} 안에 선언한 변수는 블록 안에서만 사용할 수 있습니다. { // 지역 변수를 선언하고 몇 가지 조작을 했지만 그 결과를 밖에서 볼 수 없습니다. let message = "안녕하세요."; // 블록 내에서만 변숫값을 얻을 수 있습니다. alert(message); // 안녕하세요. } alert(message); // ReferenceError: message is not defined .. 36장. 디스트럭처링 할당 Destructuring assignment(구조 분해 할당)은 구조화된 배열과 같은 이터러블 또는 객체를 destructuring(비구조화, 구조 파괴)하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다. 배열과 같은 이터러블 또는 객체 리터럴에서 필요한 값만 추출하여 변수에 할당할 때 유용하다. ES6의 배열 디스트럭처링 할당은 배열의 각 요소를 배열로부터 추출하여 1개 이상의 변수에 할당한다. 이때 배열 디스트럭처링 할당의 대상(할당문의 우변)은 이터러블이어야 하며, 할당 기준은 배열 인덱스이다.(순서대로 할당) const arr = [1, 2, 3] const [one, two, three] = arr console.log(one, two, three) 배열 디스트럭처링 할당의 기준은 배열 .. 자바스크립트 완벽 가이드 | 비동기 자바스크립트 과학 시뮬레이션과 머신 러닝 모델 같은 컴퓨터 프로그램은 계산이 목적이기 때문에 결과를 얻을 때까지 멈추지 않고 실행된다. 그 밖의 프로그램은 배부분 비동기적으로 실행된다. 비동기적이라는 말은 데이터가 들어오거나 어떤 이벤트가 일어날 때까지 계산을 멈추고 대기하는 일이 잦다는 뜻이다. 웹 브라우저의 자바스크립트 프로그램은 일반적으로 이벤트 주도적이다. 즉, 프로그램이 뭔가 실행하기 전에 사용자가 뭔가 클릭하거나 탭하기를 기다린다. 자바스크립트를 활용하면 이런 비동기 프로그래밍이 필요할 때가 많다. ES6에서 도입한 프라미스는 비동기 동작의 아직 사용할 수 없는 결과를 나타내는 객체이다. 키워드 async와 await는 ES2017에 도입했는데, 프라미스 기반 코드를 마치 동기적인 코드처럼 작성할 수 있게.. 자바스크립트 완벽 가이드 | 객체 객체 객체는 복합된 값이다. 객체는 여러가지 값(기본 값이나 다른 객체)을 모아서 이름을 통해 값을 저장하고 가져올 수 있게 한다. 객체는 프로퍼티의 순서가 없는 집합이며 각 프로퍼티에는 이름과 값이 있다. 포로퍼티 이름은 보통 문자열로 객체가 문자열에 값을 연결한다고 볼 수도 있다. 객체는 단순히 문자열과 값을 연결한 것이 아니다. 자바스크립트 객체는 자신만의 프로퍼티를 가지는 것 외에도, '프로토타입'으로 불리는 다른 객체에서 프로퍼티를 상속하기도 한다. 객체의 메서드는 일반적으로 상속된 프로퍼티이며, 이 프로토타입 상속이 자바스크립트의 중요한 기능이다. 자바스크립트 객체는 동적이기 때문에 일반적으로 프로퍼티를 추가하거나 삭제할 수 있지만, 정적인 객체를 흉내낼 수도 있고 정적 타입을 사용하는 언어의.. closure 클로저란. A closure is the combination of a function and the lexical environment within which that function was declared. - MDN 클로저는 렉시컬 스코프에 의존하여 코드를 작성한 결과로 그냥 발생하는 것이다. 모든 코드에서 클로저는 발생하고 사용되고 있다. - You don't know JS 자신을 내포하는 함수의 컨텍스트에 접근할 수 있는 함수이다. - 자바스크립트 핵심 가이드 함수가 특정 스코프에 접근할 수 있도록 의도적으로 그 스코프에서 정의하는 것 - 러닝 자바스크립트 이미 생명 주기가 끝난 외부 함수의 변수를 참조하는 함수 - 인사이드 자바스크립트 자유 변수가 있는 함수와 자유 변수를 알 수 있는 환경의 .. prototype의 명확한 이해 JavaScript는 명령형(imperative), 함수형(functional), 프로토타입 기반(prototype-based), 객체지향 프로그래밍(OOP)을 지원하는 멀티 패러다임 프로그래밍 언어이다. prototype-based는 어떤 의미일까? 클래스 기반언어에서는 상속을 사용한다. 상속은 객체지향 프로그래밍의 핵심 개념으로, 어떤 객체의 프로퍼티 또는 메서드를 다른 객체가 그대로 사용할 수 있는 것을 말한다. 하지만, 프로토타입 기반 언어에서는 어떤 객체를 '원형'으로 삼고 이를 복제함으로써 상속과 비슷한 효과를 얻는다. JavaScript는 프로토타입을 기반으로 상속을 구현하여 불필요한 중복을 제거한다. 중복을 제거하는 방법은 기존의 코드를 재사용하는 것이다. 아래 코드를 보자. functio.. 함수와 일급 객체 다음과 같은 조건을 만족하는 객체를 일급 객체라고 한다. 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다. 변수나 자료구조(객체 배열등)에 저장할 수 있다. 함수의 매개변수에 전달할 수 있다. 함수의 반환값으로 사용할 수 있다. 결국 JavaScript의 함수는 값으로 취급할 수 있으며, 무명의 리터럴로 생성할 수 있기 때문에 일급객체의 조건을 만족한다. // 런타임(할당 단계)에 함수 리터럴이 평가되어 함수 객체가 생성되고 변수에 할당된다. const increase = function(num) { return ++num; } const decrease = function (num) { return --num; } // 함수는 객체에 저장할 수 있다. const predicates = .. [JavaScript] Nullish Coalescing Nullish coalescing operator(null 병합 연산자)에 대해서 알아보도록 하겠습니다. null 병합 연산자는 ?? 를 사용하여 피연산자 중 그 값이 '확정되어있는' 변수를 찾을 수 있습니다. 바로 예를 들어보겠습니다. a ?? b 의 경우 a가 null도 아니고 undefined도 아니면 a, 그 외의 경우는 b를 의미합니다. 이를 삼항 연산자로 표현하면 다음과 같습니다. let x = (a !== null && a !== undefined) ? a : b??와 ||의 차이 위 둘은 같은 것처럼 보입니다. 두 연산자의 차이점은 뭘까요? ||는 첫번째 truthy 값을 반환합니다. ??는 첫번째 정의된(defined) 값을 반환합니다. null, undefined, 숫자 .. 이전 1 2 3 4 5 다음
