목록Frontend/JavaScript (8)
초코레
해당 대상의 타입을 조회하는 API typeof MDN 문서 1 2 3 4 5 6 7 8 9 10 11 console.log(typeof 42); // expected output: "number" console.log(typeof 'blubber'); // expected output: "string" console.log(typeof true); // expected output: "boolean" console.log(typeof undeclaredVariable); // expected output: "undefined" cs
자바스크립트 객체를 그냥 넘길 때 [Object Object]로 표시되서 어떤 값인지 확인할 수 없다. JSON.stringify()를 사용하면 자바스크립트 객체를 문자열로 변환해줘서 어떤 값이 있고 그 변화를 추적하기 쉽다. 반대로 문자열을 자바스크립트 객체로 변환할 때는 JSON.parse()를 사용한다.
이벤트 버블링, 이벤트 캡처 그리고 이벤트 위임까지
callback 자바스크립트 비동기 처리와 콜백 함수 promise 자바스크립트 Promise 쉽게 이해하기 promise + generator async & await 자바스크립트 async와 await
객체 안에서 사용하는 this는 객체 자신을 가리킨다. 객체의 속성 안에서 다른 속성을 가리킬 때 사용한다. Vue의 함수 안에서 this는 해당 Vue의 data 속성을 가리킨다. console.log()로 Vue 인스턴스를 찍어보면 data 속성 안의 값이 바깥 레벨로 나와있는 걸 확인할 수 있다. The JavaScript this Keyword Understanding the “this” Keyword in JavaScript
생성자 함수의 형태는 함수명의 첫 글자를 대문자로 지정하고 new 연산자로 인스턴스를 생성한다 생성자 함수 Prototype
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 Object.defineProperty(obj, prop, descriptor); const object1 = {}; Object.defineProperty(object1, 'property1', { value: 42, writable: false }); object1.property1 = 77; // throws an error in strict mode console.log(object1.property1); // expected output: 42 cs 객체의 특정 속성의 동작을 재정의하는 API Object.defineProperty()
$(document).ready(function(){ }); $(function(){ }); 둘은 같은 구문 jQuery에서 많이 사용되기 때문에 축양형인 두번째 구문을 제공한다. 페이지 로딩이 끝났을 때 실행될 함수를 등록하는 곳을 의미 (function(){ })(); 퓨어 자바스크립트에서 항상 사용하는 것 즉시 실행 함수 표현(IIFE, Immediately Invoked Function Expression) 이 안의 코드를 하나의 스코프에 담고 바로 실행한다 참고 (function() { })() 의 의미는? 자바스크립트에서 이런 구문을 보신 적이 있으신가요? (function() { // 코드 })(); 제가 처음 이런 구문을 봤을 적엔 의아스러웠습니다. 괄호가 여기저기 겹쳐 붙어 있는 걸로 보..