생성자 함수생성자 함수는 말 그대로 객체를 생성하는 함수,new 키워드와 함께 사용되어 새로운 인스턴스를 만들어냅니다생성자 함수로 만들어진 객체 = 인스턴스 function Person(name = "unknown") { this.name = name; this.getName = function () { return this.name; };}const user1 = new Person(); // new 키워드로 인해 함수의 리턴 결과가 객체가 됨console.log(user1);console.log(user1.name);생성자 함수 이름의 첫 글자는 대문자로 시작하는 규칙이 있습니다. 프로토타입생성자 함수로 여러 인스턴스를 만들 때, 각 인스턴스에 공통으로 필요한 함수가 있다면 어떻게 될까요?..

변수 보호와 은닉의 필요성일반적으로 전역 변수는 어디서든 접근하고 수정할 수 있다는 위험이 있습니다.그렇다면 변수를 전역이 아닌, 함수 내부에 선언하면 어떨까요?function levelup() { let level = 1; // 함수가 실행될 때마다 초기화 level += 1; return level;}let level = levelup();level = levelup();console.log(level); // 여전히 2 level 변수가 함수가 호출될 때마다 새로 생성되기 때문에 상태를 유지하지 못합니다.여기서 변수의 상태를 유지하면서 외부로부터 보호하는 방법이 바로 클로저입니다. 클로저가 필요한 이유#데이터 은닉 - 외부에서 데이터에 직접 접근 불가 #상태 유지 - 함수 호출 간 변수를 계..

실행 컨텍스트와 콜 스택자바스크립트 코드가 실행되는 환경을 실행 컨텍스트라고 합니다. 자바스크립트 코드가 실행되면 가장 먼저 전역 실행 컨텍스트가 생성되어 콜 스택에 들어갑니다.이후 함수가 호출될 때마다 해당 함수의 함수 실행 컨텍스트가 생성되어 콜 스택의 맨 위에 순서대로 쌓입니다.이 실행 컨텍스트들은 콜 스택에 쌓이고 사라지면서 코드 실행 순서를 제어합니다. (FILO 순서)실행 컨텍스트코드를 실행하는 데 필요한 변수, 함수 등을 담는 박스콜 스택실행 컨텍스트들을 차례대로 쌓아 올리는 공간FILO(First In, Last Out): 마지막에 들어간 컨텍스트가 가장 먼저 제거되는 원리로 동작합니다. 컨텍스트의 구성실행 컨텍스트는 Lexical 환경을 가지고 있고, 렉시컬 환경은 두 가지로 나뉩니다.R..

JS에서는 C++과 같이 arr[n][n]으로 2차원 배열을 생성할 수 없습니다! 대신 배열안에 배열을 선언하는, 비슷해 보이지만 엄연히 다른 방식으로 생성해야하죠 반복문을 이용한 방법let gameBoard = new Array(m); // m은 행의 개수for(let i = 0; i 위와 같이 개수가 명시된 배열을 생성하고, 그 배열을 반복문으로 돌면서 배열 내부에 배열을 만들어주는 방식으로 선언할 수 있습니다.잘못된 .fill 을 이용한 방법 (하면안됨)// 이 방법은 얕은 복사 문제를 일으킬 수 있습니다let gameBoard = new Array(m).fill(new Array(n).fill(""));// gameBoard[0][0] = "X"; 라고 하면, 모든 행의 첫 번째 요소가 "X"로 ..

단축 속성명단축 속성명(Shorthand Property Names)은 ECMAScript 2015 (ES6)에서 도입된 JavaScript 문법으로, 객체 리터럴(object literal)을 정의할 때 객체의 속성 이름(key)과 그 속성에 할당하려는 변수(또는 상수)의 이름이 동일한 경우 코드를 더 간결하게 작성할 수 있게 해주는 기능입니다.핵심 규칙:객체 리터럴 내에서 { 속성명: 변수명 }과 같이 작성해야 할 때, 만약 속성명과 변수명이 같다면, 간단히 { 변수명 } 이라고만 작성할 수 있습니다.// ES6 이전let x = 10;let y = 20;let point1 = { x: x, // 속성명 'x'와 변수명 'x'가 같음 y: y // 속성명 'y'와 변수명 'y'가 같음};cons..

JavaScript 객체 리터럴 (Object Literal)1. 정의객체 리터럴(Object Literal)은 JavaScript에서 중괄호({})를 사용하여 객체를 직접 생성하는 표기법입니다. 이는 new Object() 생성자를 사용하는 방식보다 간결하게 객체를 표현하고 초기화할 수 있는 방법입니다. 2. 기본 구조객체 리터럴은 0개 이상의 속성(property) 목록을 중괄호 내에 정의하며, 각 속성은 키(key) 와 값(value) 의 쌍으로 이루어지고 콜론(:)으로 구분됩니다. 속성들은 쉼표(,)로 분리됩니다. { key1: value1, key2: value2, // ... keyN: valueN}Key: 속성을 식별하는 이름으로, 일반적으로 문자열(String) 또는 심볼(Symbo..

참조 타입(Reference Types)과 const객체(Object) 및 배열은 참조 타입입니다. 참조 타입 변수는 데이터 값 자체가 아니라 해당 객체 또는 배열이 실제 저장된 메모리 위치를 가리키는 주소를 참조해 저장합니다.const로 참조 타입 변수를 선언할 경우, 변수에 저장된 메모리 주소 자체를 다른 주소로 재할당하는 것은 금지됩니다.const configuration = { version: 1, enabled: true };// configuration 변수가 다른 객체를 참조하도록 재할당 시도 -> 에러 발생configuration = { version: 2, enabled: false }; // TypeError: Assignment to constant variable.const data..

for...of 반복문이란?목적: 반복 가능한객체의 요소 값들을 하나씩 순서대로 접근하여 반복 작업을 수행하기 위한 구문입니다. 반복 가능한 객체(Iterables): for...of로 순회할 수 있는 대표적인 객체들은 다음과 같습니다.배열 (Array)문자열 (String) (각 문자를 순회)맵 (Map) (각 [key, value] 쌍을 순회)셋 (Set) (각 요소를 순회)arguments 객체 (함수 내에서 사용)NodeList (브라우저 DOM 관련)사용자가 직접 정의한 반복 가능한 객체핵심 특징: 인덱스(i)나 키(key)를 직접 관리할 필요 없이,컬렉션 안의 실제 데이터 값에 바로 접근할 수 있다는 점이 매우 편리합니다. 기본 문법:for (const 변수 of 반복가능한객체) { // 각..

forEach() 메서드기능: 배열의 각 요소에 대해 주어진 콜백 함수를 순서대로 한 번씩 실행하는 반복 메서드입니다.목적: 배열의 모든 요소를 가지고 어떤 작업(주로 부수 효과가 있는 작업)을 수행하고 싶을 때 사용합니다. 예를 들어, 각 요소를 콘솔에 출력하거나, 각 요소를 사용하여 외부 변수의 값을 업데이트하는 등의 작업을 할 수 있습니다.반환값: forEach() 메서드 자체는 항상 undefined를 반환합니다. map() 메서드처럼 새로운 배열을 생성하여 반환하지 않습니다.원본 배열 변경: forEach() 메서드 자체는 원본 배열을 직접 변경하지 않습니다. 하지만 콜백 함수 내부에서 원본 배열의 요소를 변경하는 코드를 작성하는 것은 가능합니다 (권장되지는 않는 경우가 많습니다).기본 문법ar..

서론JavaScript의 Array.prototype.map() 메서드는 배열의 각 요소를 주어진 함수에 전달하고, 그 함수의 반환값으로 구성된 새로운 배열을 생성하는 고차 함수입니다. 이는 원본 배열을 변경하지 않고 배열 데이터를 변환하는 데 필수적인 기능입니다. 본 문서는 map() 메서드의 구문, 콜백 함수의 인수, 화살표 함수와의 관계, 중첩 사용 및 주의사항을 기술합니다. 1. map() 기본 사용법map() 메서드는 배열의 각 요소에 대해 콜백 함수를 한 번씩 실행하고, 각 함수의 반환값을 모아 새로운 배열을 생성합니다.기본 구문:let newArray = originalArray.map(callbackFunction);주요 특징:- 항상 새로운 배열을 반환합니다.- 호출된 원본 배열 ..