development

자바 스크립트 객체 리터럴 : {a, b, c}는 정확히 무엇입니까?

big-blog 2020. 9. 24. 08:04
반응형

자바 스크립트 객체 리터럴 : {a, b, c}는 정확히 무엇입니까?


내가 가진 질문은 이 jsfiddle 을 통해 가장 잘 제공되며 코드는 다음과 같습니다.

var a = 1, b = 'x', c = true;

var d = {a: a, b: b, c: c}; // <--- object literal
var e = [a, b, c];          // <--- array
var f = {a, b, c};          // <--- what exactly is this??

// these all give the same output:
alert(d.a  + ', ' + d.b +  ', ' + d.c );
alert(e[0] + ', ' + e[1] + ', ' + e[2]);
alert(f.a  + ', ' + f.b +  ', ' + f.c );

어떤 종류의 데이터 구조 f입니까? 의 약어 d입니까?


ES6 의 Object Initializer Property Shorthand 입니다.

var f = {a, b, c, d:1}; // Will be equal to {a:a, b:b, c:c, d:1}

이것은 속성 값이 속성 식별자와 이름이 같기 때문에 작동합니다. 이것은 최신 ECMAScript 6 초안 Rev 13Object Initialiser ( 섹션 11.1.5 ) 구문에 새로 추가되었습니다 . 물론 ECMAScript 3에서 설정된 제한과 마찬가지로 예약어를 속성 이름으로 사용할 수 없습니다.

이러한 속기는 코드를 크게 변경하지 않고 모든 것을 조금 더 달콤하게 만듭니다!

function createCar(name, brand, speed) {
  return { type: 'Car', name: name, brand: brand, speed: speed };
}

// With the new shorthand form
function createSweetCar(name, brand, speed) {
  return { type: 'Car', name, brand, speed }; // Yes it looks sweet.
}

이러한 표기법에 대한 지원은 호환성 표를 참조하십시오. 지원되지 않는 환경에서는 이러한 표기법으로 인해 구문 오류가 발생합니다.

이 약식 표기법은 객체 매칭을 매우 훌륭하게 제공합니다.

에서 ECMAScript5 우리가 할 무엇을 사용 :

var tmp = getDate();
var op  = tmp.op;
var lhs = tmp.lhs;
var rhs = tmp.rhs;

한 줄의 코드 ECMAScript6 에서 수행 할 수 있습니다 .

var { op, lhs, rhs } = getData();

var f = {a, b, c};

ES6 (ECMAScript 2015)와 함께 제공되었으며 다음과 정확히 동일합니다.

var f = {a: a, b: b, c: c};

이를 Object Literal Property Value Shorthands (또는 간단히 속성 값 속기, 속기 속성)라고합니다.

속기를 클래식 초기화와 결합 할 수도 있습니다.

var f = {a: 1, b, c};

자세한 내용은 Object initializer를 참조하십시오 .


var f = {a, b, c};          // <--- what exactly is this??

새로운 ECMAScript 2015 표기법을 사용하여 JavaScript에서 객체를 정의합니다.

당으로 모질라 개발자 네트워크 :

"Objects can be initialized using new Object(), Object.create(), or using the literal notation (initializer notation). An object initializer is a list of zero or more pairs of property names and associated values of an object, enclosed in curly braces ({})."

var a = "foo", 
    b = 42, 
    c = {};

// Shorthand property names (ES6)
var o = { a, b, c }; 

is equivalent to:

var a = "foo", 
    b = 42,
    c = {};

var o = { 
  a: a,
  b: b,
  c: c
};

참고URL : https://stackoverflow.com/questions/34414766/javascript-object-literal-what-exactly-is-a-b-c

반응형