๐Ÿคฏ๊ฐ์ฒด(Object)?

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋Š” ๊ฐ์ฒด ๊ธฐ๋ฐ˜์˜ ์Šคํฌ๋ฆฝํŠธ ์–ธ์–ด์ž…๋‹ˆ๋‹ค.
์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ๊ฐ์ฒด๋Š” ํ‚ค(key), ๊ฐ’(value)์œผ๋กœ ๊ตฌ์„ฑ๋œ ํ”„๋กœํผํ‹ฐ(Property)์˜ ์ง‘ํ•ฉ์ž…๋‹ˆ๋‹ค. ํ”„๋กœํผํ‹ฐ ๊ฐ’์ด ํ•จ์ˆ˜์ผ ๊ฒฝ์šฐ์—๋Š” ์ด๊ฒƒ์„ ๋ฉ”์†Œ๋“œ๋ผ๊ณ  ๋ถ€๋ฆ…๋‹ˆ๋‹ค.

๐Ÿฅ‡ํ”„๋กœํผํ‹ฐ

ํ”„๋กœํผํ‹ฐ๋Š” ํ‚ค(์ด๋ฆ„) ๊ณผ ๊ฐ’ ์œผ๋กœ ๊ตฌ์„ฑ๋ฉ๋‹ˆ๋‹ค. ํ”„๋กœํผํ‹ฐ๋Š” ํ”„๋กœํผํ‹ฐ ํ‚ค๋กœ ์œ ์ผํ•˜๊ฒŒ ์‹๋ณ„ํ• ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ฆ‰, ํ”„๋กœํผํ‹ฐ ํ‚ค๋Š” ํ”„๋กœํผํ‹ฐ๋ฅผ ์‹๋ณ„ํ•˜๊ธฐ ์œ„ํ•œ ์‹๋ณ„์ž(identifier)์ž…๋‹ˆ๋‹ค.

ํ”„๋กœํผํ‹ฐ ํ‚ค: ๋นˆ ๋ฌธ์ž์—ด์„ ํฌํ•จํ•˜๋Š” ๋ชจ๋“  ๋ฌธ์ž์—ด ๋˜๋Š” symbol๊ฐ’
ํ”„๋กœํผํ‹ฐ ๊ฐ’: ๋ชจ๋“  ๊ฐ’

ํ”„๋กœํผํ‹ฐ ํ‚ค์— ๋ฌธ์ž์—ด์ด๋‚˜ symbol ๊ฐ’ ์ด์™ธ์˜ ๊ฐ’์„ ์ง€์ •ํ•˜๋ฉด ์•”๋ฌต์ ์œผ๋กœ ํƒ€์ž…์ด ๋ณ€ํ™˜๋˜์–ด ๋ฌธ์ž์—ด์ด ๋œ๋‹ค. ์ด๋ฏธ ์กด์žฌํ•˜๋Š” ํ”„๋กœํผํ‹ฐ ํ‚ค๋ฅผ ์ค‘๋ณต ์„ ์–ธํ•˜๋ฉด ๋‚˜์ค‘์— ์„ ์–ธํ•œ ํ”„๋กœํผํ‹ฐ๊ฐ€ ๋จผ์ € ์„ ์–ธํ•œ ํ”„๋กœํผํ‹ฐ๋ฅผ ๋ฎ์–ด์“ด๋‹ค. ๋ฐฐ์—ด๊ณผ๋Š” ๋‹ฌ๋ฆฌ ๊ฐ์ฒด๋Š” ํ”„๋กœํผํ‹ฐ๋ฅผ ์—ด๊ฑฐํ•  ๋•Œ ์ˆœ์„œ๋ฅผ ๋ณด์žฅํ•˜์ง€ ์•Š๋Š”๋‹ค.

๐Ÿฅˆ๊ฐ์ฒด ๋ฆฌํ„ฐ๋Ÿด

์ผ๋ฐ˜์ ์ธ ๊ฐ์ฒด ์ƒ์„ฑ๋ฐฉ์‹์ด๋‹ค. {} ๋ฅผ ์‚ฌ์šฉํ•˜๋ฉฐ ํ”„๋กœํผํ‹ฐ๊ฐ€ ์—†์œผ๋ฉด ๋นˆ ๊ฐ์ฒด, ํ•˜๋‚˜์˜ ํ”„๋กœํผํ‹ฐ๋ฅผ ๊ธฐ์ˆ ํ•˜๋ฉด ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•  ์ˆ˜ ์žˆ๋‹ค.

var emptyObject = {};
console.log(typeof emptyObject); // object

var hyundai = {
  model : 'avante',
  color :'white',
  introduce: function () { // <--- ๋ฉ”์†Œ๋“œ
    console.log('Hi! I am ' + this.model);
  }
};

console.log(typeof hyundai); // object
console.log(hyundai); // {model : 'avante', color : 'white', introduce: f}

hyundai.introduce(); // Hi~ I am avante
/*
์ฒด์˜ ํ”„๋กœํผํ‹ฐ ๊ฐ’์— ์ ‘๊ทผํ•˜๋ ค๋ฉด 
.(์ฉœ) ๋˜๋Š” ['ํ”„๋กœํผํ‹ฐ ์ด๋ฆ„'](ex. hyundai['introduce'])
์ด์šฉํ•ฉ๋‹ˆ๋‹ค.
/*

๐Ÿฅ‰Object ์ƒ์„ฑ์ž ํ•จ์ˆ˜

์ƒ์„ฑ์ž ํ•จ์ˆ˜๋ž€ new ํ‚ค์›Œ๋“œ์™€ ํ•จ๊ป˜ ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•˜๊ณ  ์ดˆ๊ธฐํ™” ํ•˜๋Š” ํ•จ์ˆ˜์ด๋‹ค. ์ƒ์„ฑ์ž ํ•จ์ˆ˜๋ฅผ ํ†ตํ•ด ์ƒ์„ฑ๋œ ๊ฐ์ฒด๋ฅผ ์ธ์Šคํ„ด์Šค๋ผ ํ•ฉ๋‹ˆ๋‹ค.
๊ฐ์ฒด๊ฐ€ ์†Œ์œ ํ•˜๊ณ  ์žˆ์ง€ ์•Š์€ ํ”„๋กœํผํ‹ฐ ํ‚ค์— ๊ฐ’์„ ํ• ๋‹นํ•˜๋ฉด ํ•ด๋‹น ๊ฐ์ฒด์— ํ”„๋กœํผํ‹ฐ๋ฅผ ์ถ”๊ฐ€ํ•˜๊ณ  ๊ฐ’์„ ํ• ๋‹นํ•ฉ๋‹ˆ๋‹ค.
์ด๋ฏธ ์กด์žฌํ•˜๋Š” ํ”„๋กœํผํ‹ฐ ํ‚ค์— ์ƒˆ๋กœ์šด ๊ฐ’์„ ํ• ๋‹นํ•˜๋ฉด ํ”„๋กœํผํ‹ฐ ๊ฐ’์€ ํ• ๋‹นํ•œ ๊ฐ’์œผ๋กœ ๋ณ€๊ฒฝ๋ฉ๋‹ˆ๋‹ค.

// ๋นˆ ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ• ์ˆ˜ ์žˆ๋‹ค.
var kia  = new Object();
// ํ”„๋กœํผํ‹ฐ๋ฅผ ์ถ”๊ฐ€ํ•ฉ๋‹ˆ๋‹ค.
kia.model = 'sorrento';
kia.color =  'red';
kia.introduce = function () {
  console.log('Hi! I am ' + this name);
};

`console.log`๋ฅผ ์ด์šฉํ•˜์—ฌ kia์˜ ํƒ€์ž…์„ ์ถœ๋ ฅํ•ด ๋ณด์‹œ๊ธฐ๋ฐ”๋ž๋‹ˆ๋‹ค.
`console.log`๋ฅผ ์ด์šฉํ•˜์—ฌ kia ๋ฅผ ์ถœ๋ ฅํ•ด๋ณด์‹œ๊ธฐ ๋ฐ”๋ž๋‹ˆ๋‹ค.
`kia`์˜ `introduce`๋ฅผ ์ถœ๋ ฅํ•ด๋ณด์‹œ๊ธฐ ๋ฐ”๋ž๋‹ˆ๋‹ค.

๐Ÿ…์ƒ์„ฑ์ž ํ•จ์ˆ˜

์ƒ์„ฑ์ž ํ•จ์ˆ˜๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํ”„๋กœํผํ‹ฐ๊ฐ€ ๋™์ผํ•œ ๊ฐ์ฒด๋ฅผ ์—ฌ๋Ÿฌ๊ฐœ๋ฅผ ๊ฐ„ํŽธํžˆ ์ƒ์„ฑํ•  ์ˆ˜ ์žˆ๋‹ค.

//์ƒ์„ฑ์ž ํ•จ์ˆ˜
function Car(name, color) {
  this.name = name;
  this.color = color;
  this.introduce = function() {
    console.log('Hi! My name is ' + this.name);
  };
}

//์ธ์Šคํ„ด์Šค์˜ ์ƒ์„ฑ
var hyundai = new Car('avante', 'white');
var kia = new Car('sorrento', 'red');
/*
์—ฌ๊ธฐ์„œ new Car์˜ ์ดํ•ด๋Š” 
hyundai ๋งŒ ์‚ฌ์šฉํ• ์ˆ˜ ์žˆ๋Š” ์ƒˆ๋กœ์šด ๊ณต๊ฐ„์— Carํ•จ์ˆ˜๋ฅผ ๊ฐ€์ง€๊ณ  ์™€์„œ ์“ด๋‹ค๊ณ  ์ €๋Š” ์ดํ•ดํ•˜์˜€์Šต๋‹ˆ๋‹ค. 
๊ทธ๋ž˜์„œ hyundai ๋ฅผ ํ˜ธ์ถœํ•˜๋ฉด avante๊ฐ€ ๋‚˜์˜ค๊ณ  white๊ฐ€ ๋ถˆ๋ฆฝ๋‹ˆ๋‹ค.
*/

console.log('hyundai: ', hyundai);
console.log('kia: ', kia);

hyundai.introduce();
kia.introduce();

๐ŸŒˆReference

PoiemaWeb object์˜ ๋” ๊นŠ๊ฒŒ ๋ณด๋ ค๋Š” ๋ถ„์€ ์—ฌ๊ธฐํด๋ฆญ