본문 바로가기

Frontend/JavaScript30

[JS DeepDive] 2. 표현식과 문 1. 값 (Value)값은 식(표현식)이 평가되어 생성된 결과변수는 하나의 값을 저장하기 위해 확보한 메모리 공간var sum = 10 + 20; // sum의 결과값은 30 2. 리터럴 (Literal)리터럴은 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법ex) 아라비아 숫자, 알파벳, 한글 등3. 표현식표현식은 값으로 평가될 수 있는 문즉, 표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조리터럴은 값으로 평가되어 리터럴도 표현식이다.var x = 1 + 2;// 식별자 표현식 x는 3으로 평가리터럴과 표현식의 차이var score = 100; // 100은 리터럴로 표현식var score2 = 50 + 50 ; // 50 + 50은 리터럴과 연산자로 이뤄져있지만 .. 2025. 4. 5.
[JS] 11강 "Symbol" 알아보기 1. Symbol: 새로 추가된 원시 타입으로 유니크한 식별자를 만들어준다 2. 특징1) Symbol 값은 보이는게 같더라도 내부에서는 다른 값을 가진다.const sym1 = Symbol();const sym2 = Symbol();console.log(sym1);console.log(sym1 === sym2); //false 2) Symbol에 description을 줄 수 있다.const sym3 = Symbol('hi');console.log(sym3.description); // hiconsole.log(sym3); // Symbol(hi) desciprtion으로 이 Symbol 값이 어떤 값인 지 알게 해주며, 이 덕분에 디버깅할 때 사용이 가능해진다. 3) 어떠한 프로퍼티를 가지고 있는 지 .. 2025. 4. 2.
[JS] 10강 "undefined"와 "null" 알아보기 1. undefined: 아무 값도 할당받지 않은 상태 1) var 키워드로 선언한 변수는 호이스팅으로 올라간 후 undefined로 초기화됨. 그 이후 인터프레터가 해당 소스코드에 도달했을 때 할당한 값이 들어감console.log(a);var a = 5; 2) 변수를 선언한 값을 할당하지 않은 변수를 출력하면 undefined 반환됨let hello;console.log(hello); 이렇게 undefined는 개발자가 의도적으로 할당하기 위한 값이 아닌 js엔진이 변수를 초기화할 때 사용한다.그래서 개발자는 의도적으로 할당하는 것은 권장하지 않는다.  2. null: 비어있는, 존재하지 않는 값 NULL, Null과 다름의도적으로 변수에 값이 없다는 것을 명시함변수가 이전에 참조하던 값을 명시적으로.. 2025. 3. 30.
[JS] 9강 Event Loop 1. setTimeout(): 만료된 후 함수나 지정한 코드 조각을 실행하는 타이머를 설정함: 두 번째 매개변수로 들어간 초 단위가 지난 후 첫 번째 매개변수인 콜백 함수가 호출됨 // 동기console.log('1');// 비동기setTimeout(() => { console.log('2');}, 3000);// 동기console.log('3') 2. 동기와 비동기동기 (Synchronous, 시간을 맞춤)대학생이 되는 법1. 1학년2. 2학년3. 3학년4. 대학교 가기비동기 (Asynchronous, 시간을 맞추지 않음) 취직하는 방법1. 토익 공부2. 자격증 공부3. 취업 1) 둘의 차이: 동기는 먼저 이전의 것이 끝나야 다음 것을 할 수 있지만: 비동기는 1번을 하면서 2번을 할 수 도 있고, 3.. 2025. 3. 29.
[JS] 8강 자바스크립트 "bind","call","apply" 1. Call() 메소드함수를 호출하는 함수매개변수로 어떠한 것을 전달해주면 호출되는 함수의 this안에 window 객체가 아닌 전달받은 것을 받게 됨 // Call();const fullName = function(city, country) { console.log(this.firstName + ' ' + this.lastName , city , country);}const person1 = { firstName: 'John', lastName: 'Smith'}fullName.call(person1, "Oslo","Norway"); 2. Apply() 메소드call 메서드와 비슷하지만 인수 부분을 배열로 넣어줘야 함// Apply()const fullName = function(cit.. 2025. 3. 28.
[JS] 7강 자바스크립트 "this" 키워드 this키워드는 다양한 곳에서 이용이 되는데 사용하는 곳에 따라 가르키는 객체가 달라진다.this가 누구를 가르키는 지 예제와 함께 알아보자  1) 메소드에서 this 사용 -> 해당 객체를 가리킨다 (참조한다) // Method => Objectconst audio = { title: 'a', play() { console.log('play this', this); }}audio.play();audio.stop = function() { console.log('stop this', this);}audio.stop(); 2) 함수에서 this 사용 -> window 객체를 가리킨다// Function -> Window Objectfunction playAudio() { .. 2025. 3. 27.