Front/JavaScript

[JavaScript] ๊ฐ์ฒด

ddo04 2024. 7. 5. 23:51
728x90

๐Ÿงฑโ€Š for in

  • ๊ฐ์ฒด์— ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐ˜๋ณต๋ฌธ
  • ๋ฐฐ์—ด์—์„œ ์‚ฌ์šฉํ•˜๋Š” for of๋ผ๋Š” ๋ฐ˜๋ณต๋ฌธ์— ๊ฐ์ฒด ๋ฒ„์ „
  • ๊ฐ์ฒด๋ฅผ ์ˆœํ™˜
  • ๊ฐ์ฒด์— ํฌํ•จ๋˜์–ด ์žˆ๋Š” ๋ชจ๋“  ํ‚ค ๊ฐ’์„ ์ˆœํ™”ํ•˜๋ฉด์„œ ์ถœ

๐Ÿงฑโ€Š ๊ฐ์ฒด ์ถ•์•ฝ ๋ฐฉ๋ฒ• 

  • ํ‚ค์™€ ๊ฐ’์ด ๋˜‘๊ฐ—์€ ์ด๋ฆ„์„ ์‚ฌ์šฉํ•  ๋•Œ ๋’ท๋ถ€๋ถ„์„ ์ง€์šฐ๊ณ  ์ค‘๋ณต๋˜๋Š” ์ด๋ฆ„์„ ํ•œ ๋ฒˆ๋งŒ ๋ช…์‹œํ•ด์„œ ํ”„๋กœํผํ‹ฐ๋ฅผ ์•ฝํ•ด์„œ ํ‘œํ˜„
const name = '๊ฒจ์šธ';
const country = 'KR';

const user = {
    name: name,
    country: country,
};

console.log(user);

๐Ÿงฑโ€Š ๋ฉ”์†Œ๋“œ ์ถ•์•ฝ ํ‘œํ˜„

  • ๊ฐ์ฒด์˜ ํ”„๋กœํผํ‹ฐ๋กœ ์„ ์–ธ์ด ๋œ ํ•จ์ˆ˜๋ฅผ ๋ฉ”์†Œ๋“œ๋ผ๊ณ  ํ•จ
  • ํ•จ์ˆ˜๋ฅผ ํ˜ธ์ถœํ•  ๋•Œ๋Š” ๊ฐ์ฒด์˜ ํ”„๋กœํผํ‹ฐ๋กœ ์ ‘๊ทผ
  • ๊ฐ์ฒด ๋‚ด๋ถ€์˜ ๋ฉ”์†Œ๋“œ๋ฅผ ์ž‘์„ฑ์„ ํ•  ๋•Œ ํ‰์„ ์ด๋ผ๋Š” ํ‚ค์›Œ๋“œ๋ฅผ ์ƒ๋žตํ•˜๊ณ  ๋ฉ”์†Œ๋“œ๋ฅผ ์ถ•์•ฝํ•ด์„œ ํ‘œํ˜„ํ•  ์ˆ˜ ์žˆ์Œ
const obj = {
    greeting(){
        console.log('Hi!');
    },
};

obj.greeting();

๐Ÿงฑโ€Š Object.key

  • key๋ฅผ ๋ฝ‘์•„๋‚ผ ์ˆ˜ ์žˆ๋Š” ๋ฉ”์†Œ๋“œ
  • ์ธ์ž๋กœ ๊ฐ์ฒด๋ฅผ ์ „๋‹ฌํ•ด์ฃผ๋ฉด ์ง€์ •๋œ ๊ฐ์ฒด๊ฐ€ ๊ฐ€์ง€๊ณ  ์žˆ๋Š” key๋“ค์„ ๋ฐฐ์—ด๋กœ ๋ฐ˜ํ™˜
const obj = {
    x : 10,
    y : 20,
    z : 30,
};

console.log(Object.keys(obj));

๐Ÿงฑโ€Š ์ •์  ๋ฉ”์†Œ๋“œ ํ˜ธ์ถœ 

  • ์ „์—ญ ๊ฐ์ฒด Object ์•ˆ์— ์žˆ๋Š” keys๋ผ๋Š” ์ •์  ๋ฉ”์†Œ๋“œ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ
  • ๋ณ€์ˆ˜, ๋ฉ”์†Œ๋“œ()๋กœ ๋ฐ”๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๊ฑด ๊ฐ์ฒด์˜ ์ž์ฒด ๋‚ด์žฅ ๋ฉ”์†Œ๋“œ
  • ์‹ค์ œ ๊ฐ์ฒด๊ฐ€ ์žˆ์–ด์•ผ ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•ด์•ผ๋งŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Œ
  • ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•˜์ง€ ์•Š๊ณ ๋„ ๋ถˆ๋Ÿฌ๋‚ด์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Œ
  • ์ •์  ๋ฉ”์†Œ๋“œ๋“ค์€ ์ƒ์„ฑ๋œ ๊ฐ์ฒด์— ๋‚ด์žฅ๋˜์–ด ์žˆ๋Š” ๊ฒƒ์ด ์•„๋‹ˆ๋ผ Object, Array ํด๋ž˜์Šค๊ฐ€ ๊ฐ€์ง€๊ณ  ์žˆ๊ธฐ ๋•Œ๋ฌธ์— ์•ž์— Object ๋˜๋Š” Array ๋“ฑ์„ ๋ถ™์—ฌ์•ผ ์‚ฌ์šฉ ๊ฐ€๋Šฅ
  •  isArray๋Š” ๋ฐฐ์—ด์ธ์ง€๋ฅผ ํŒ๋ณ„ํ•ด์ฃผ๋Š” ๋ฉ”์†Œ๋“œ
  • ์ •์  ๋ฉ”์†Œ๋“œ๋“ค์€ ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•˜์ง€ ์•Š๊ณ ๋„ ๋ฐ”๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Œ
const obj = {
    x : 10,
    y : 20,
    z : 30,
};

console.log(Array.isArray(obj));

๐Ÿงฑโ€Š Object.values()

  • ์˜ค๋ธŒ์ ํŠธ ๋’ค์— ์ ์„ ๋ถ™์ด๊ณ  values
  • ์˜ค๋ธŒ์ ํŠธ๊ฐ€ ๊ฐ€์ง€๊ณ  ์žˆ๋Š” ๊ฐ’๋“ค์„ ๋ฐฐ์—ด๋กœ ๋ฐ˜ํ™˜
const obj = {
    x : 10,
    y : 20,
    z : 30,
};

console.log(Object.values(obj));

๐Ÿงฑโ€Š Object.entries()

  • entries ๋ฉ”์†Œ๋“œ๋ฅผ ์‚ฌ์šฉํ•˜๊ณ  ์ธ์ž๋กœ ๊ฐ์ฒด๋ฅผ ์ „๋‹ฌํ•ด ์ฃผ์‹œ๋ฉด ๋จ
  • ๊ฐ๊ฐ์˜ ํ”„๋กœํผํ‹ฐ
  • ํ‚ค์™€ ๊ฐ’์˜ ์Œ์„ ํ•˜๋‚˜๋กœ ๋ฌถ์–ด์„œ ๊ทธ๊ฒƒ๋“ค์„๊ฐœ๋ณ„์ ์ธ ์š”์†Œ๋กœ ๊ฐ€์ง€๋Š” ๋ฐฐ์—ด๋กœ ๋ฐ˜ํ™˜ํ•˜๋Š” ๊ธฐ๋Šฅ
const obj = {
    x : 10,
    y : 20,
    z : 30,
};

console.log(Object.entries(obj));

'Front > JavaScript' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

[JavaScript] DOM  (0) 2024.07.06
[JavaScript] ๊ตฌ์กฐ๋ถ„ํ•ดํ• ๋‹น  (0) 2024.07.06
[JavaScript] ๋ฉ”์†Œ๋“œ  (0) 2024.07.05
[JavaScript] JS ํ•จ์ˆ˜  (0) 2024.07.05
[JavaScript] JS ๋ฐ˜๋ณต๋ฌธ  (0) 2024.07.05