ES6

📌 getter, setter- 오브젝트 내의 함수들을 괄호 없이 쓸 수 있게 만들어주는 키워드- 데이터의 무결성을 보존하기 위해 쓰는 키워드 원본 데이터는 immutable 해야 한다. (immutable  = 불변)데이터를 수정하거나 출력할 때 직접 원본 데이터를 만지는 것이 아니라 함수로 간접적으로 다루는 게 대세이다. 📌 함수로 object 데이터 꺼내기var 사람 = { name : 'Kim', age : 30, nextAge(){ return this.age + 1 }} nextAge 는 내년 나이를 출력해주는 함수이다.   🔎 굳이 왜 nextAge 를 활용할까?- object 안의 데이터가 복잡할 수록 함수를 이용하는 것이 데이터를 꺼내기가 쉽다.- 내부에 있는 name,..

📌 class 문법 사용 하는 방법class 부모 { constructor(){ this.name = 'Kim' }}var 자식 = new 부모(); 📌 상속 가능한 함수를 추가하려면?sayHi 라는 함수를 상속가능한 함수를 추가하려면, class를 배우기 이전에는1. constructor 안에 this.sayHi 형식으로 추가하기2. prototype 에 추가하기두 가지 방법이 있었다. class 를 활용하면,1번은 아래와 같이 쓴다. (constructor 안에 정의!)class 부모 { constructor(){ this.name = 'Kim'; this.sayHi = function(){ console.log('hello') } }}var 자식 = new 부모(); 새로..

cunstructor = 오브젝트를 복사해서 찍어낼 수 있는 새로운 문법object 자료 복사 기계를 만들 땐 function 이라는 함수만드는 키워드를 빌려서 이용하면 된다. 학생부를 찍어낸다고 가정하면,아래와 같이 만들면 된다.this 는 새로 생성되는 오브젝트(= 인스턴스) 를 뜻한다. function makePerson() { this.name = 'kim'; this.age = 20;} 이제 makePerson 이라는 자료 복사 기계에서 새로운 오브젝트를 뽑고 싶다면?new 키워드 활용하면 된다.// constructorfunction makePerson() { this.name = 'kim'; this.age = 20;} var person1 = new makePerson();var ..

Spread Operator (... 연산자) : 괄호를 제거해주는 연산자 var arr = ['hello', 'world'];console.log(arr);console.log(...arr);  문자에 붙이면 어떻게 될까?var str = 'hello';console.log(...str); console.log('h', 'e', 'l', 'l', 'o'); 를 출력 하는 것과 동일하게 출력된다. 문자도 array 와 비슷하다. array 처럼 인덱스를 붙여서 출력할 수 있다.  어디에 활용할까?1) Array 합치기/복사var arr1 = [1, 2, 3];var arr2 = [4, 5, 6];var arr3 = [...arr1, ...arr2]; var arr1 = [1, 2, 3];var arr2 ..

문자와 변수를 구분하여 추출할 때 유용한 기능이다. var name = '홍길동';function 해체분석기(문자들,변수들) { console.log('문자들 > ', 문자들); console.log('변수들 > ', 변수들);}해체분석기`안녕하세요. 제 이름은 ${name} 입니다`; 함수를 실행시킬 때 소괄호가 아니라 ` (백틱) 문자를 붙이면 된다. 첫번째 파라미터는 `백틱` 내의 순수 문자만 골라서 Array 로 만들어 놓은 파라미터두번째 파라미터는 `백틱` 내의 ${} 변수를 담는 파라미터이다.

📌 var, let, constvarlet const재선언 O재선언 X재선언 X재할당 O재할당 O재할당 Xfunction (함수레벨){ } (블록레벨) { } (블록레벨)  let, const 는 var 에 비해 엄격하다! 라고 기억하면 편하다. const 로 오브젝트를 선언하면, 오브젝트 자체를 재할당하는 것은 불가능하나, 오브젝트 내의 데이터는 변경 가능하다. 만약에 오브젝트 내의 데이터도 변경 불가능하게 하고 싶다면 ?Object.freez() 라는 자바스크립트 기본함수 사용 (오브젝트 내의 오브젝트 까지 freeze 하진 않음) if 문 내에서 쓴 var 은 if 문 밖에서도 쓸 수 있다.function test () { var a = 'a';}if (true) { var age = ..

📌 기본함수 & arrow fuction 선언 및 호출// 자바스크립트에서 함수를 만드는 방법 두 가지// 1)function test () { console.log('test 함수 입니다.')}// 2)var test2 = function () { console.log('test2 함수 입니다.');}// 함수 실행하는 방법test();test2();// arrow fuctionvar test3 = () => { console.log('test3 함수입니다.')}// 화살표 함수의 실행test3();  📌 arrow function 을 쓰는 이유1. 함수 본연의 기능을 아주 잘 표현함function 문법을 사용하는 이유?1) 여러가지 기능을 하는 코드를 한 단어로 묶고 싶을 때 (+..

결론 빨리 알고 싶을 땐 정리 로 이동해서 보믄 된다 📌 그냥 쓸 때 : window 태그 안에 바로 this 를 쓰면 window를 뜻한다 📌 일반 함수 : window window란?window 는 모든 전역변수, 함수, DOM을 보관하고 관리하는 전역객체이다. 전역변수를 선언하면 window 객체에 저장된다. 함수도 마찬가지이다. 🔎 그냥 쓰거나, 함수 안에서의 this 는 window 를 뜻한다 📌 strict mode 일 때 함수 안에서의 this : undefined strcit mode에선 var 키워드 없이 변수를 선언하거나, 변수를 arguments라는 키워드로 선언하거나 하는 실수들을 방지해준다. 📌 method(오브젝트 내의 함수) 안에서의 this : 해당 오브젝트 그 자체..