Javascript tutorial note - 다시시작

황성호·2021년 3월 8일
0

불린형 형변환시!
전달받은 값 형 변환 후
0, null, undefined, NaN, "" false
그 외의 값 true

함수 선언문
function sayHi() {
alert( "Hello" );
}

함수표현식
let sayHi = function() {
alert( "Hello" );
};

콜백 함수
함수를 함수의 인수로 전달하고, 필요하다면 인수로 전달한 그 함수를 "나중에 호출(called back)"하는 것이 콜백 함수

함수 표현식 vs 함수 선언문
1. 문법
2.생성시기
함수 표현식
실제 실행 흐름이 해당 함수에 도달했을 때 함수를 생성
실행 흐름이 함수에 도달했을 때부터 해당 함수를 사용할 수 있습니다.

함수 선언문
함수 선언문이 정의되기 전에도 호출 가능
자바스크립트는 스크립트를 실행하기 전, 준비단계에서 전역에 선언된 함수 선언문을 찾고, 해당 함수를 생성

화살표 함수
중괄호 없이 작성시 (...args) => expression 형식
expression의 결과를 반환

중괄호 있이 작성하면 return을 명시해야하고 reture해주는 결과를 반환

객체
프로퍼티 - 키:값 - 형태로 선언
let user = new Object(); // '객체 생성자' 문법
let user = {}; // '객체 리터럴' 문법

객체 반복문
for...in

let user = {
  name: "John",
  age: 30,
  isAdmin: true
};

for (let key in user) {
  // 키
  alert( key );  // name, age, isAdmin
  // 키에 해당하는 값
  alert( user[key] ); // John, 30, true
}

객체 복사

//Object.assign(dest, [src1, src2, src3...])
let user = { name: "John" };

let permissions1 = { canView: true };
let permissions2 = { canEdit: true };

// permissions1과 permissions2의 프로퍼티를 user로 복사합니다.
Object.assign(user, permissions1, permissions2);

// now user = { name: "John", canView: true, canEdit: true }
let arr=[1,2,3,4,5];
let b=[]
Object.assign(b,arr)
//b=[1, 2, 3, 4, 5]

중첩 객체 복사

let user = {
  name: "John",
  sizes: {
    height: 182,
    width: 50
  }
};

let clone = Object.assign({}, user);

alert( user.sizes === clone.sizes ); // true, 같은 객체입니다.

// user와 clone는 sizes를 공유합니다.
user.sizes.width++;       // 한 객체에서 프로퍼티를 변경합니다.
alert(clone.sizes.width); // 51, 다른 객체에서 변경 사항을 확인할 수 있습니다.

깊은 복사

 _.cloneDeep(obj)

옵셔널 체이닝
?.을 사용하면 프로퍼티가 없는 중첩 객체를 에러 없이 안전하게 접근
?.은 ?.'앞’의 평가 대상이 undefined나 null이면 평가를 멈추고 undefined를 반환

let user = {}; // 주소 정보가 없는 사용자

alert( user?.address?.street ); // undefined, 에러가 발생하지 않습니다.

1.obj?.prop – obj가 존재하면 obj.prop을 반환하고, 그렇지 않으면 undefined를 반환함
2.obj?.[prop] – obj가 존재하면 obj[prop]을 반환하고, 그렇지 않으면 undefined를 반환함
3.obj?.method() – obj가 존재하면 obj.method()를 호출하고, 그렇지 않으면 undefined를 반환함

profile
개발!

0개의 댓글