1. literals and properties
const name = 'ellie';
const age = 4;
print(name, age);
function print(name, age){
console.log(name);
console.log(age);
}
->인자가 많을 경우 객체를 사용한다. (key와 value의 집합체)
const ellie = {name: 'ellie', age: 4};
print(ellie);
function print(ellie){
console.log(ellie.name);
console.log(ellie.age);
}
*object 만드는 법
const obj1 ={}; //object literal
const obj2 = new Object(); //object constructor
ellie.hasJob= true; //js는 동적이라서 나중에 추가도 가능함. but, 유지보수에는 안좋으니 피하기.
delete ellie.hasJob; //삭제도 가능. ->undefined.
2.computed properties 계산된 속성
the key should be always string.
console.log(ellie.name); //ellie 코딩하는 순간 받아오고싶을때.
console.log(ellie['name']); //ellie //runtime에서 결정될때 쓰는 거. 정확히 어떤키를 쓸지 모를때.
ellie['hasJob'] = true;
function printValue(obj, key){
console.log(obj.key);
}
printValue(ellie,'name'); //obj에 key라는 property가 들어있지 않으므로 undefined.
function printValue(obj, key){
console.log(obj[key]);
}
printValue(ellie,'name'); //ellie
3.property value shorthand
const person1 = {name: 'bob' , age: 2};
const person2 = {name: 'steve' , age: 3};
const person3 = {name: 'dave' , age: 4};
const person4 = makePerson('ellie', 30);
function makePerson(name, age){
return {
name, // name:name이면 생략가능.
age,
};
}
constructor function
object를 생성하는함수
function Person(name, age){
//this = {};
this.name = name;
this.age = age;
//return this;
}
5. in operator: property existence check (key in obj)
console.log('name' in ellie); //true 키가 있는지 없는지
console.log('random' in ellie); //false
console.log(ellie.random); //undefined
6. for.. in vs for.. of
//key in object
for (key in ellie){
console.log(key);
}
//value of iterable
const array = [1,2,3,4];
for (value of array){
console.log(value);
}
7.cloning
const user = {name: 'ellie', age: '20'};
const user2 = user;
user2.name = 'coder';
console.log(user); //{name: "coder", age: "20"}
//old way
const user3 = {};
for(key in user){
user3[key] = user[key];
}
console.log(user3);
//object assign
const user4 = {};
Object.assign(user4, user);
혹은
const user4 = Object.object({},user);
console.log(user4); //{name: 'ellie', age: '20'}
//another sample.
const fruit1 = {color:'red'};
const fruit2 = {color:'blue', size:'big'};
const mixed = Object.assign({}, fruit1, fruit2);
console.log(mixed.color);//blue 뒤에나오는 아이가 앞에 있는 값을 덮어씀.
console.log(mixed.size);//big
'개발자 > JS' 카테고리의 다른 글
[자바스크립트] 별점 제이쿼리 (0) | 2021.02.18 |
---|---|
[자바스크립트] 8.배열 (0) | 2021.01.19 |
6. class vs objec (0) | 2021.01.10 |
5. Arrow Function 함수의 선언과 표현 (0) | 2021.01.04 |
자바스크립트 4. operator, if, for loop (0) | 2021.01.03 |