Sự khác biệt giữa các Array Array () và và [[] trong khi khai báo một mảng JavaScript là gì?

Sự khác biệt thực sự giữa việc khai báo một mảng như thế này là gì:

var myArray = new Array();

và

var myArray = [];

Có một sự khác biệt, nhưng không có sự khác biệt trong ví dụ đó.

Sử dụng phương thức dài hơn: new Array()có thêm một tùy chọn trong các tham số: nếu bạn chuyển một số cho hàm tạo, bạn sẽ nhận được một mảng có độ dài đó:

x = new Array(5);
alert(x.length); // 5

Để minh họa các cách khác nhau để tạo một mảng:

var a = [],            // these are the same
    b = new Array(),   // a and b are arrays with length 0

    c = ['foo', 'bar'],           // these are the same
    d = new Array('foo', 'bar'),  // c and d are arrays with 2 strings

    // these are different:
    e = [3]             // e.length == 1, e[0] == 3
    f = new Array(3),   // f.length == 3, f[0] == undefined

;

Một điểm khác biệt nữa là khi sử dụng, new Array()bạn có thể đặt kích thước của mảng, điều này ảnh hưởng đến kích thước ngăn xếp. Điều này có thể hữu ích nếu bạn nhận được tràn ngăn xếp ( Hiệu suất của Array.push so với Array.unshift ) là điều xảy ra khi kích thước của mảng vượt quá kích thước của ngăn xếp và nó phải được tạo lại. Vì vậy, thực sự có thể, tùy thuộc vào trường hợp sử dụng, có thể tăng hiệu suất khi sử dụng new Array()vì bạn có thể ngăn chặn tràn.

Như đã chỉ ra trong câu trả lời này , new Array(5)sẽ không thực sự thêm năm undefinedmục vào mảng. Nó chỉ đơn giản là thêm không gian cho năm mục. Hãy lưu ý rằng sử dụng cách Arraynày gây khó khăn array.lengthcho việc tính toán.

Sự khác biệt giữa việc tạo một mảng với mảng ẩn và hàm tạo mảng là tinh tế nhưng quan trọng.

Khi bạn tạo một mảng bằng cách sử dụng

var a = [];

Bạn đang nói với trình thông dịch để tạo một mảng thời gian chạy mới. Không cần xử lý thêm. Làm xong.

Nếu bạn dùng:

var a = new Array();

Bạn đang nói với trình thông dịch, tôi muốn gọi hàm tạo " Array" và tạo một đối tượng. Sau đó, nó tìm kiếm thông qua bối cảnh thực hiện của bạn để tìm hàm tạo để gọi và gọi nó, tạo mảng của bạn.

Bạn có thể nghĩ "Chà, điều này hoàn toàn không thành vấn đề. Chúng giống nhau!". Thật không may, bạn không thể đảm bảo điều đó.

Lấy ví dụ sau:

function Array() {
    this.is = 'SPARTA';
}

var a = new Array();
var b = [];

alert(a.is);  // => 'SPARTA'
alert(b.is);  // => undefined
a.push('Woa'); // => TypeError: a.push is not a function
b.push('Woa'); // => 1 (OK)

Trong ví dụ trên, cuộc gọi đầu tiên sẽ cảnh báo 'SPARTA' như bạn mong đợi. Thứ hai sẽ không. Bạn cuối cùng sẽ thấy không xác định. Bạn cũng sẽ lưu ý rằng b chứa tất cả các hàm đối tượng Array gốc, chẳng hạn như pushcác hàm khác không có.

Mặc dù bạn có thể mong đợi điều này xảy ra, nhưng nó chỉ minh họa thực tế []không giống như new Array().

Có lẽ tốt nhất là chỉ sử dụng []nếu bạn biết bạn chỉ muốn một mảng. Tôi cũng không đề xuất đi xung quanh và xác định lại Mảng ...

Có một sự khác biệt quan trọng mà chưa có câu trả lời nào được đề cập.

Từ đây:

new Array(2).length           // 2
new Array(2)[0] === undefined // true
new Array(2)[1] === undefined // true

Bạn có thể nghĩ rằng new Array(2)tương đương với [undefined, undefined], nhưng nó KHÔNG!

Hãy thử với map():

[undefined, undefined].map(e => 1)  // [1, 1]
new Array(2).map(e => 1)            // "(2) [undefined × 2]" in Chrome

Xem? Các ngữ nghĩa là hoàn toàn khác nhau! Vậy tại sao vậy?

Theo ES6 Spec 22.1.1.2, công việc của Array(len)chỉ là tạo một mảng mới có thuộc tính lengthđược đặt thành đối số lenvà đó là nó, có nghĩa là không có bất kỳ yếu tố thực sự nào trong mảng mới được tạo này.

Chức năng map(), theo thông số 22.1.3.15 trước tiên sẽ kiểm tra HasPropertysau đó gọi lại cuộc gọi, nhưng hóa ra là:

new Array(2).hasOwnProperty(0) // false
[undefined, undefined].hasOwnProperty(0) // true

Và đó là lý do tại sao bạn không thể mong đợi bất kỳ hàm lặp nào hoạt động như bình thường trên các mảng được tạo từ đónew Array(len) .

BTW, Safari và Firefox có cách "in" tốt hơn cho tình huống này:

// Safari
new Array(2)             // [](2)
new Array(2).map(e => 1) // [](2) 
[undefined, undefined]   // [undefined, undefined] (2) 

// Firefox
new Array(2)             // Array [ <2 empty slots> ]
new Array(2).map(e => 1) // Array [ <2 empty slots> ]
[undefined, undefined]   // Array [ undefined, undefined ]

Tôi đã gửi một vấn đề tới Chromium và yêu cầu họ khắc phục lỗi in khó hiểu này: https://bugs.chromium.org/p/chromium/issues/detail?id=732021

CẬP NHẬT: Nó đã được sửa. Chrome hiện được in dưới dạng:

new Array(2)             // (2) [empty × 2]

Thật kỳ lạ, new Array(size)nhanh hơn gần gấp đôi so với []Chrome và tương tự trong FF và IE (được đo bằng cách tạo và điền vào một mảng). Nó chỉ quan trọng nếu bạn biết kích thước gần đúng của mảng. Nếu bạn thêm nhiều mục hơn độ dài bạn đã cung cấp, hiệu suất tăng sẽ bị mất.

Chính xác hơn: Array(là một hoạt động thời gian liên tục nhanh không phân bổ bộ nhớ, máy ảnh []là hoạt động thời gian tuyến tính đặt loại và giá trị.

Để biết thêm thông tin, trang sau mô tả lý do tại sao bạn không bao giờ cần sử dụngnew Array()

Bạn không bao giờ cần phải sử dụng new Object()trong JavaScript. Sử dụng các đối tượng theo nghĩa đen {} thay thế. Tương tự, không sử dụng new Array(), [] thay vào đó hãy sử dụng mảng bằng chữ . Mảng trong JavaScript hoạt động không giống như các mảng trong Java và việc sử dụng cú pháp giống như Java sẽ khiến bạn bối rối.

Không sử dụng new Number, new Stringhoặc new Boolean. Các hình thức này tạo ra các hàm bao đối tượng không cần thiết. Chỉ cần sử dụng chữ đơn giản để thay thế.

Ngoài ra, hãy kiểm tra các nhận xét - new Array(length)biểu mẫu không phục vụ bất kỳ mục đích hữu ích nào (ít nhất là trong các triển khai JavaScript ngày nay).

Để hiểu rõ hơn []và new Array():

> []
  []
> new Array()
  []
> [] == []
  false
> [] === []
  false
> new Array() == new Array()
  false
> new Array() === new Array()
  false
> typeof ([])
  "object"
> typeof (new Array())
  "object"
> [] === new Array()
  false
> [] == new Array()
  false

Kết quả trên là từ bảng điều khiển Google Chrome trên Windows 7.

Đầu tiên là cuộc gọi xây dựng đối tượng mặc định. Bạn có thể sử dụng tham số của nó nếu bạn muốn.

var array = new Array(5); //initialize with default length 5

Cái thứ hai cung cấp cho bạn khả năng tạo mảng không trống:

var array = [1, 2, 3]; // this array will contain numbers 1, 2, 3.

Tôi có thể giải thích một cách cụ thể hơn bắt đầu với ví dụ này dựa trên ví dụ hay của Fredrik.

var test1 = [];
test1.push("value");
test1.push("value2");

var test2 = new Array();
test2.push("value");
test2.push("value2");

alert(test1);
alert(test2);
alert(test1 == test2);
alert(test1.value == test2.value);

Tôi vừa thêm một giá trị khác vào các mảng và đưa ra bốn cảnh báo: Thứ nhất và thứ hai là cung cấp cho chúng tôi giá trị được lưu trữ trong mỗi mảng, để chắc chắn về các giá trị. Họ sẽ trở lại như cũ! Bây giờ hãy thử cái thứ ba, nó trả về false, đó là vì

JS coi test1 là một VARIABLE với kiểu dữ liệu của mảng và nó coi test2 là một ĐỐI TƯỢNG với chức năng của một mảng và có một vài khác biệt nhỏ ở đây.

Sự khác biệt đầu tiên là khi chúng ta gọi test1, nó gọi một biến mà không cần suy nghĩ, nó chỉ trả về các giá trị được lưu trữ trong biến này mà không quan tâm đến kiểu dữ liệu của nó! Nhưng, khi chúng ta gọi test2, nó gọi hàm Array () và sau đó nó lưu các giá trị "Đã đẩy" của chúng ta vào thuộc tính "Giá trị" và điều tương tự xảy ra khi chúng ta cảnh báo test2, nó trả về thuộc tính "Giá trị" của đối tượng mảng.

Vì vậy, khi chúng tôi kiểm tra xem test1 có bằng test2 hay không, tất nhiên chúng sẽ không bao giờ trả về true, một là hàm và biến còn lại là một biến (với một loại mảng), ngay cả khi chúng có cùng giá trị!

Để chắc chắn về điều đó, hãy thử cảnh báo thứ 4, với .value được thêm vào nó; nó sẽ trở lại đúng Trong trường hợp này, chúng tôi nói với JS "Bỏ qua loại container, cho dù đó là chức năng hay biến, vui lòng so sánh các giá trị được lưu trữ trong mỗi container và cho chúng tôi biết những gì bạn đã thấy!" đó chính xác là những gì xảy ra.

Tôi hy vọng tôi đã nói rõ ý tưởng đằng sau đó và xin lỗi vì tiếng Anh của tôi không tốt.

Không có sự khác biệt khi bạn khởi tạo mảng mà không có độ dài. Vì vậy var a = []& var b = new Array()là như nhau.

Nhưng nếu bạn khởi tạo mảng với độ dài như thế var b = new Array(1);, nó sẽ đặt độ dài của đối tượng mảng thành 1. Vì vậy, nó tương đương với var b = []; b.length=1;.

Điều này sẽ có vấn đề bất cứ khi nào bạn thực hiện Array_object.push, nó thêm mục sau phần tử cuối cùng & tăng chiều dài.

var b = new Array(1);
b.push("hello world");
console.log(b.length); // print 2

đấu với

var v = [];
a.push("hello world");
console.log(b.length); // print 1

Cái đầu tiên là hàm tạo đối tượng mặc định call.ely được sử dụng cho các giá trị động.

var array = new Array(length); //initialize with default length

mảng thứ hai được sử dụng khi tạo các giá trị tĩnh

var array = [red, green, blue, yellow, white]; // this array will contain values.

Không có sự khác biệt lớn, về cơ bản họ làm điều tương tự nhưng thực hiện chúng theo những cách khác nhau, nhưng đọc tiếp, hãy xem tuyên bố này tại W3C:

var cars = ["Saab", "Volvo","BMW"];

và

var cars = new Array("Saab", "Volvo", "BMW");

Hai ví dụ trên làm chính xác như nhau. Không cần sử dụng Array mới ().
Để đơn giản, dễ đọc và tốc độ thực thi, hãy sử dụng phương thức đầu tiên (phương thức mảng bằng chữ).

Nhưng đồng thời, tạo mảng mới bằng cách sử dụng new Arraycú pháp được coi là một thực tiễn xấu:

Tránh mảng mới ()

Không cần sử dụng trình xây dựng mảng dựng sẵn của JavaScript Array mới ().
Sử dụng [] thay thế.
Cả hai câu lệnh khác nhau này đều tạo ra một mảng trống mới có tên điểm:

var points = new Array();         // Bad
var points = [];                  // Good 

Cả hai câu lệnh khác nhau đều tạo ra một mảng mới chứa 6 số:

var points = new Array(40, 100, 1, 5, 25, 10); // Bad    
var points = [40, 100, 1, 5, 25, 10];          // Good

Các từ khóa mới chỉ làm phức tạp mã. Nó cũng có thể tạo ra một số kết quả bất ngờ:

var points = new Array(40, 100);  // Creates an array with two elements (40 and 100)

Nếu tôi loại bỏ một trong các yếu tố thì sao?

var points = new Array(40);       // Creates an array with 40 undefined elements !!!!!

Vì vậy, về cơ bản không được coi là thực tiễn tốt nhất, cũng có một sự khác biệt nhỏ ở đó, bạn có thể vượt qua độ dài để new Array(length)thích điều này, đó cũng không phải là một cách được khuyến nghị.

Sự khác biệt của việc sử dụng

var arr = new Array(size);

Hoặc là

arr = [];
arr.length = size;

Như đã được thảo luận đủ trong câu hỏi này.

Tôi muốn thêm vấn đề tốc độ - cách nhanh nhất hiện tại , google chromelà cách thứ hai.

Nhưng hãy chú ý, những điều này có xu hướng thay đổi rất nhiều với các bản cập nhật. Ngoài ra thời gian chạy sẽ khác nhau giữa các trình duyệt khác nhau.

Ví dụ: tùy chọn thứ 2 mà tôi đã đề cập, chạy ở mức 2 triệu [ops / giây] chrome, nhưng nếu bạn thử nó, mozilla dev.bạn sẽ nhận được tỷ lệ cao hơn đáng ngạc nhiên là 23 triệu.

Dù sao, tôi khuyên bạn nên kiểm tra nó, thỉnh thoảng, trên các trình duyệt (và máy) khác nhau, sử dụng trang web như vậy

Như tôi biết diference u có thể tìm thấy những lát (hoặc funcitons khác của Array) như code1 .và code2 hiển thị u Mảng và mình trường hợp :

mã1:

[].slice; // find slice here
var arr = new Array();
arr.slice // find slice here
Array.prototype.slice // find slice here

mã2:

[].__proto__ == Array.prototype; // true
var arr = new Array();
arr.__proto__ == Array.prototype; // true

phần kết luận:

như bạn có thể thấy []và new Array()tạo một phiên bản mới của Array. Và tất cả họ đều nhận được các hàm nguyên mẫu từArray.prototype

Chúng chỉ là ví dụ khác nhau của Array.so điều này giải thích tại sao [] != []

:)

Tôi đã phải chịu một hành vi kỳ lạ khi sử dụng [].

Chúng tôi có Mô hình "lớp" với các trường được khởi tạo cho một số giá trị. Ví dụ:

require([
  "dojo/_base/declare",
  "dijit/_WidgetBase",
], function(declare, parser, ready, _WidgetBase){

   declare("MyWidget", [_WidgetBase], {
     field1: [],
     field2: "",
     function1: function(),
     function2: function()
   });    
});

Tôi thấy rằng khi các trường được khởi tạo cùng với []nó thì nó sẽ được chia sẻ bởi tất cả các đối tượng Model. Thay đổi một trong những ảnh hưởng đến tất cả những người khác.

Điều này không xảy ra khi khởi tạo chúng với new Array(). Tương tự cho việc khởi tạo Đối tượng ( {}so với mới Object())

TBH Tôi không chắc đó có phải là vấn đề với khung mà chúng tôi đang sử dụng không ( Dojo )

Có nhiều thứ hơn là bắt mắt. Hầu hết các câu trả lời khác đều đúng NHƯNG ..

new Array(n)

• Cho phép động cơ phân bổ lại không gian cho ncác phần tử
• Tối ưu hóa cho việc tạo mảng
• Mảng được tạo được đánh dấu thưa thớt có hoạt động mảng ít hiệu quả nhất, đó là vì mỗi truy cập chỉ mục phải kiểm tra giới hạn, xem giá trị có tồn tại và đi theo chuỗi nguyên mẫu không
• Nếu mảng được đánh dấu là thưa thớt, không có cách nào quay lại (ít nhất là trong V8), nó sẽ luôn chậm hơn trong suốt vòng đời của nó, ngay cả khi bạn lấp đầy nó bằng nội dung (mảng đóng gói) 1ms hoặc 2 giờ sau, không thành vấn đề

[1, 2, 3] || []

• Mảng được tạo được đánh dấu đóng gói (trừ khi bạn sử dụng deletehoặc [1,,3]cú pháp)
• Tối ưu hóa cho mảng hoạt động ( for .., forEach, map, vv)
• Động cơ cần phân bổ lại không gian khi mảng phát triển

Đây có lẽ không phải là trường hợp cho các phiên bản / trình duyệt cũ hơn.

Tôi đã tìm thấy một sự khác biệt giữa hai công trình khiến tôi khá khó khăn.

Hãy nói rằng tôi có:

function MyClass(){
  this.property1=[];
  this.property2=new Array();
};
var MyObject1=new MyClass();
var MyObject2=new MyClass();

Trong cuộc sống thực, nếu tôi làm điều này:

MyObject1.property1.push('a');
MyObject1.property2.push('b');
MyObject2.property1.push('c');
MyObject2.property2.push('d');

Những gì tôi kết thúc là đây:

MyObject1.property1=['a','c']
MyObject1.property2=['b']
MyObject2.property1=['a','c']
MyObject2.property2=['d']

Tôi không biết đặc tả ngôn ngữ nói gì sẽ xảy ra, nhưng nếu tôi muốn hai đối tượng của mình có mảng thuộc tính duy nhất trong các đối tượng của mình, tôi phải sử dụng new Array().

Việc sử dụng hàm tạo Array tạo ra một mảng mới có độ dài mong muốn và điền vào từng chỉ số không xác định, mảng được gán cho một biến sẽ tạo ra các chỉ mục mà bạn cung cấp cho nó thông tin.