• 오늘은 안전한 코드를 어떻게 만들 수 있는가?

• email template 만드는 방법

  

  😀 HTML 로 작성해서 만든다.

  • 이메일 보낼때, 변수에 저장해서 보내야함. 저 함수를 문자열로 묶어서 보내야함.

    • 템플릿 리터럴이란?

      

      

      

    • div 안에 있는 이름은 하드코딩이기 때문에 템플릿리터럴로 변경해줘야 한다.

    • function getWelcomeTemplate ().안에 있는 인자들과 매게변수들이 숫자가 다르더라도
      입력 값이 다르지 않게 안에 중괄호{}를 쳐줘야 한다.

Shorthand-property

• value가 같을 때 생략이 가능하다.
  ⇒ 객체 간단하게 표현하는 것이 (Shorthand-property)

  ![스크린샷 2023-01-10 오후 3.56.20.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/14eb2a98-7698-4e43-8f46-7c14f3065aa7/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA_2023-01-10_%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE_3.56.20.png)
  
  - 실습해보기
  
  ```jsx
  function qqq(aaa){
      console.log(aaa);
      console.log(aaa.name);
      console.log(aaa.age);
      console.log(aaa.school);
  }
  
  const name = "철수"
  const age = 12
  const school = "다람쥐초등학교"
  
  // const profile = {
  //     name: name,
  //     age: age,
  //     school: school
  // }
  
  const profile = {name, age, school}  //key 와 value 가 같아서, value를 생략함 >> shorthand-property
  
  qqq(profile) //1,변수에 담아서 보내주기
  qqq({name, age, school}) //2,그냥 통째로 전달인자를 보내주기
                           // 결과는 1.2번 동일
  ```
  
  # destructuring(구조분해할당)
  
  - ***구조 분해 할당***
   구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식입니다.
  
  - 객체
  
  ![스크린샷 2023-01-10 오후 4.13.35.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/3fc77f8f-cc1d-483a-b1e1-dd114ca6817a/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA_2023-01-10_%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE_4.13.35.png)
  
       
  
  - 객체나 배열에서 자기가 원하는 것만 뽑아서 구조분해할당을 할수가 있다. ex) name이 필요없다면 name을 빼도 상관없다.

• 배열

  

  • 기억 point!!!
  • 뱅
    • 구조분해할당을 할때는 변수 이름이 중요하지 않다.
    • 순서가 중요하다.
    • 앞에 공백이 있을경우 ,는 생략하지 말고 입력해줘야 한다.
      

• 객체

  

  • 기억 point!!!

    • 객체는 순서가 중요하지 않다.왜냐하면 이미 변수값이 정해졌기 때문이다

    • 변수 이름이 중요하다.

      api-import

    • 보내고 싶은 곳에는 맨앞에 export

    • 전달 받고 싶은 곳에는 import {} from ‘파일명’

      

    • 함수값이 어떤 값을 나타내고 있는지 알고 싶을때 함수에 마우스 올리고 cmd~!

    • 그 함수값을 수정하고 돌아가고 싶을때 con+ “-”

    • node에서 분리된 js파일을 연결하고 싶을때는 터미널에서 yarn init 입력
      ⇒ package.json 나올때까지 Enter

    • package.json에 들어가서 밑에"type": "module”입력.

    • 다시 터미널에서 node 파일명 입력하면 다시 작동되는거 확인 완료

      

      오늘도 제 기준에서는 많이 어렵고 심오한 내용이었지만 다시 복습하면서 내 것으로 만들어보려고 합니다.