IT/WILT

[JavaScript] 7. Object

KimCookieYa 2022. 2. 24. 01:14

 

1. Literals & Properties

 - One of the JavaScript's data types.

 - a collection of related data and/or functionality.

 - Nearly all objects in JavaScript are instances of Object.

 - object = {key: value};

'use strict'

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

function print(person) {
	console.log(person.name);
    console.log(person.age);
}

const a = {name: 'apple', age: 4};
print(a); // apple 4

// dynamically typed language
a.hasJob = true; // can add properties later
delete a.hasJob; // can delete properties later

 

 

2. Computed properties

 - key should be always string.

 - 동적으로 key 값을 바꿔야할 때 사용한다.

console.log(a.name); // apple
console.log(a[name]); // apple

function printValue(obj, key) {
	console.log(obj[key]);
}

printValue(a, 'name'); // apple
printValue(a, 'age'); // 4

 

 

3. Property value shorthand

const person1 = {name: 'apple', age: 2};
const person2 = {name: 'banana', age: 3};
const person3 = new Person('grape', 4}; // object 생성

function Person(name, age) { // Constructor Function. Not Class.
	this.name = name;
    this.age = age;
}

 

 

4. in operator

 - property existence check (key in obj)
 - key 값이 object 내에 있는지 확인하는 연산자

console.log('name' in a); // true
console.log('age' in a); // true
console.log('random' in a); // false

 

 

5. for..in VS for..of

// for (let key in obj)
for(key in a) {
	console.log(key);
} // name age

// for (value of iterator)
const array = [1, 2, 3, 4, 5];
for (value of array) {
	console.log(value);
} // 1 2 3 4 5

 

 

6. Fun cloning

// cloning
const user1 = {name: 'apple', age: '20'}
const user2 = user;
user2.name = 'coder';
console.log(user1); // {name: "coder", age: "20");

// Object.assign(dest, [obj1, obj2, obj3..]);
const user3 = {};
Object.assign(user3, user1);
console.log(user3); // {name: "coder", age: "20");

const user4 = Object.assign({}, user2);
console.log(user4); // {name: "coder", age: "20");

 

 


 * MDN JavaScript - Object

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object

 

Object - JavaScript | MDN

Object 클래스는 JavaScript의 데이터 유형 중 하나를 나타냅니다. 다양한 키 모음 및 더 복잡한 엔티티들을 저장하는 데 사용됩니다. 객체는 Object() 생성자 또는 객체 초기자 / 리터럴 구문를 통해 생

developer.mozilla.org