DAY 02

yejichoi·2022년 11월 2일
0

CodeCamp

목록 보기
2/11
post-thumbnail

1. Algorithm self study

배열에서 length 이용해서 마지막 요소 꺼내기

주어진 fruits 배열에서 마지막 요소를 꺼내 newFruits에 넣어주세요.

const fruits = ["사과", "바나나", "바나나"]
const newFruits = [];

newFruits.push(fruits[fruits.length-1]) 
//마지막 인덱스 값: 배열 길이 -1 

console.log(newFruits) // ["파인애플"]

객체 안에 객체 할당하기

student와 school 두 개의 객체가 있습니다.
student 객체에 school이라는 객체를 할당해야 합니다.

const student = {
	name: "철수",
	age: 8,
};

const school = {
	name: "다람쥐초등학교",
	teacher: "다람이",
}

//student.school = a;
student["school"] = a;
//school 이 하나의 key이자 객체로 student에 포함

console.log(student) 

2. Backend Class

* Template Literal / Object

+연산자를 사용하지 않지 않아도 새로운 문자열 삽입 가능
=> 텍스트 여러줄 만들 때, 백틱(`) 사용
표현식 사용 가능
${ } 사이에 변수나 연산 등을 삽입

* Destructuring

배열 / 객체 에 따라 [] , {}

  • 순서가 중요 ( 이름이 없기 때문에 )
  • 키와 밸류가 같으면 밸류 생략 가능 (객체 간단히 표현하기 가능) shorthand property
{ name, age, school }

* Import / Export

  • Export가 선행이 되어야 Import를 사용할 수 있음
  • 외부에서 함수를 내보내고 불러오기 위해서 yarn init 을 터미널에 입력하고 "type" : "module"을 추가

3. HW

Q. 현재 날짜와 시간을 출력하는 함수를 하나 만들고, 해당 함수를 실행하면 현재 시간으로 (예시: “오늘은 2022년 03월 15일 11:30:29입니다.”) 같은 포맷의 메시지가 콘솔에 출력되도록 만들어 주세요.

const date = new Date(); // 자바스크립트 Date객체를 date라는 변수에 할당합니다.

date.getFullYear(); // 연도를 반환합니다.
date.getMonth(); // 월을 반환합니다. 0(월)부터 시작하므로 주의하세요!
date.getDate(); // 일을 반환합니다.
date.getDay(); // 요일을 반환합니다.(일요일: 0)
date.getHours(); // 시를 반환합니다.
date.getMinutes(); // 분을 반환합니다.
date.getSeconds(); // 초를 반환합니다.
// 이미 getToday 함수 안에 선언이 되어 있으므로 위에 선언들 필요x

function getToday() {
  const date = new Date();
  const yyyy = date.getFullYear();
  const mm = date.getMonth() + 1; // 현재 해당하는 월은 +1
  const dd = date.getDate();
  const hr = date.getHours();
  const min = date.getMinutes();
  const sec = date.getSeconds();
  return `${yyyy}${mm}${dd}${hr}:${min}:${sec}`;
}

console.log("오늘은" + getToday() + "입니다.");

Q. 이메일, 주민번호, 휴대폰 번호, 내가 좋아하는 사이트를 함수의 입력으로 받고, 해당 내용이 html 태그가 포함된 텍스트로 콘솔에 출력되어야 합니다.

function getWelcomeTemplate(privateInfo) {
  const mytemplate = ` 
        <html>
            <body>
                <h1>코드캠프님 가입을 환영합니다!!!</h1>
                <hr />
                <div>이메일: ${privateInfo.email}</div> //객체명.key값
                <div>주민번호: ${privateInfo.registeredDigits}</div>
                <div>휴대폰 번호: ${privateInfo.phoneDigits}</div>
                <div>내가 좋아하는 사이트: ${privateInfo.myFaveWeb}</div>
            </body>
        </html>
    `;
  console.log(mytemplate);
  return mytemplate;
}

const privateInfo = {
  email: "support@codebootcamp.co.kr",
  registeredDigits: "210510-1******",
  phoneDigits: "000-0000-0000",
  myFaveWeb: "codebootcamp.co.kr",
};

//createUser({ name, age, school, email, createdAt });
getWelcomeTemplate({ privateInfo });

=> 총평 : 결과값은 제대로 나왔지만 배운 내용을 적용하지 않았고, 날짜와 시간 함수 다시 해야함

함수 호출 시, 함수 사용을 위해 실제로 담기는 값을 Argument(인수), 그 argument를 함수 내부에서 사용 가능 하게 해주는 것이 Parameter(매개변수)라는 것을 기억

객체를 구조분해할당 하게 될 경우 객체 안의 key값을 가져와 할당을 해줍니다. 다시 말해, 객체 안의 존재하는 key값의 이름으로 재할당 => 순서 상관 x
배열 => 순서 매우 중요

key와 value가 동일한 이름 => value를 생략 가능 => shorthand property names

0개의 댓글