sohyeon kim

resolve : 성공 시 실행 함수 reject : 실패 시 실행 함수 ❗️ 이렇게 어떤 일이 완료된 후 실행되는 함수를 callback 함수라 한다. // 새로운 Promise가 만들어질 때는 , executor(내가 전달한 콜백 함수)가 바로 실행된다 const promise = new Promise((resolve, reject) => { // doing some heavy work (network, read files) // 네트워크를 이용하거나 파일을 읽어오는 활동을 할 땐 시간이 오래 걸리니 // 실행이 완료된 후 넘어가는 동기적이 아니라 // 실행이 완료되지 않아도 다음으로 넘어가게 비동기적 함수를 이용해야 한다. console.log(`doing someting...`); setTimeo..

: ES6에 추가된 스펙 : 이전에 비슷한 객체를 만들 때 사용했던 생성자 함수 대신 쓸 수 있다! 기존 생성자 함수 사용 const User = function (name, age) { this.name = name; this.age = age; this.showName = function () { console.log(this.name); }; }; const aoto = new User("aoto", 30); console.log(aoto.name); // "aoto" class 사용 constructor : 객체를 만들어 주는 생성자 메서드 class User2 { constructor(name, age) { this.name = name; // 객체를 초기화하는 값 this.age = age; ..

hasOwnProperty : 객체에 특정 프로퍼티를 가지고 있는지 확인하는 메서드 const user = { name: "aoto", }; console.log(user.name); // aoto console.log(user.hasOwnProperty("name")); // true console.log(user.hasOwnProperty("age")); // false 이 hasOwnProperty는 만든 적이 없는데 어디에 있는걸까? >> __proto__ 객체 안에 있다! const user = { name: "aoto", // __proto__: Object 이런 식으로 생각하면 된다. }; ❗️ 객체에서 특정 프로퍼티를 읽으려 할 때 없으면, __proto__ 안에서 찾는다. ❗️ 만약 ha..

: 함수 호출 방식과 관계 없이 this를 지정할 수 있다! call : 모든 함수에서 사용할 수 있으며, this를 특정 값으로 지정할 수 있다. const aoto = { name: "aoto", }; const yae = { name: "yae", }; function showThisName() { console.log(this.name); } showThisName(); // 빈 값이 반환된다. 여기서 this는 window이기 때문. showThisName.call(aoto); // "aoto" this => aoto showThisName.call(yae); // "yae" this => yae function update(birthYear, ocuupation) { this.birthYear..

setTimeout : 일정 시간이 지난 후 함수 실행 function fn() { console.log("hi"); } setTimeout(fn, 3000); // 위와 같음 setTimeout(function () { console.log("hi"); }, 3000); ❗️ 인수가 필요하다면? : 세 번째에 값을 넣는다. function showName(name) { console.log(name); // "aoto" } setTimeout(showName, 3000, "aoto"); clearTimeout : 예정된 타임아웃을 없앤다. function showName(name) { console.log(name); } const tId = setTimeout(showName, 3000, "aoto"..

자바스크립트는 어휘적 환경을 갖는다. 어휘적 환경 Lexical Environment let one; // undefined one = 1; // 1 function addOne(num) { console.log(one + num); } addOne(5); // 6 // 전역 Lexical 환경 // one : 1 // addOne : function // ^ 전역 Lexical 환경을 참조함 !!! 참조 순서 : 내부 > 외부 > 전역 // 내부 Lexical 환경 // num : 5 function makeAdder(x) { return function (y) { // y를 가지고 있고, 상위함수인 makeAdder의 x에 접근 가능 return x + y; }; } const add3 = makeA..

자주 쓰이는 문법들을 알아보자 ~ function showName(name) { console.log(name); } showName("aoto"); // "aoto" showName("aoto", "yae"); // Error는 안뜨지만 aoto만 뜬다. showName(); // undefined 매개변수에 name만 쓰여있지만, 매개변수를 넘길 때 개수 제한은 없어 더 많거나 적은 값을 넘겨도 Error가 발생하지 않는다. arguments - 함수로 넘어온 모든 인수에 접근할 수 있다. - 함수 내에서 이용 가능한 지역 변수이다. - length / index가 있어서 배열이라 생각할 수 있지만 - 실은 Array 형태의 객체 - 그러니 배열의 내장 메서드 없음(forEach, map) funct..

: 배열이나 객체의 속성을 분해해서 분해된 값을 변수에 담은 표현식 💡 배열 구조 분해 let [x, y] = [1, 2]; console.log(x); // 1 console.log(y); // 2 let users = ["aoto", "yae", "haru"]; let [user1, user2, user3] = users; console.log(user1); // "aoto" console.log(user2); // "yae" console.log(user3); // "haru" let str = "aoto-yae"; let [man1, man2] = str.split("-"); console.log(man1); // "aoto" console.log(man2); // "yae" ❗️ 해당하는 값이 ..

💡 arr.splice(n, m) : 인덱스 n번부터 m개 특정 요소 지움 ❗️ 문자열에는 사용 XXX let arr = [1, 2, 3, 4, 5]; arr.splice(1, 2); console.log(arr); // [1,4,5] ➕ arr.splice(n, m, x) : 특정 요소를 지우고 지워진 자리에 x 추가 let arr = [1, 2, 3, 4, 5]; arr.splice(1, 3, 100, 200); console.log(arr); // [1, 100, 200, 5] // 여기서 m이 0이라면? 아무것도 지우지 않고 요소 추가 가능! let arr = ["나는", "호수", "입니다"]; arr.splice(1, 0, "대한민국", "소방관"); console.log(arr); // ['..

' 작은 따옴표 " 큰 따옴표 ` 벡틱 html 코드 같은 경우 작은 따옴표로 묶는게 편하다. let html = 'TITLE'; // 중간에 큰따옴표가 있으므로 영어로 된 문장은 큰 따옴표를 쓰는게 편하다. let desc = "It's 3 o'clock."; 벡틱은 달러와 중괄호를 이용해 변수를 표현하거나 표현식을 쓸 수 있다. let name = "aoto"; let result = `my name is ${name}.`; // my name is aoto. let add = `2 더하기 3은 ${2 + 3}입니다.`; // 2 더하기 3은 5입니다. 벡틱은 쉽게 여러 줄을 표현할 수 있다! let desc = `오늘은 맑고 화창한 날씨가 계속 되겠습니다.`; let desc2 = "오늘은 맑고 화..