[011] KB IT’s Your Life - ES6

 
2024.05.22(수)
 
교재는 원쌤의 Vue.js 퀵스타트
Vue.js를 위한 ES6
 
오늘 유독 머리에 안 들어와서,
내일 수업 전 한 번 더 꼼꼼히 읽어볼 예정

>> 완료
 
.
.
.
 

교육: ES6

 
let과 const
 
호이스팅: 끌어올리다 / var로 만든 변수의 특징
 
함수 단위로 호이스팅하면 문제점은?
- 블록 단위로 동작하지 않음
- 진정한 지역변수가 아님
--> let 변수 도입
 
var 변수 (let 아님)
ES6에서 도입한 블록 단위의 변수 선언
- 유효 번위 = 블록 단위
- 선언하지 않으면 에러 발생
 
프리미티브 타입: 변수 공간에 '값'이 있음
참조 타입: 변수 공간에 '주소'가 있음
 
scope: 범위, 변수에 접근할 수 있는 범위
 
기본 파라미터와 가변 파라미터
 
기본 파라미터(Default Parameter)
- 함수 호출 시 인수를 생략했을 때 가지는 기본값 지정
 
가변 파라미터(Rest Parameter)
- 매개변수의 개수에 제한 X
- 매개변수 앞에 ... 연산자 지정(1개만)
- 실체는 배열이다!
 
구조분해 할당 > 화살표 함수 > 템플릿 리터럴 > 모듈 > Promise > Proxy
 
전개 연산자
...연산자 (=복사라고 생각)
 
02-23.js 문제
let obj1 = {name: "박문수", age: 29 };
let obj3 = {...obj1}; // 객체 내부의 값을 복사하지만 obj1, obj2은 다른 객체
 

---

 
객체
 
배열의 구성: 인덱스와 요소

[011] KB IT’s Your Life - ES6

 
객체와 배열:
- 배열은 객체를 기반으로 함
- 배열은 요소에 인덱스로 접근
- 객체는 요소에 키로 접근
 
메서드
객체의 속성 중 함수 자료형인 속성
 
속성과 메서드의 구분:
- 객체 person: name 속성, eat 속성
- eat 속성은 함수 자료형이므로 eat() 메서드라 부름 
 
★this 키워드★
 
자기 자신이 가진 속성을 출력하고 싶을 때
지역변수관계 scope > 전역 scope 순으로 값을 찾음
 
this는 메서드를 호출할 때 결정됨
점 앞에 뭐가 오는지
 
객체 안에 객체가 들어갈 수 있음
 
>> 객체.pdf 파일은 천천히 읽어보는 게 필요할 것 같다
 

실습:

 
노드를 안 쓰기 때문에
view의 url를 직접 입력해야함
= CDN
 
- 랜더링 작업
 - vm.message > 변경사항이 있다
 
▼ let와 const 비교 문제

// let과 차이점: const는 값 변경 불가함 / scope은 같음

// const는 상수값으로 메모리 주소 변경이 불가능

// const를 사용해서 '참조형 객체'를 만듬

const p1 = { name: 'john', age: 20 };

// 메모리 주소는 그대로지만 안에 값이 변경되는건 가능

p1.age = 22;

console.log(p1);

// 직접 p1을 변경하면 메모리 주소가 변경되기 때문에 오류

p1 = { name: 'lee', age: 25 };

 
const는 상수값으로 메모리 주소 변경 불가능!
 
??구조분해할당
 
▼화살표 함수 문제(2가지 버전으로 변경하기)

const test1 = function (a, b) {

  return a + b;

};

 
답변:

const test2 = (a, b) => {

  return a + b;

};

const test3 = (a, b) => a + b;

 

▼ Promise 문제

[011] KB IT’s Your Life - ES6

 

▼ 에러 발생시 catch로 이동

let p = new Promise((resolve, reject) => {

  resolve('first!'); //First

});

p.then((msg) => {

  console.log(msg);

  //   에러를 강제 발생시키는 코드, catch로 바로 이동함

  //   throw new Error('##에러!');

  return 'second'; // second

})

 

나만의 피드백

이론으로 배웠던 기본적인 문법이 기억이 안난다..
예를 들어 cd chapter1 / node ~~.js
폴더 들어가고, 파일 실행 등등

상위폴더로 올라가는것은?

cd..

꼼꼼하게 복습하자.