Các thực tiễn tốt nhất để làm theo khi khai báo một mảng trong Javascript là gì?


176

Khi tôi cần khai báo một mảng mới, tôi sử dụng ký hiệu này

var arr = new Array();

Nhưng khi kiểm tra trực tuyến, ví dụ trên jsbin , một cảnh báo báo hiệu cho tôi "Sử dụng ký hiệu bằng chữ []."

Tôi không tìm thấy lý do để tránh sử dụng hàm tạo. Là một cách nào đó kém hiệu quả hơn so với sử dụng []? Hay là thực hành xấu?

Có một lý do tốt để sử dụng var arr = [];thay vì var arr = new Array();?


5
Cả hai đều ổn. Bạn chỉ cần lưu một số byte trong truyền.
Sirko

13
Có sự khác biệt thực sự. Xem bài đăng này: stackoverflow.com/q/2280285/921204
techfoobar

Lưu ý: có sự khác biệt nếu Array chỉ bị ghi đè .
crdx

@apkd trên một số trình duyệt có sự khác biệt đáng kể về hiệu suất
Alnitak

Đủ công bằng. Tôi không thấy điều đó trong câu hỏi liên kết.
crdx

Câu trả lời:


260

Hầu hết , mọi người sử dụng var a = []Douglas Crockford nói như vậy .

Lý do của anh ta bao gồm hành vi không trực quan và không nhất quán của new Array():

var a = new Array(5);     // an array pre-sized to 5 elements long
var b = new Array(5, 10); // an array with two elements in it

Lưu ý rằng không có cách nào new Array()để tạo một mảng chỉ với một phần tử số được chỉ định trước trong đó!

Sử dụng []thực sự hiệu quả hơn, và cũng an toàn hơn ! Có thể ghi đè lên hàm Arraytạo và làm cho nó thực hiện những điều kỳ lạ, nhưng bạn không thể ghi đè lên hành vi của [].

Cá nhân, tôi luôn sử dụng []cú pháp và tương tự luôn sử dụng {}cú pháp thay cho new Object().


5
"bạn không thể ghi đè lên hành vi của []." Bạn có chắc về điều này? Tôi nghĩ rằng bạn có thể ghi đè lên hàm tạo Array để ảnh hưởng đến [] và hàm tạo đối tượng ảnh hưởng đến {}, ít nhất là trên một số triển khai.
Random832

11
@ Random832 có thể trong các trình duyệt cũ hơn, nhưng không phải trong các triển khai tương thích ES5, trong đó thông số kỹ thuật nói rằng []gọi một hàm tạo bên trong, không phải là bất kỳ giá trị nào Array.constructorxảy ra tại thời điểm đó.
Alnitak

5
Phần thưởng: Các ký tự mảng nhanh hơn nhiều so với việc tạo các mảng mới bằng cách sử dụng hàm Arraytạo: jsperf.com/new-array
Mathias Bynens

@MathiasBynens chỉ đôi khi.
OrangeDog

Ew @ the [] hoạt động khác nhau vì điều xây dựng bên trong. Sự không nhất quán sẽ gây ra nhiều nhầm lẫn hơn nó tiết kiệm. Chỉnh sửa: Ah, mối quan tâm bảo mật. Tôi hiểu rồi.
Erik Reppen

48

Một sự khác biệt đáng kể là []sẽ luôn khởi tạo một Mảng mới, trong khi new Arraycó thể bị tấn công để tạo ra một đối tượng khác .

(function () {
    "use strict";
    var foo,
        bar;
    //don't do this, it's a bad idea
    function Array() {
        alert('foo');
    }
    foo = new Array();
    bar = [];
}());​

Trong mã ví dụ của tôi, tôi đã giữ Arraychức năng ẩn khỏi phần còn lại của phạm vi tài liệu, tuy nhiên nhiều khả năng là nếu bạn gặp phải loại vấn đề này thì mã sẽ không bị bỏ lại trong một bao đóng đẹp, và sẽ có thể khó xác định vị trí.

Tuyên bố từ chối trách nhiệm : Không phải là một ý tưởng tốt để chiếm quyền Arrayxây dựng.


7
IIRC, trong các trình duyệt cũ hơn ghi đè hàm tạo Array cũng sẽ khiến cho nghĩa đen bị hiểu sai. Có một lỗ hổng GMR CSRF một thời gian trước đây liên quan đến việc ghi đè trình xây dựng mảng và các trình duyệt mới bỏ qua việc quá tải cho các chữ vì lý do chính xác này.
hugomg

Từ chối trách nhiệm: tuy nhiên nó cực kỳ hữu ích và hữu ích để tăng cường trình xây dựng Array trong nhiều năm qua.
Erik Reppen

26

để bảo trì, sử dụng []

Nghĩa đen là dễ dự đoán hơn, vì hầu hết các nhà phát triển sử dụng nó. Hầu hết việc sử dụng mảng ngoài đó sẽ được sử dụng theo nghĩa đen và có giá trị trong việc mã của bạn khớp với những gì các nhà phát triển khác sử dụng.

cho mảng trống, sử dụng []

var ns = [];
var names = [ 'john', 'brian' ];

Như được hiển thị ở đây , sử dụng nghĩa đen cho sản phẩm nào và một vài yếu tố đã biết là béo hơn so với hàm tạo của Array.

Đối với một mảng có kích thước đã biết, sử dụng new Array(size)

Nếu kích thước được biết đến, thì việc sử dụng hàm tạo Array cải thiện đáng kể hiệu năng. Tuy nhiên, điều đó cũng có nghĩa là bạn phải đối phó với một mảng đã 'không xác định' điền vào tất cả các giá trị của nó.

Như được hiển thị ở đây

// fill an array with 100 numbers
var ns = new Array( 100 );
for ( var i = 0; i < 100; i++ ) {
    ns[i] = i;
}

Điều này cũng hoạt động cho các mảng rất nhỏ quá .


12

Không, thực sự không có lý do gì để sử dụng một ký hiệu so với ký hiệu kia cho Mảng trống.

Tuy nhiên, hầu hết các trình duyệt cho thấy hiệu suất sử dụng tốt hơn một chút x = [];so với gọi Trình xây dựng .

Nếu bạn cần tạo một Mảng có kích thước cụ thể, chẳng hạn, bạn cần sử dụng x = new Array(10);một Mảng, điều này sẽ tạo ra một Mảng có 10 undefinedvị trí.


@Alnitak: mà bạn đã đề cập, không trực quan và súc tích.
jAndy

7
Tôi kết hợp một jsperf để so sánh hiệu suất: jsperf.com/array-constructor-versus-literal . Ít nhất là đối với tôi trên Chrome 20 trên Ubuntu, nghĩa đen nhanh gấp đôi so với nhà xây dựng.
Steven


jAndy, tại sao bạn muốn có một mảng với "10 vị trí trống" trong JavaScript? Trong thực tế, bạn có thể thực hiện chính xác điều tương tự với: var Array = []; mảng [9] = "omega"; 1. Mảng trong JS hoàn toàn động, bạn có thể tham chiếu bất kỳ chỉ mục nào bạn muốn và nó sẽ chỉ là "không xác định". Điều này đúng như thể bạn muốn nói: var Array = new Array (10); mảng [23]; 2. chiều dài của mảng sẽ được đặt thành giá trị cao nhất có bất cứ thứ gì trong đó, bất kể có bao nhiêu vị trí không xác định ở giữa. Hoặc bạn có thể thiết lập nó, chính mình. [] có thể không chữa khỏi ung thư, nhưng tốt hơn một chút.
Norguard

7
  • var Array = [] sử dụng mảng / đối tượng bằng chữ
  • var Array = new Array () sử dụng hàm tạo mảng / đối tượng

Cách nhanh nhất để xác định một mảng hoặc đối tượng là theo nghĩa đen, bởi vì bạn không cần phải gọi hàm tạo

var arr1 = new Array(1, 2, 3, 4);
var arr2 = [1, 2, 3, 4];

alert(arr1[0]); // 1
alert(arr2[0]); // 1

var arr3 = new Array(200);
var arr4 = [200];

alert(arr3[0]); // 'undefined'
alert(arr4[0]); // 200

2
Để tham khảo, đằng sau hậu trường, cũng var arr = [];sử dụng một hàm tạo. Nó luôn luôn là hàm tạo mảng tích hợp, chứ không phải là bất kỳ hàm nào hiện đang có tên Array.
cHao

6

Cả hai đều đúng. Nhưng hầu hết mọi người sử dụngvar a = []

Ba cách để khai báo một mảng trong JavaScript.

phương pháp 1 : Chúng ta có thể khai báo rõ ràng một mảng bằng từ khóa "mới" JavaScript để khởi tạo mảng trong bộ nhớ (nghĩa là tạo nó và làm cho nó có sẵn).

// Declare an array (using the array constructor)
var arlene1 = new Array();
var arlene2 = new Array("First element", "Second", "Last");

phương pháp 2 : chúng tôi sử dụng một phương pháp thay thế để khai báo mảng.

// Declare an array (using literal notation)
var arlene1 = [];
var arlene2 = ["First element", "Second", "Last"];

phương pháp 3 : JavaScript cũng cho phép bạn tạo các mảng gián tiếp, bằng cách gọi các phương thức cụ thể.

// Create an array from a method's return value
var carter = "I-learn-JavaScript";
var arlene3 = carter.split("-");

4

Có một giới hạn mà hàm tạo có thể lấy làm đối số.

Trên hầu hết các hệ thống, tôi trang bị giới hạn là 2 ^ 16 (2 byte):

var myFreshArr = new Array(0,1,2,3 ..... 65536);

Điều đó sẽ gây ra lỗi (quá nhiều đối số ....)

Khi sử dụng nghĩa đen [] bạn không gặp phải vấn đề như vậy.

Trong trường hợp bạn không quan tâm đến các mảng lớn như vậy, tôi nghĩ bạn có thể sử dụng bất cứ thứ gì bạn thích.


2
Bạn có thể trích dẫn một ví dụ về nơi một người có thể muốn tạo ra một mảng được điền trước với 70.000 giá trị một cách hợp lý không? Mặc dù vậy, nó thực sự giải thích một số trang web khủng khiếp mà tôi đã thấy dường như không bao giờ tải xong ...
John O

2
John O, tôi đã thấy một số triển khai JSON của SCary trong thời gian của tôi, liên quan đến các mảng 2D / 3D, bao gồm mã IATA (sân bay), công ty hàng không, công ty lữ hành, khu nghỉ dưỡng, et cetera ... ... tất cả đều bị nhồi thành một mảng. Đó là ... ... 1MB + Tải xuống JSON làm tôi muốn khóc.
Norguard

4
var array = [ 1, 2, 3, 4];

là đường

var array = new Array(1, 2, 3, 4);

là muối


5
và sử dụng nó ở đâu, cho cà phê hay mì ống?
Aristos

cú pháp đường và muối
linquize

3

Đó là bởi vì new Array()mơ hồ. Đây là các nhà xây dựng chính xác:

// Using brackets
[element0, element1, ..., elementN]

// Using new AND a list of elements
new Array(element0, element1, ..., elementN)

// Using new AND an integer specifying the array length
new Array(arrayLength)
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.