JS Object 자료

leephoterΒ·2021λ…„ 12μ›” 13일
0

λ¨Όμ € 컴퓨터 μ‚¬μ΄μ–ΈμŠ€μ—μ„œ κ°μ²΄λŠ” ν΄λž˜μŠ€μ—μ„œ μ •μ˜ν•œ 것을 ν† λŒ€λ‘œ λ©”λͺ¨λ¦¬(μ‹€μ œ μ €μž₯곡간)에 ν• λ‹Ήλœ κ²ƒμœΌλ‘œ ν”„λ‘œκ·Έλž¨μ—μ„œ μ‚¬μš©λ˜λŠ” 데이터 λ˜λŠ” μ‹λ³„μžμ— μ˜ν•΄ μ°Έμ‘°λ˜λŠ” 곡간을 μ˜λ―Έν•˜λ©°, λ³€μˆ˜, 자료 ꡬ쑰, ν•¨μˆ˜ λ˜λŠ” λ©”μ†Œλ“œκ°€ 될 수 μžˆλ‹€
(즉)β­οΈμ‹λ³„μžλ‘œ μ°Έμ‘°ν•  수 μžˆλŠ” λ©”λͺ¨λ¦¬μ— μžˆλŠ” 값⭐️이닀
κ°μ²΄λŠ” μ†μ„±μ˜ 이름을 ν‚€λ‘œ μ‚¬μš©ν•˜λŠ” μ—°κ΄€ 배열이라고 생각할 수 μžˆμŠ΅λ‹ˆλ‹€. 보톡 객체의 속성을 λ©”μ„œλ“œμ™€ κ΅¬λ³„ν•΄μ„œ λ§ν•˜μ§€λ§Œ μ„œλ‘œμ˜ μ°¨μ΄λŠ” λΆˆν™•μ‹€ν•©λ‹ˆλ‹€. λ©”μ„œλ“œλŠ” ν˜ΈμΆœν•  수 μžˆλŠ” 속성일 뿐으둜, μ†μ„±μ˜ 값이 Function을 κ°€λ¦¬ν‚€λŠ” 참쑰라면 κ·Έ 속성을 λ©”μ„œλ“œλΌκ³  ν•©λ‹ˆλ‹€.

  • μ‹λ³„μž : μ–΄λ–€ λŒ€μƒμ„ μœ μΌν•˜κ²Œ 식별 및 ꡬ별할 수 μžˆλŠ” 이름
  • λ©”λͺ¨λ¦¬μ— μžˆλŠ” κ°’ : ν• λ‹Ήλœ κ°’. (λ©”λͺ¨λ¦¬ μ£Όμ†Œκ°’ X)

μžλ°”μŠ€ν¬λ¦½νŠΈμ—μ„œ, κ°μ²΄λŠ” 속성듀을 λ‹΄κ³ μžˆλŠ” κ°€λ°©μœΌλ‘œ λ³Ό 수 μžˆλ‹€. 1πŸ‘‰πŸ» 객체 λ¦¬ν„°λŸ΄ 문법 (object literal syntax) 으둜 μ œν•œμ μœΌλ‘œ λͺ‡ 가지 속성을 μ΄ˆκΈ°ν™”ν•  수 있고, 그러고 λ‚˜μ„œ 속성듀을 μΆ”κ°€ν•˜κ±°λ‚˜ μ œκ±°ν•  μˆ˜λ„ μžˆλ‹€.
속성값은 객체λ₯Ό ν¬ν•¨ν•œ μ–΄λ– ν•œ μžλ£Œν˜•λ„ 될 수 μžˆλ‹€. κ·Έ 덕뢄에 λ³΅μž‘ν•œ 데이터 ꡬ쑰λ₯Ό ν˜•μ„±ν•˜λŠ”κ²Œ κ°€λŠ₯해진닀. 속성은 ν‚€ (μ ‘κ·Όμž) (property) κ°’μœΌλ‘œ μ‹λ³„λœλ‹€. ν‚€ 값은 String μ΄κ±°λ‚˜ Symbol 값이닀. 데이터 (Data) (κ°’) Data(κ°’)은 μ–΄λ–€ μžλ£Œν˜•μ΄λ“  κ°€λŠ₯ν•˜λ‹€
keyλŠ” value에 값을 가지고 μžˆλ‹€λ©΄ property, value에 μ–΄λ–€ κΈ°λŠ₯을 ν•˜λŠ” ν•¨μˆ˜λ₯Ό 가지고 μžˆλ”°λ©΄ method 라고 λΆ€λ₯Έλ‹€.

λ¬Έμ„œ(String), λ‚ μ§œ(Date), λ°°μ—΄(Array), μˆ˜ν•™(Math) 객체 등이 μžˆλ‹€

Symbol >> ES6μ—μ„œ μƒˆλ‘­κ²Œ μΆ”κ°€λœ type으둜 λ³€κ²½ λΆˆκ°€λŠ₯ν•œ μ›μ‹œ νƒ€μž…μ˜ 값이닀. 심볼은 주둜 μ΄λ¦„μ˜ 좩돌 μœ„ν—˜μ΄ μ—†λŠ” μœ μΌν•œ 객체의 ν”„λ‘œνΌν‹° ν‚€(property key)λ₯Ό λ§Œλ“€κΈ° μœ„ν•΄ μ‚¬μš©ν•œλ‹€.

// 킀값이 String, symbol일 경우 μ˜ˆμ‹œ
// Boolean, null, undefined, Number, Object인 경우 μ•ˆ 됨 μ˜ˆμ‹œ

ν‚€κ°’ - μ΄λ¦„μ˜ 좩돌 μœ„ν—˜μ΄ μ—†λŠ” μœ μΌν•œ 객체의 ν”„λ‘œνΌν‹° ν‚€(Symbol)을 μ‚¬μš©ν•˜κΈ° λ•Œλ¬Έμ— 'for', 'let', 'return' λ“± λ³€μˆ˜λͺ…μœΌλ‘œλŠ” μ‚¬μš©ν•  수 μ—†λŠ” μ˜ˆμ•½μ–΄λ₯Ό μ‚¬μš© κ°€λŠ₯ν•˜λ‹€.(지양)

λ©”μ†Œλ“œλ₯Ό μ°Έμ‘°ν•  λ•Œ λ©”μ†Œλ“œ 이름 뒀에 κ΄„ν˜Έ(())λ₯Ό 뢙이지 μ•ŠμœΌλ©΄, λ©”μ†Œλ“œκ°€ μ•„λ‹Œ ν”„λ‘œνΌν‹° κ·Έ 자체λ₯Ό μ°Έμ‘°ν•˜κ²Œ λ©λ‹ˆλ‹€.

λ°°μ—΄(Array) : μˆœμ„œλ₯Ό 가진닀.
객체(Object) : 의미λ₯Ό 가진닀.

κ°μ²΄μ—μ„œ μ‚¬μš©ν•˜λŠ” λ°˜λ³΅λ¬Έμ€ for in
for( let key in obj )
for in문은 κ°μ²΄μ•ˆμ— λͺ¨λ“  ν‚€λ₯Ό μ°Ύμ•„ β€˜keyβ€™λΌλŠ” λ³€μˆ˜μ— ν• λ‹Ήν•œλ‹€.

// Object in forλ¬Έ μ˜ˆμ‹œ

const둜 μ„ μ–Έν•˜λ”λΌλ„ Number값은 μˆ˜μ •λ  수 μžˆλ‹€.

μ ν‘œκΈ°λ²•, λŒ€κ΄„ν˜Έ ν‘œκΈ°λ²• 차이 1. 킀값이 숫자 2. alertμ°½ 3. 띄어쓰기

ν‚€κ°€ μ •μˆ˜ ν”„λ‘œνΌν‹°μΈ 경우 μžλ™μœΌλ‘œ μ˜€λ¦„μ°¨μˆœ μ •λ ¬.
κ·Έμ™Έ 킀값은 μΆ”κ°€ν•œ μˆœμ„œλŒ€λ‘œ μ •λ ¬.

Object Lookup table >> JS κ³΅μ‹λ¬Έμ„œ μš©μ–΄ X (λ‹€λ₯Έ κ³³μ—μ„œ 유래)

1 πŸ‘‰πŸ»κ°μ²΄ λ¦¬ν„°λŸ΄ 문법

  • 속성λͺ…κ³Ό μ†μ„±κ°’μ˜ λ³€μˆ˜λͺ…이 κ°™λ‹€λ©΄ ν•˜λ‚˜λ‘œ 톡일 (μƒλž΅ κ°€λŠ₯) <단좕 ν”„λ‘œνΌν‹°>
    (Shorthand Properties), (Concise Method)
const NAME = 'LEE';
const object1 = {
    NAME : NAME
}
console.log(object1.NAME);
// >> 'LEE'

const NAME = 'LEE';
const object1 = {
    NAME
}
console.log(object1.NAME);
// >> 'LEE'
  • μ†μ„±κ°’μœΌλ‘œ ν•¨μˆ˜(function())κ°€ μ •μ˜ 될 λ•Œ 'function' μƒλž΅ κ°€λŠ₯
const object1 = {
    method1 : function() {
    	console.log('Wooahan-agile');
    },
};
object1.method1();
// >> 'Wooahan-agile'

const object1 = {
    method1() {
    	console.log('Wooahan-agile');
    },
};
object1.method1();
// >> 'Wooahan-agile'
  • 동적 속성λͺ… μ •μ˜ κ°€λŠ₯ (Computed Property Name)
    동적 속성λͺ…μ΄λž€ 속성λͺ…을 λ³€μˆ˜λ‘œ μ‚¬μš©ν•˜λŠ” 것
    property둜 ν…œν”Œλ¦Ώ λ¦¬ν„°λŸ΄ μ‚¬μš© κ°€λŠ₯ name1, name2 ... μ˜ˆμ‹œ
const object1 = {
	name: 'LEE',
};
var weight = "무게";
object1[weight] = 75;  

console.log(object1);
// >> 
//{
//  name : 'LEE',
//  무게 : 75,
//}

let weight = '무게';
const object1 = {
  name : 'LEE',
  [weight] : 75,
};
// >>
// {
// 	name : 'LEE',
// 	무게 : 75,
//}

객체 μƒμ„±μž

var obj1 = {};
obj1.name = 'Lee';

// Object() μƒμ„±μž ν•¨μˆ˜
var obj2 = new Object();
obj2.name = 'Lee';

// μƒμ„±μž ν•¨μˆ˜
function F() {}
var obj3 = new F();
obj3.name = 'Lee';
profile
πŸ”₯ πŸ§‘πŸΎβ€πŸ’» πŸ”₯

0개의 λŒ“κΈ€