2023.03.14 TIL

정승원·2023년 3월 15일
0
post-thumbnail

📌 오늘의 생각

퍼사드패턴, import&export, 구조분해할당을 통해 간결하고 효율적인 코드를 작성 할 수 있게 되었다. 기능들을 만드는 과정에서 한 개의 파일에서 모든 작업을 하는 것이 아니라 기능별로 분리하여 기능을 만들고 import하여 파일간 연결 및 작동을 하는 과정이 오늘의 학습내용중 가장 흥미로웠다. 효율적이고 유지보수성이 좋은 코드를 만드는 것이 가장 어려운것 같다. 앞으로 내가 개발자로서 살아가면서 항상 고민하는 부분이겠지만, 하루하루 배워나가는 내용들을 통해 좀 더 능력있는 개발자로 변해갔으면 좋겠다.


📒 목차

  • 템플릿 리터럴 (template literal)
  • Shorthand property
  • 구조분해할당
  • import & export 활용하기
  • 추가적인 내용

Node.js

1️⃣ 템플릿 리터럴 (template literal)

  • ES6에 추가된 새론 문자열 표기법이다.
  • "+" 연산자를 사용하지 않아도 문자열을 합치거나 삽입할 수 있다.
  • 백틱(``)과 '${}'를 통해 템플릿 리터럴을 사용한다.
  • 코드가 간결해지는 장점이 있다.
console.log("오늘은"+year+"년"+month+"월"+date+"일 입니다") // "+" 사용하기

console.log(`오늘은 ${year}${month}${date}일 입니다`) // 템플릿 리터럴 사용하기

2️⃣ Shorthand property

  • 객체를 생성시 key와 value값이 같은 이름을 갖고있다면 value를 생략하고 작성할 수 있다
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 };

3️⃣ 구조분해할당

  • 구조분해할당을 통해 해당 객체의 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;

🔹 객체 & 배열 구조분해할당 차이점

  • 객체의 경우, 순서는 중요하지 않지만 인자와 매개변수의 이름이 동일해야 한다.
  • 배열의 경우, 순서가 매우 중요하다, 인자와 매개변수명은 일치하지 않아도 된다.

4️⃣ import & export 활용하기

  • import와 export를 사용하여 js파일간 서로 불러올 수 있다

import

import{ name, age } from 'profile.js' 

export

export let name = "홍길동";
export let age = 27;

5️⃣ 추가적인 내용

✅ 인수(argument) & 매개변수(parameter)

  • 인수와 매개변수는 1:1로 매칭이 된다.
  • 따라서 순서가 제일 중요하다!!

🔹 인수(argument)

  • 함수가 호출될 때 함수로 값을 전달해주는 변수이다.
  • 함수 사용을 위해 실제로 담기는 값이다.

🔹 매개변수(parameter)

  • 호출된 함수를 함수 내부에서 사용하기 위해서는 함수명 옆 괄호에 변수명을 선언해야 한다.
  • 괄호 안에 있는 변수가 매개변수이다.
  • 인수(argument)를 함수 내부에서 사요할 수 있게 해주는 것이 매개변수이다.

0개의 댓글