SyntaxError: missing : after property id

๋ฉ”์„ธ์ง€

SyntaxError: Expected ':' (Edge)
SyntaxError: missing : after property id (Firefox)

์—๋Ÿฌ ํƒ€์ž…

๋ฌด์—‡์ด ๋ฌธ์ œ์ผ๊นŒ?

๊ฐ์ฒด ์ดˆ๊ธฐ์ž ๊ตฌ๋ฌธ์œผ๋กœ ๊ฐ์ฒด๋ฅผ ๋งŒ๋“ค ๋•Œ ์ฝœ๋ก (:)์€ ๊ฐ์ฒด์˜ ์†์„ฑ์„ ํ‚ค์™€ ๊ฐ’์œผ๋กœ ๋ถ„๋ฆฌํ•ฉ๋‹ˆ๋‹ค.

var obj = { propertyKey: 'value' };

์˜ˆ์ œ

์ฝœ๋ก  vs. ๋“ฑํ˜ธ

๊ฐ์ฒด ์ดˆ๊ธฐ์ž ๊ตฌ๋ฌธ์—๋Š” ๋“ฑํ˜ธ๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์—†์œผ๋ฏ€๋กœ ์•„๋ž˜ ์˜ˆ์ œ๋Š” ์‹คํŒจํ•ฉ๋‹ˆ๋‹ค.

var obj = { propertyKey = 'value' };
// SyntaxError: missing : after property id

์ฝœ๋ก ์„ ์‚ฌ์šฉํ•˜๊ฑฐ๋‚˜ ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•œ ๋’ค์— ๋Œ€๊ด„ํ˜ธ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ƒˆ๋กœ์šด ์†์„ฑ์„ ํ• ๋‹นํ•˜๋Š” ๊ฒƒ์ด ๋ฐ”๋ฆ…๋‹ˆ๋‹ค.

var obj = { propertyKey: 'value' };

// ๋˜๋Š”

var obj = { };
obj['propertyKey'] = 'value';

๋นˆ ์†์„ฑ

์•„๋ž˜์™€ ๊ฐ™์ด ๋นˆ ์†์„ฑ์„ ๋งŒ๋“ค ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค:

var obj = { propertyKey; };
// SyntaxError: missing : after property id

๋งŒ์•ฝ ๊ฐ’ ์—†์ด ์†์„ฑ์„ ์ •์˜ํ•ด์•ผ ํ•œ๋‹ค๋ฉด ๊ฐ’์œผ๋กœ null์„ ์ง€์ •ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

var obj = { propertyKey: null };

๊ณ„์‚ฐ๋œ ์†์„ฑ

์‹์œผ๋กœ ์†์„ฑ์˜ ํ‚ค๋ฅผ ๋งŒ๋“œ๋Š” ๊ฒฝ์šฐ ๋Œ€๊ด„ํ˜ธ๋ฅผ ์‚ฌ์šฉํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋ ‡์ง€ ์•Š์œผ๋ฉด ์†์„ฑ ์ด๋ฆ„์— ๊ณ„์‚ฐ๋œ ๊ฐ’์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค:

var obj = { 'b'+'ar': 'foo' };
// SyntaxError: missing : after property id

์‹์— ๋Œ€๊ด„ํ˜ธ๋ฅผ ๋„ฃ์œผ์„ธ์š” []:

var obj = { ['b'+'ar']: 'foo' };

๊ฐ™์ด ๋ณด๊ธฐ