퍼사드패턴, import&export, 구조분해할당을 통해 간결하고 효율적인 코드를 작성 할 수 있게 되었다. 기능들을 만드는 과정에서 한 개의 파일에서 모든 작업을 하는 것이 아니라 기능별로 분리하여 기능을 만들고 import하여 파일간 연결 및 작동을 하는 과정이 오늘의 학습내용중 가장 흥미로웠다. 효율적이고 유지보수성이 좋은 코드를 만드는 것이 가장 어려운것 같다. 앞으로 내가 개발자로서 살아가면서 항상 고민하는 부분이겠지만, 하루하루 배워나가는 내용들을 통해 좀 더 능력있는 개발자로 변해갔으면 좋겠다.
- 템플릿 리터럴 (template literal)
- Shorthand property
- 구조분해할당
- import & export 활용하기
- 추가적인 내용
console.log("오늘은"+year+"년"+month+"월"+date+"일 입니다") // "+" 사용하기 console.log(`오늘은 ${year}년 ${month}월 ${date}일 입니다`) // 템플릿 리터럴 사용하기
const name= "홍길동"; const age = 15; const gender = "male"; const profile = { name: name, //value 생략가능 age: age, //value 생략가능 gender: gender, //value 생략가능 } //shorthand property const profile = { name, age, gender };
- 구조분해할당을 통해 해당 객체의 key값을 매개변수로 받을 수 있다
- (객체의 구조분해할당) : 인자의 순서와 상관없이 동일한 이름으로 값을 찾아서 실해해주기 때문에 인자의 순서는 중요하지 않다.
- 배열의 구조분해할당에서는 순서가 매우 중요하다!!!
{}
안에 넣어서 객체로 넘겨주면, 순서와 상관없이 이름으로 인수와 매개변수가 매칭되기 때문에()
에 넣어서 넘겨주는 것보다안전한 코드
를 작성할 수 있다.
const profile = { name: "kevin", age: 27, gender: "male", } //1. const name = profile.name; const age= profile.age; const gender= profile.gender; 2. 구조분해할당 const {name, age, gender} = gender;
const student = ["kevin", "andy", "nicky"]; //1. const student1 = student[0]; const student2 = student[1]; const student3 = student[2]; //2. const [student1, student2, student3] = student;
- 객체의 경우, 순서는 중요하지 않지만 인자와 매개변수의 이름이 동일해야 한다.
- 배열의 경우, 순서가 매우 중요하다, 인자와 매개변수명은 일치하지 않아도 된다.
import
import{ name, age } from 'profile.js'
export
export let name = "홍길동"; export let age = 27;
- 함수가 호출될 때 함수로 값을 전달해주는 변수이다.
- 함수 사용을 위해 실제로 담기는 값이다.
- 호출된 함수를 함수 내부에서 사용하기 위해서는 함수명 옆 괄호에 변수명을 선언해야 한다.
- 괄호 안에 있는 변수가 매개변수이다.
- 인수(argument)를 함수 내부에서 사요할 수 있게 해주는 것이 매개변수이다.