Input + Output = True

😎Javascript] 'use strict' ✅ 엄격모드 (use strict) 'use strict'는 자바스크립트에서 엄격모드를 실행한다 엄격모드란 선언하지 않은 변수를 사용할 수 없게 되는 등 자바스크립트 엔진에 엄격한 기준이 적용되는 것을 말한다 엄격모드의 사용 여부에 따른 차이점을 살펴보자 function test() { x = 5 } test() console.log(x) // 5 선언되지 않은 변수 x를 사용했기 때문에 에러가 출력될 것 같지만 실행해보면 정상 작동한다 자바스크립트 엔진이 암묵적으로 전역 변수를 생성하기 때문에 정상 작동하게 된다그렇기 때문에 아래의 코드는 true가 된다 function test() { x = 5 } test() console.log(x) // 5 cons..

😎Javascript] 자바스크립트 메모리 구조 - 콜 스택, 메모리 힙 메모리 (RAM) - Random Access Memory 기본적으로 컴퓨터의 데이터를 저장하고 처리하는 역할을 하며 데이터 처리 속도가 빠르지만 컴퓨터 또는 해당 프로그램이 종료되면 저장된 데이터가 모두 사라진다 ✅ 콜 스택, 메모리 힙이란? 1. 콜스택(Call Stack) 원시타입 데이터가 저장된다(string, number, boolean, null, undefined, bigint, symbol) 실행컨텍스트(Execution Context)를 통해 아래 작업들을 제어한다 변수 식별자(이름) 저장 스코프 체인 및 this 관리 코드 실행 순서 관리 등을 수행 2. 메모리 힙(Memory Heap) 참조타입 데이터가 저장된다..

😎Javascript] 스코프, 스코프체인, 렉시컬 스코프 ✅ 스코프 Scope 스코프 (Scope) - 범위 Javascript에서 스코프란 ‘식별자(변수)에 접근할 수 있는 유효범위’를 뜻한다. 자바스크립트 스코프는 2가지 타입이 있다. 1. Global (전역) 2. Local (지역) 전역 스코프(Global Scope)는 전역에 선언되어 있어 어느 곳에서나 해당 변수에 접근할 수 있고 지역 스코프(Local Scope)는 해당 지역에서만 접근할 수 있다. let a = "global" function aPrint() { let a = "local" console.log(`aPrint : ${a}`) } aPrint() //aPrint : local console.log(`global : ${a}..

😎Javascript] 자바스크립트 this this는 함수 호출 방식에 의해 결정된다. ✅ this 란? this는 함수 호출 방식에 의해 결정된다. 자바스크립트에서 this는 기본적으로는 전역객체(브라우저에서는 window)이다. this를 찍어보자. this // Window {...} 함수의 this는 어떨까? function a() { console.log(this) } a() // Window {...} 이처럼 일반 함수내의 this는 window를 가리킨다. (strict 모드일 경우는 undefined이다.) 그렇다면 this가 window가 아닌 경우는 무엇이 있을까? ✅ 객체 메서드의 this const obj = { a: function() { console.log(this) } } ..

😎 Parameter와 Argument의 차이 Parameter와 Argument는 프로그래밍에서 자주 사용되는 용어이고 이 둘은 서로 비슷한 개념이지만, 다른 의미를 가지고 있다. Parameter는 함수를 정의할 때 사용되는 변수 이름이며 (인수) Argument는 함수를 호출할 때 전달되는 실제 값이다. (인자) function sum(a, b) { // Parameter return a + b; } sum(1, 2) // Argument

😎 자바스크립트 호이스팅과 TDZ ✅ 호이스팅 호이스팅(Hoisting) 코드 실행 전 변수와 함수의 메모리 공간을 미리 할당하는 것. 코드에서 선언된 위치와 상관없이 변수 및 함수를 사용할 수 있다는 의미이다. 즉, 변수 및 함수 선언이 스코프의 최상단으로 끌어올려지는 것 같은 현상을 의미한다. 호이스팅 규칙 호이스팅은 크게 함수 호이스팅과 변수 호이스팅으로 나뉜다. 선언된 함수는 상단에서 참조, 호출 가능. 선언된 var 는 상단에서 참조, 할당 가능. 선언된 let, const 는 상단에서 참조, 할당 불가능. [함수 선언문과 함수 표현식에서 호이스팅 방식의 차이] function declaration(){ //함수 선언문 console.log('함수 선언문') } declaration() cons..

😎자바스크립트 Promise async await 설명 및 예제 ✅ JavaScript Promise 란? JavaScript Promise는 비동기 처리에 사용되는 객체이다. 어떤 작업이 완료되기를 기다리고 그 작업이 완료되면 결과를 반환한다. 즉, Promise는 비동기 함수의 결과를 처리하는데 사용된다. Promise는 다음과 같은 특징이 있다. 비동기 처리 결과를 나타내는 객체 Promise의 상태는 대기(Pending), 이행(Fulfilled), 거부(Rejected) 세 가지 상태 중 하나를 갖는다. Promise는 단 한 번만 상태를 변경할 수 있다. Promise는 대기(Pending) 상태에서 시작해 이행(Fulfilled) 또는 거부(Rejected) 상태 중 하나로 변경된다. 이행 ..

자바스크립트 조건문은 if, switch 등 많이 있고, 오늘은 그 중 연산자 조건문을 알아보자 자바스크립트 삼항연산자 const isState = true isState ? true일 경우 실행문 : false일 경우 실행문 // false일 경우 아무것도 실행하지 않고 싶을 경우엔 보통 이렇게 사용한다 isState ? true일 경우 실행문 : null 삼항연산자에서 어떠한 경우에 아무것도 실행하고 싶지 않을 땐 위의 내용처럼 null을 사용해서 아무것도 아니라는 명시를 해주는 경우가 많다. 생략 가능한 코드라고 생각된다. 이럴 땐 아래의 방법을 사용해보자 자바스크립트 이항연산자 const isState = true isState && true일 경우 실행문 // 조건과 && 표시를 사용해서 조건에..

😎 자바스크립트 비동기 원리 - 싱글스레드 비동기 스레드(thread) 어떠한 프로그램 내에서, 특히 프로세스 내에서 실행되는 흐름의 단위를 말한다. 일반적으로 한 프로그램은 하나의 스레드를 가지고 있지만, 프로그램 환경에 따라 둘 이상의 스레드를 동시에 실행할 수 있다. 이러한 실행 방식을 멀티스레드(multithread)라고 한다. -위키백과- 자바스크립트는 '단일 스레드' 기반의 언어다. 스레드가 하나라는 말은, 동시에 하나의 작업만 처리할 수 있다는 의미이다. 그런데 자바스크립트가 사용되는 웹사이트들을 보면 HTTP 요청 전송, 애니메이션, 버튼 클릭 등 다양한 일들을 동시에 처리한다. 자바스크립트가 싱글 스레드임에도 이렇게 동시 처리가 가능한 이유를 알아보자. ✅ Event Loop 가장 먼저 ..

😎 옵셔널 체이닝이란? ✅ 옵셔널 체이닝?. 옵셔널 체이닝(optional chaining) ?. 을 사용하면 프로퍼티가 없는 중첩 객체를 에러 없이 안전하게 접근할 수 있습니다. ex) user.getAddress?.() ✅ 옵셔널 체이닝이 필요한 이유 없는 정보 사용자가 여러 명 있고, 그중 몇 명은 주소 정보를 가지고 있지 않다고 가정해보자. 이럴 때 user.address.street를 사용해 주소 정보에 접근하면 에러가 발생할 수 있다. let user = {} //주소 정보가 없는 사용자 console.log(user.address.street) //TypeError: Cannot read property 'street' of undefined 아직 그려지지 않은 DOM 또 다른 상황으로는 자..