개발개굴🐸

객체 리터럴에 의한 객체 생성방식은 가장 일반적으고 간단한 객체 생성 방식입니다. 하지만, 이외에도 다양한 방법으로 객체를 생성할 수 있고 각각의 장단점이 존재합니다. ** 객체 리터럴에 의한 객체 생성 방식에 대한 자세한 내용은 아래를 참고하세요. https://j-su2.tistory.com/56?category=1037205 [JavaScript] 객체 리터럴 객체란? 자바스크립트는 개체기반의 프로그래밍 언어로, 원시 값을 제외한 모든 값은 객체타입입니다. 이는 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조로 원시 값과 다르게 j-su2.tistory.com Object 생성자 함수 new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환합니다. 이후 프로퍼티 ..

내부 슬롯(internal slot)과 내부 메서드(internal method)란? 자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 의사 프로퍼티와 의사 메서드로, 이중 대괄호 ([[ ... ]])로 감싼 이름들이 내부 슬롯과 내부 메서드입니다. const o = {}; o.[[Prototype]] // -> Uncaught SyntaxError 0.__proto__ // -> Object.prototype 위의 예제와 같이 자바스크립트 엔진의 내부 로직인 내부 슬롯과 내부 메서드는 직접적으로 접근하거나 호출할 수 없지만, [[Prototype]] 내부 슬롯의 경우 __proto__를 통해 간접적으로 접근 가능한 것 처럼 일부는 접근 수단을 제공합니다. 프로퍼티 ..

var 키워드로 선언한 변수의 문제점 ES5까지 변수를 선언할 수 있는 유일한 방법은 var 키워드를 사용하는 것이었습니다. 다음과 같은 var 키워드의 독특한 특징들은 주의를 기울이지 않으면 심각한 문제를 발생시킬 수 있습니다. 변수 중복 선언 허용 var 키워드로 선언한 변수는 중복 선언이 가능해서 의도치 않게 먼저 선언된 변수의 값이 변경되는 부작용이 발생합니다. var x = 1; var y = 1; // var 키워드가 없는 것처럼 동작 var x = 100; // 초기화문이 없는 변수 선언문은 무시됨 var y; console.log(x); // 100 console.log(y); // 1 x와 y가 중복 선언됨 x는 초기화문이 있어서 var 키워드가 없는 것처럼 동작해 100으로 값이 변경됨..

변수의 생명 주기 변수는 생물과 유사하게 생성되고 소멸되는 생명 주기를 가지고 있고 자신이 선언된 위치에서 생성되고 소멸됩니다. 변수의 생명 주기는 메모리 공간이 확보된 시점부터 메모리 공간이 해제되어 가용 메모리 풀에 반환되는 시점까지를 의미합니다. 종류 생명 주기 지역 변수 - 함수의 생명 주기와 대부분 일치 - 함수가 호출되면 생성되고 함수가 종료하면 소멸 전역 변수 - *전역 객체의 생명 주기와 일치 - 코드가 로드되자마자 곧바로 해석되고 실행됨 - 애플리케이션의 생명 주기와 같음 *전역 객체 : 코드가 실행되기 이전 단계에 자바스크립트 엔진에 의해 어떤 객체보다도 먼저 생성되는 특수한 객체. 브라우저 환경은 window 객체, Node.js 환경에서는 global 객체를 의미함 전역 변수의 문제..

스코프(Scope)란? 스코프는 직역하자면 "범위"라는 뜻이고, 자바스크립트에서의 스코프는 식별자가 유효한 범위를 뜻합니다. 변수 이름, 함수 이름, 클래스 이름 등 모든 식별자는 자신이 선언된 위치에 의해 다른 코드가 식벽자 자신을 참조할 수 있는 유효 범위가 결정되는데 이 유효 범위가 스코프입니다. // 전역 변수 var x = 'global'; function foo() { // 지역 변수 var x = 'local'; console.log(x); // "local" } console.log(x); // "global" 자바스크립트 엔진은 이름이 같은 두 개의 변수 중에서 어떤 변수를 참조해야 할 것인지 식별자 결정해야함 스코프는 자바스크립트 엔진이 식별자를 검색할 때 사용하는 규칙 스코프 내에서 ..

함수란? 수학의 함수는 "입력"을 받아 "출력"을 내보내는 일련의 과정을 정의한 것입니다. 프로그래밍 언어의 함수도 이와 같은 개념인데 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것입니다. // 함수 선언 function add(x,y) { return x + y; } // 함수 호출 add(2,5); // 반환값 7 함수는 함수 정의를 통해 생성되고 인수를 매개변수를 통해 함수에 전달하면서 함수의 실행을 명시적으로 지시하는 함수 호출을 진행하면 코드 블록에 담긴 문들이 일괄적으로 실행되고 실행 결과인 반환값을 반환합니다. 식별자 : 함수를 구분하는 함수 이름 (add) 매개변수(parameter) : 함수 내부로 입력을 전달받는 변수(x,y) 인수(argument) ..

원시값과 객체의 차이점 원시값과 객체의 특징을 자세히 알아보기 앞서 차이점을 표로 정리해 보겠습니다. 원시값 객체 타입 변경 불가능한 값 변경 가능한 값 변수에 할당하면 변수에 실제 값이 저장됨 변수에 할당하면 변수에 참조값이 저장됨 다른 변수에 할당하면 원시 값이 복사되어 전달 다른 변수에 할당하면 참조 값이 복사되어 전달(참조에 의한 전달) 원시 값의 특징 변경 불가능한 값 한번 생성된 원시 값은 읽기 전용값으로 원시 타입의 값은 변경이 불가능한 값입니다. 값은 변수에 저장된 데이터로서 표현식이 평가되어 생성된 결과를 말하기 때문에 변경 불가능하다는 것은 변수가 아니라 원시 값 자체를 변경할 수 없다는 것입니다. 따라서 불변성을 갖는 원시 값을 할당한 변수는 재할당 이외에 변수 값을 변경할 수 있는 ..

객체란? 자바스크립트는 개체기반의 프로그래밍 언어로, 원시 값을 제외한 모든 값은 객체타입입니다. 이는 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조로 원시 값과 다르게 변경 가능한 값입니다. 객체를 정의하자면 프로퍼티와 메서드로 구성된 집합체입니다. 프로퍼티 : 객체의 상태를 나타내는 값. key과 value로 구성. 메서드 : 프로퍼티(상태 데이터)를 참조하고 조작할 수 있는 동작. var counter = { num: 0, increase() { this.num++; } }; 위의 예시와 같이 객체는 상태와 동작을 하나의 단위로 구조화 할 수 있어서 유용합니다. 객체 리터럴에 의한 객체 생성 자바스크립트는 프로토타입 기반 객체지향 언어로서 다양한 객체 생성 방법을 지원합니다. 객체 *리..