Notice
Recent Posts
Recent Comments
Link
«   2025/04   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30
Tags more
Archives
Today
Total
관리 메뉴

개발의변화

자바스크립트 정리 (1) 객체 본문

카테고리 없음

자바스크립트 정리 (1) 객체

refindmySapporo 2021. 9. 27. 17:02
반응형

let user = new Object (); 객체 생성 자 문법

객체는 원시형과 달리 다양한 데이터를 담을 수 있다.

객체는 중괄호를 이용해 만들 수 있다. 중괄호 안에는 키: 값 쌍으로 구성된 프로퍼티 여러 개 넣을 수 있음

키 엔 문자형 값 모든 자료형이 허용됌

let user = new Object();

let user = {};

리터럴과 프로펕티 

중괄호 안에는 키: 값 쌍으로 프로퍼티 가 들어감

let user = {

name: "John",

age : 20

};

콜론을 기준으로 왼쪽에 키가, 오른쪽엔 값이 위치

프로퍼티 키는 프로퍼티 이름 혹은 식별자라고 부름

객체 user에는 프로퍼티 값이 두 개 있다. 

점 표기법을 이용하면 프로퍼티 값을 읽는 것도 가능하다

user.name, user.age

user.isAdmin= true; 이렇게 추가도 가능하다

delete user.age 

let user = {

name: "John",

age: 30,

"likes birds": true,

};

마지막 쉼표를 trailing 쉼표 즉 끝에 쉼표를 붙이면 모든 프로퍼티가 유사한 형태로 보이기 떄문에 추가,삭제,이동이 쉬워진다

객체는 사실 const로도 수정이 가능하다

'.'은 유효한 식별자에게만 쓸 수 있고 점 표기법 대신에 대괄호 표기법이라는 방법 사용할 수 있다.

계산된 프로퍼티 :  객체 만들 떄 객체 리터럴 안의 프로퍼티 키가 대괄호로 둘러싸여 있을경우

let bag = { [fruit] " 5, }

let fruit = 'apple'

let bag = { [fruit+'Computers']: 5 };

단축 프로퍼티

function makeUser (name, age) {

return {

name,

age,

};

}

객체와 원시 타입의 근본적인 차이 객체는 참조에 의해 복사

객체는 변수가 그대로 저장이 되어있는 것이 아니라 ,객체가 저장되어 있는 '메모리 주소' 객체에 대한 참조 값이 저장되어진다

let user = {name: "John"}

let admin = user; 참조값을 복사함

Object.assign (dest, [src1, src2, src3...])

첫 번째 인 수 dest는 목표로 하는 객체

이어지는 인수는 복사하는 객체

let user = {name: "John"};

let permission1 = {canView: true } ;

let permission2 = { canEdit: true};

Object.assign(user, permission1, permission2)

 

메서드와 this

객체는 사용자,주문 등과 같이 실제 존재하는 개체 표현하고자 할 때 생성

let user = {

name: "John",

age: 30

};

user.sayHi = function () {

alert("안녕하세요");

};

user.sayHi() 안녕하세요

let user = { name: "John" }; let admin = { name: "Admin" }; function sayHi() { alert( this.name ); } // 별개의 객체에서 동일한 함수를 사용함 user.f = sayHi; admin.f = sayHi; // 'this'는 '점(.) 앞의' 객체를 참조하기 때문에 // this 값이 달라짐 user.f(); // John (this == user) admin.f(); // Admin (this == admin) admin['f'](); // Admin (점과 대괄호는 동일하게 동작함)

 

 

 

 

반응형