2009-05-17 7 views
87

다음 두 개의 서로 다른 코드 조각은 나에게 해당하는 것 :배열과 개체의 차이점은 무엇입니까?

var myArray = Array(); 
myArray['A'] = "Athens"; 
myArray['B'] = "Berlin"; 

var myObject = {'A': 'Athens', 'B':'Berlin'}; 

둘 다 동일하게 동작하기 때문에

, 또한 typeof(myArray) == typeof(myObjects) (모두 수율 '객체').

이러한 변형은 무엇입니까?

답변

107

은 거의 자바 스크립트의 모든 객체, 그것에서 임의의 속성을 설정하여 당신이 할 수있는 "학대"는 Array 개체 그래서. 이 should be considered harmful 그래도. 배열은 숫자로 색인 된 데이터 용입니다. 숫자가 아닌 키의 경우 Object를 사용하십시오. '0'

var myArray = Array(); 
myArray['A'] = "Athens"; 
myArray['B'] = "Berlin"; 

alert(myArray.length); 

이 표시되지 않습니다 '2',하지만 -을 효과적으로 어떤 요소가 없었다 : 여기

숫자가 아닌 키 배열을 "적합"하지 않는 이유 더 구체적인 예입니다 배열에 추가 된 일부 새 속성이 배열 객체에 추가되었습니다.

+2

myArray.length는 배열의 마지막 요소의 숫자 인덱스/키를 반환하지만 실제 요소 수는 반환하지 않습니다. Array 객체의 속성이 배열 값과 다른지 여부 –

+1

난 그냥 일반 객체처럼 취급하면 Array 객체의 의도 된 의미가 학대 당했다는 것을 설명하려고했습니다. 링크 된 기사는 더 나은 일을합니다 :) –

+5

다음 번에 누군가 JavaScript가 개발하기에 좋은 언어라고하면이 샘플을 보여 드리겠습니다. 고맙습니다. –

-1

{} 표기법 만들 단지 구문 당이며; -

자바 스크립트 함수()

var Func = new Function("<params>", "<code>"); 
단지 동의어 기능의 구성과 같은 다수의 유사한 구조를 갖는 코드 보이는데
+3

기능 생성자는 **하지 ** 문자 함수에 대한 동의어. 리터럴은 생성자가 전역 인 동안 어휘 적으로 범위가 지정됩니다. '{}'는 리터럴 객체 표기법이고, []는 리터럴 배열입니다. 당신의 대답의 요지는 확실하지 않습니다. –

+0

또한 코드를 실행하기 전에 선언 된 함수를 사용할 수 있습니다. 함수 생성자를 사용하는 할당은 함수를 생성하는 코드가 실행될 때까지 사용할 수 없습니다. – RobG

13

JS 배열은 개체이며 약간 수정됩니다 (몇 가지 기능 추가).

기능과 같은 :

concat 
every 
filer 
forEach 
join 
indexOf 
lastIndexOf 
map 
pop 
push 
reverse 
shift 
slice 
some 
sort 
splice 
toSource 
toString 
unshift 
valueOf 
+0

나열된 모든 기능이 모든 JS 구현에 내장되어 있다고는 생각하지 않지만 요점은 분명합니다. 다른 차이점은 다른 프로토 타입 (추가 기능에 의해 암시되는)입니다. – Rashack

5

JavaScript의 모든 것은 기본 유형 외에 객체입니다.

var myObject = {'A': 'Athens', 'B':'Berlin'}; 

개체가 오브젝트의 인스턴스를 생성하면서

코드

var myArray = Array(); 

는 어레이 오브젝트의 인스턴스를 생성한다.

그래서 당신이 차이가 객체 생성자의 유형에 볼 수 다음 코드를

alert(myArray.constructor) 
alert(myObject.constructor) 

을보십시오.

Array 객체의 인스턴스에는 Array 프로토 타입의 모든 속성과 메서드가 포함됩니다.

4

나를 생각하면, 나도 이전의 대답과 은유적이고 비밀 스럽다. 설명이 이어집니다.

Array, Boolean, Date, Function, Number, RegExp, String의 인스턴스는 Object이지만 각 유형의 메서드 및 속성이 향상되었습니다. 예를 들어 배열에는 사전 정의 된 length 속성이 있지만 일반 객체에는 그렇지 않습니다.

javascript:alert([].length+'\n'+{}.length) 

표시

 
0 
undefined 

은 본질의 FF 게코 인터프리터는 또한 배열과 언어 구조를 평가 뚜렷한 차이 일반 객체를 구분합니다.

javascript: 
    ra=[ "one", "two", "three"]; ra.a=4; 
    ob={0:"one", 1:"two", 2:"three"}; ob.a=4; 
    alert(
    ra   +"\n\n"+ 
    ob   +"\n\n"+ 
    ra.toSource() +"\n\n"+ 
    ra.a   +"\t .toSource() forgot me! \n\n"+ 
    ra.length  +"\t and my length! \n\n"+ 
    ob.toSource()); 
    ps=""; for(i in ra)ps+=i+" "; alert(ps); /* NB .length is missing! */ 
    ps=""; for(i in ob)ps+=i+" "; alert(ps); 

표시

 
one,two,three 

[object Object] 

["one", "two", "three"] 

4 .toSource() forgot me! 

3 and my length! 

({0:"one", 1:"two", 2:"three", a:4}) 

0 1 2 a0 1 2 a와. 모든 개체는 기능한다는 방침에 대한

:

이되지도 않는다 구문이나 obj가 아닌 다른 유형 123() 또는 "abc"() 또는 []() 또는 {}() 또는 obj() 같은 함수로서 임의의 객체 인스턴스를 사용하여 의미 적으로 정확한 Function이므로 임의의 개체 INSTANCE는 Function이 아닙니다. 그러나 객체가 obj이고 유형이 Array, Boolean, Date, ... 인 경우 objArray, Boolean, Date, ...으로 어떻게 나타 났습니까? Array, Boolean, Date, ...은 무엇입니까?

javascript: 
    alert([Array, Boolean, Date, Function, 
       Number, Object, RegExp, String] . join('\n\n')); 

표시 모든 경우에

function Array() { 
    [native code] 
} 

function Boolean() { 
    [native code] 
} 

function Date() { 
    [native code] 
} 

function Function() { 
    [native code] 
} 

function Number() { 
    [native code] 
} 

function Object() { 
    [native code] 
} 

function RegExp() { 
    [native code] 
} 

function String() { 
    [native code] 
} 

는 모호한없이 객체 유형은 function 정의로 모든 객체 함수 것을 따라서 문을 명시한다! (혀는 - 뺨은 내가 의도적으로 그것의 유형으로 객체 인스턴스의 구별을 모호하게하고 희미하게 만든다는 것입니다! 여전히, 이것은 "다른 하나도 가질 수 없습니다", 객체와 함수를 보여줍니다! 인스턴스에 반대했다.)

모두 기능과 객체 패러다임

는 프로그래밍의 기초 그리고, JS 인터프리터 낮은 수준 내장 프리미티브의 같은 MathJSONtrue를 구현하는 것 같다.

javascript:alert([Math, JSON, true.toSource()].join("\n\n")); 

표시 자바 스크립트 객체 중심 프로그래밍 스타일 (OOP의 개발의시

[object Math] 

[object JSON] 

(new Boolean(true)) 

- 객체 지향 프로그래밍 스타일 -은 "의는"내 자신의 말장난이다 !) 유행에 와서 통역사는 자바에게 더 큰 신뢰를주기 위해 세례를 받았다. 기능적 프로그래밍 기술은 Automata, Recursive Functions, Formal Languages ​​등의 이론을 연구하는 것으로서 추상적이고 난해한 시험으로 이관되었습니다. 그러나 이러한 공식적인 고려 사항의 강점은 특히 FF의 Gecko 엔진 (예 : .toSource())에서 구현되는 Javascript에서 분명하게 나타납니다.


함수에 대한 개체 정의가 특히 반복 관계로 정의되어 있기 때문에 만족합니다! 자체 정의를 사용하여 정의!

function Function() { [native code] }
와 함수 이후


function Object() { [native code] }에 대해 같은 감정이 보유하는 객체입니다.

대부분의 다른 정의는 정적 터미널 값을 quiesce합니다. 그러나 eval()은 특히 강력한 기본 요소이므로 문자열은 임의의 기능을 포함 할 수도 있습니다.

위에서 사용 된 토픽은 객체 유형과 인스턴스 구별을 모호하게합니다. 모든 숫자가 아닌 인덱스가 무시됩니다 arrayJSON.stringify를 사용하는 경우

1

한 실제적인 차이는 다음과 같습니다

var arr = []; 
var obj = {}; 

arr['name'] = 'John'; 
obj['name'] = 'John'; 

console.log(arr); // will output [name: "John"] 
console.log(obj); // will output {name: "John"} 

JSON.stringify(arr); // will return [] 
JSON.stringify(obj); // will return {"name":"John"}