오늘 공부한 내용 요약
( 모던 JavaScript 튜토리얼 학습 )
method
객체 프로퍼티에 할당된 함수
새로 부여할수도 있고 이미 정의된 함수도 사용가능
method의 단축구문
sayHi() { 와 sayHi: function() { 2개 동일
sayHi() {
alert(this.name); /// 점 앞의 this 는 현재 객체를 의미함
}
이때 this 대신에 선언한 객체를 직접사용해도 되지만 , 객체를 다른 객체에 복사한 상황에서는 에러생길수 있음. this를 사용하는것이 방지
자바스크립트에서는 모든 함수에 this로 사용가능
User.f(); = userf;
화살표 함수에서 this를 사용시 외부함수에서 this값을 가져옴
let user = {
firstName: "보라",
sayHi() {
let arrow = () => alert(this.firstName);
arrow();
}
};
user.sayHi(); // 보라
별개의 this가 만들어지는것 말고 외부에 있는 this를 이용하고 싶은경우 화살표함수가 유용함.
객체 지향 프로그램(OOP)
객체를 사용하여 개체를 표현하는 방법
New 연산자와 생성자 함수를 사용하면 유사한 객체를 여러개 만들수 있음
function User(name) {
this.name = name;
this.isAdmin = false;
}
let user = new User("보라"); -> let user = { name : “보라”; isAdmin : false }; 와 동일하게 작동
alert(user.name); // 보라
alert(user.isAdmin); // false
new User(“예나”) new User(“해민”) 등을 이용하면 쉽게 객체를 만들수 잇음
리터럴 방식으로 일일이 만드는것보다 간단하고 읽기쉽게 생성가능
new function() {….
프로퍼티가 없는 중첩객체를 안전하게 접근할 수 있게된다
계속 연결해서 체인을 만들면 중첩프로퍼티에 안전하게 접근
생기기 전에는 &&를 이용해 실제 프로퍼티나 해당객체가 있는지 확인하는 방식을 사용했었음
?.은 앞의 평가대상이 null 이나 undefined이면 멈추고 undefined를 반환한다
즉 평가후 결과가 null, undefined가 아니면 값이 있다, 존재한다
(값이 없으면) 멈춤 -> 단락평가라고 함
let user = {}; // 주소 정보가 없는 사용자
alert(user.address.street); -> 이 경우는 오류
alert( user?.address?.street ); -> undefined 반환 (오류x)
?. 은 앞 평가대상에만 동작되고 확장되지 않는다
읽기나 삭제에는 사용할수 있지만 쓰기에는 사용할수 없다
존재하지 않아도 괜찮은 대상에만 사용해야 한다
?.은 연산자가 아니라 특별 문법 구조체이다
delete 와도 사용가능 -> delete user?.name;
user가 존재하면 user.name을 삭제합니다.
할당연산자(=) 왼쪽에는 사용할수 없다
?. 왼쪽대상이 없어도 사용가능한 경우 선택
보기 쉽게 정리
유일성이 보장되는 자료형, 유일한 식별자를 만들고 싶을때 사용
자바스크립트는 객체 프로퍼티 키로 오직 문자형과 심볼형만 가능
각각의 심볼 설명이 동일해도 다른 심볼값을 가지게 됨
심봉에 붙이는 설명은 그저 이름표 역할
let id1 = Symbol("id");
let id2 = Symbol("id");
alert(id1 == id2); // false
let id = Symbol("id");
alert(id); // 에러 발생
-> 심볼형을 표현하려면 .toString() 메서드를 활용하거나 / description 프로퍼티로 설명을 보여줄순 잇음
심볼을 사용하면 외부 코드에서 접근할수 없고 값도 덮어쓸수 없는 숨김 프로퍼티를 만들수 있다
리터럴 {…}를 이용해 객체를 만든경우 대괄호로 심볼형 키를 만들어야 한다.
let user = {
name: "John",
[id]: 123 // "id": 123 이렇게 저장시, id가 심볼형이 아닌 문자형으로 저장됨
};
for …in에서 심볼은 배제된다
object.assign은 심볼을 포함한 객체내 모든 프로퍼티를 복사함
전역 심볼 레지스트리
-> 이름이 같은경우 동일한 심볼을 반환해줌
애플리케이션에서 광범위하게 사용해야 하는 심볼이라면 전역 심볼을 사용
Symbol.for(key)는 key라는 이름을 가진 전역 심볼을 반환합니다.
조건에 맞는 심볼이 레지스트리 안에 없으면 새로운 심볼 Symbol(key)을 만들고 레지스트리 안에 저장합니다.
Symbol.keyFor(sym)를 사용하면 이름을 얻을 수 있습니다. 를 사용하면 이름을 얻을수 있다 (전역 심볼의 경우에만 가능)
전역 심볼이 아닌 것이 넘어오면 undefined 를 반환
공부사이트
반성
그동안의 날 중 가장 집중하지 못한 날
위의 내용은 공부중 본인이 이해한 내용으로 몇몇 틀린 내용이 있을 수 있습니다.
회독중 발견시 수정하겠습니다