JS/[드림코딩] 엘리 (완)

07강. object

web_seul 2020. 7. 5. 04:38
반응형

 

one of the JS's data types

a collection of related data and/or functionality.

Nearly all objects in JS are instances of Object.

object = {key:value};

const name = 'ellie';
const age= 4;
print(name, age);
function print(name, age) {
	console.log(name);
	console.log(age);
}

//간략히
function print(person) {
	console.log(person.name);
	console.log(person.age);
}
const ellie = {name: 'ellie', age: 4};
print(ellie);

1. Literals and properties

const obj1= {}; //'object literal' syntax
const obj2= new Object();	//'object construnctor' syntax

with JS magin(dynamically typed language) can add properties later

ellie.hasJob = true;
console.log(ellie.hasJob);

can delete properties later

delete ellie.hasJob;
console.log(ellie.hasJob);

 

2. Computed properties_ key should be always string

console.log(ellie.name); //즉시입력
console.log(ellie['name']); //정확한 정보를 모를때, running중 설정될때
ellie['hasJob'] = true;
console.log(ellie.hasJob);

//ex)
function printValue(obj,key){
    console.log(obj[key]);
}
printValue(ellie, 'name');
printValue(ellie, 'age');

 

 

3. Property value shorthand

const person1 = {name: 'bob' age:2},
const person2 = {name: 'steve' age:3},
const person3 = {name: 'dave' age:4},
const person4 = new Person('ellie',30);
console.log(person4);

 

4. Constructor Function

function Person(name, age){
	return{
	name,
	age,
};

//↓
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('age' in ellie);	//true
console.log('random' in ellie);	//false
console.log(ellie.random);	//undefined

 

6. for.. in vs for..of_ for(key in obj)

console.clear() //이전data삭제

console.clear() //이전data삭제
for(key in ellie){
    console.log(key);
}

for(value of iterable)

const array = [1,2,4,5];

//for(let i = 0; i<array.length; i++){ 대신
for(value of array){
    console.log(value);
}

 

7. Fun cloning

//Object.assign(dest, [ob1,obj2, obj3..])

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.clear();
console.log(user3);

assign<T, U> (target: T, source: U): T & U;

const user4 = {};
Object.assign(user4, user);
console.log(user4);

//간략히
const user4 = Object.assign({}, user);
console.log(user4);

another example

const fruit1 = {color:'red'};
const fruit2 = {color:'blue', size:'big'};
const mixed =Object.assign({},fruit1, fruit2); //뒤값이 덮어씌움

console.log(mized.color); //blue
console.log(mized.size); //big
반응형