목록JavaScript (30)
연습장

https://poiemaweb.com/js-closure Closure | PoiemaWeb클로저(closure)는 자바스크립트에서 중요한 개념 중 하나로 자바스크립트에 관심을 가지고 있다면 한번쯤은 들어보았을 내용이다. execution context에 대한 사전 지식이 있으면 이해하기 어렵지 않poiemaweb.com 클로저는 자바스크립트 고유의 개념이 아니라 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어에서 사용되는 중요한 특성이다. "클로저는 함수와 그 함수가 선언됐을 때의 렉시컬 환경(Lexical environment)과의 조합이다." 1. 실행 컨텍스트 (Execution Context) 실행 컨텍스트는 코드가 실행되는 환경을 의미합니다. 자바스크립트에서 코드가 실행될 때마다 실행..

https://poiemaweb.com/js-this this | PoiemaWeb자바스크립트의 this keyword는 Java와 같은 익숙한 언어의 개념과 달라 개발자에게 혼란을 준다. Java에서의 this는 인스턴스 자신(self)을 가리키는 참조변수이다. this가 객체 자신에 대한 참조 값을poiemaweb.com 자바스크립트의 함수는 호출될 때, 매개변수로 전달되는 인자값 이외에, arguments 객체와 this를 암묵적으로 전달 받는다.function square(number) { console.log(arguments); console.log(this); return number * number; } square(2); Java에서의 this는 인스턴스 ..
https://poiemaweb.com/js-strict-mode Strict mode | PoiemaWebES5부터 strict mode가 추가되었다. strict mode는 자바스크립트 언어 문법을 보다 엄격히 적용하여 기존에는 무시되던 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를poiemaweb.com 1. strict mode란? function foo() { x = 10; } foo()console.log(x); // ? 변수 x의 선언이 존재하지 않기 때문에 ReferenceError를 throw할 것 같지만 자바스크립트 엔진은 암묵적으로 전역 객체에 프로퍼티 x를 동적 생성하며 식별자 x는 암묵적 전역 변수(implicit global)라 한다. 하지..
https://poiemaweb.com/js-scope Scope | PoiemaWeb스코프는 참조 대상 식별자(identifier, 변수, 함수의 이름과 같이 어떤 대상을 다른 대상과 식별할 수 있는 유일한 이름)를 찾아내기 위한 규칙으로 자바스크립트는 이 규칙대로 식별자를 찾는다.poiemaweb.com 1. 스코프란? 변수나 함수가 유효한 범위를 말합니다. 어디서 변수나 함수에 접근할 수 있는지를 결정짓는 범위를 의미합니다. var x = 'global';function foo () { var x = 'function scope'; console.log(x);}foo(); // function scopeconsole.log(x); // global 스코프는 변수나 함수의 이름 충돌을 방지하고,..

https://poiemaweb.com/js-prototype Prototype | PoiemaWeb자바스크립트의 모든 객체는 자신의 부모 역할을 하는 객체와 연결되어 있다. 그리고 이것은 마치 객체 지향의 상속 개념과 같이 부모 객체의 프로퍼티 또는 메소드를 상속받아 사용할 수 있게poiemaweb.com 1. 프로토타입 객체 Java와 C++은 클래스 기반 객체지향 프로그래밍 언어입니다. 객체를 생성하기 전에 클래스를 정의하고 이를 통해 객체(인스턴스)를 생성합니다. 자바스크립트는 이와 달리 프로토타입 기반 객체지향 프로그래밍 언어입니다. 클래스 없이도 객체를 생성할 수 있습니다. 모든 자바스크립트 객체는 부모 역할을 담당하는 프로토타입 객체와 연결되어 있습니다. 이 객체는 상속 개념과 유사하게 부모..
https://poiemaweb.com/js-type-check Type Checking | PoiemaWeb자바스크립트는 동적 타입(dynamic typed) 언어이므로 변수에 어떤 값이 할당될 지 예측하기 어렵다. 아래 코드를 살펴보자.poiemaweb.com 자바스크립트는 동적 타입(dynamic typed) 언어이므로 변수에 어떤 값이 할당될 지 예측하기 어렵다. function sum(a, b) { return a + b; } sum('x', 'y'); // 'xy' 숫자가 아닌 문자가 들어오더라도 에러없이 처리가 되어버린다. 1. typeof 타입 연산자(Type Operator) typeof는 피연산자의 데이터 타입을 문자열로 반환한다. typeof ''; ..

https://poiemaweb.com/js-function Function | PoiemaWeb함수란 어떤 특정 작업을 수행하기 위해 필요한 일련의 구문들을 그룹화하기 위한 개념이다. 만일 스크립트의 다른 부분에서도 동일한 작업을 반복적으로 수행해야 한다면 (동일한 구문을 계속poiemaweb.com 함수는 코드 블록으로, 이름과 매개변수를 가지며 필요할 때 호출하여 작업을 수행하는 독립적인 단위입니다. 코드 중복을 줄이고 재사용성을 높이는 데 중요한 역할을 하며, 자바스크립트에서는 일급 객체로 다루어져 변수에 할당하거나 다른 함수에 전달할 수 있습니다. 이로 인해 프로그래밍에서 유연성과 모듈화를 쉽게 구현할 수 있습니다. 1. 함수 정의 Function 생성자 함수함수 선언문함수 표현식 1.1 ..

https://poiemaweb.com/js-immutability Immutability | PoiemaWeb함수형 프로그래밍의 핵심 원리이다. 객체는 참조(reference) 형태로 전달하고 전달 받는다. 객체가 참조를 통해 공유되어 있다면 그 상태가 언제든지 변경될 수 있기 때문에 문제가 될 가능성도poiemaweb.com Immutability(변경불가성)는 객체가 생성된 이후 그 상태를 변경할 수 없는 디자인 패턴을 의미한다.Immutability은 함수형 프로그래밍의 핵심 원리이다. 문제 상황객체는 참조(reference) 형태로 전달하고 전달 받는다.객체가 참조를 통해 공유되어 있다면 그 상태가 언제든지 변경될 수 있다.“레퍼런스를 참조한 다른 객체에서 객체를 변경”하면 참조를 공유하는..

https://poiemaweb.com/js-object Object | PoiemaWeb자바스크립트는 객체(object)기반의 스크립트 언어이며 자바스크립트를 이루고 있는 거의 “모든 것”은 객체이다. 원시 타입(Primitives)을 제외한 나머지 값들(함수, 배열, 정규표현식 등)은 모두poiemaweb.com 1. 객체(Object)란?자바스크립트는 객체(object) 기반의 스크립트 언어이며, 거의 “모든 것”이 객체이다. 원시 타입(Primitives)을 제외한 나머지 값들(함수, 배열, 정규표현식 등)은 모두 객체이다. 객체는 키(key)과 값(value)으로 구성된 프로퍼티(Property)들의 집합데이터를 의미하는 프로퍼티(property)동작(behavior)을 의미하는 메소드(me..

https://poiemaweb.com/js-type-coercion Type coercion | PoiemaWeb자바스크립트의 모든 값은 타입이 있다. 값의 타입은 다른 타입으로 개발자에 의해 의도적으로 변환할 수 있다. 또는 자바스크립트 엔진에 의해 암묵적으로 자동 변환될 수 있다. 개발자에 의해poiemaweb.com 1. 타입 변환이란?자바스크립트의 모든 값은 타입을 가지며 변환 될 수 있다. 개발자의 의도 -> 명시적 타입 변환(Explicit coercion) / 타입 캐스팅(Type casting)자바스크립가 자동 ->암묵적 타입 변환(Implicit coercion) / 타입 강제 변환(Type coercion) 2. 암묵적 타입 변환 자바스크립트 엔진이 표현식을 에러없이 평가하기 위해..