ความแตกต่างระหว่าง“ Array ()” และ“ []” ในขณะที่ประกาศอาร์เรย์ JavaScript คืออะไร

ความแตกต่างที่แท้จริงระหว่างการประกาศอาร์เรย์เช่นนี้คืออะไร:

var myArray = new Array();

และ

var myArray = [];

มีความแตกต่าง แต่ไม่มีความแตกต่างในตัวอย่างนั้น

ใช้วิธีการ verbose เพิ่มเติม: new Array()มีหนึ่งตัวเลือกพิเศษในพารามิเตอร์: ถ้าคุณส่งตัวเลขไปยังตัวสร้างคุณจะได้รับอาร์เรย์ของความยาวนั้น:

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

เพื่อแสดงวิธีต่างๆในการสร้างอาร์เรย์:

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

;

ข้อแตกต่างก็คือเมื่อใช้new Array()คุณสามารถกำหนดขนาดของอาเรย์ซึ่งมีผลต่อขนาดสแต็ค สิ่งนี้จะมีประโยชน์หากคุณได้รับ stack overflows ( ประสิทธิภาพของ Array.push vs Array.unshift ) ซึ่งจะเกิดอะไรขึ้นเมื่อขนาดของอาร์เรย์มีขนาดเกินกว่าขนาดของสแต็กและจะต้องถูกสร้างขึ้นใหม่ ดังนั้นจึงสามารถจริงได้ขึ้นอยู่กับกรณีการใช้งานที่จะเพิ่มประสิทธิภาพการทำงานเมื่อใช้new Array()เพราะคุณสามารถป้องกันไม่ให้เกิดล้นเกิน

เป็นแหลมออกในคำตอบนี้ , new Array(5)จะไม่เพิ่มห้าundefinedรายการที่จะอาร์เรย์ มันเพิ่มพื้นที่สำหรับห้ารายการ โปรดทราบว่าการใช้Arrayวิธีนี้ทำให้ยากต่อarray.lengthการเชื่อถือสำหรับการคำนวณ

ความแตกต่างระหว่างการสร้างอาร์เรย์ที่มีอาเรย์โดยนัยและตัวสร้างอาร์เรย์นั้นบอบบาง แต่สำคัญ

เมื่อคุณสร้างอาร์เรย์โดยใช้

var a = [];

คุณกำลังบอกล่ามเพื่อสร้างอาร์เรย์รันไทม์ใหม่ ไม่จำเป็นต้องดำเนินการใด ๆ เพิ่มเติม เสร็จสิ้น

ถ้าคุณใช้:

var a = new Array();

คุณกำลังบอกล่ามฉันต้องการเรียกตัวสร้าง " Array" และสร้างวัตถุ จากนั้นจะค้นหาบริบทการดำเนินการของคุณเพื่อค้นหาตัวสร้างการโทรและเรียกมันเพื่อสร้างอาร์เรย์ของคุณ

คุณอาจคิดว่า "เอาละนี่มันไม่สำคัญเลยพวกมันเหมือนกัน!" น่าเสียดายที่คุณไม่สามารถรับประกันได้

นำตัวอย่างต่อไปนี้:

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)

ในตัวอย่างข้างต้นสายแรกจะแจ้งเตือน 'SPARTA' ตามที่คุณคาดหวัง ที่สองจะไม่ คุณจะเห็นการไม่ได้กำหนด นอกจากนี้คุณยังจะทราบว่า b มีฟังก์ชั่นวัตถุพื้นเมืองของอาเรย์ทั้งหมดเช่นpushที่อื่นไม่ได้

ในขณะที่คุณอาจคาดหวังนี้จะเกิดขึ้นมันก็แสดงให้เห็นถึงความจริงที่ว่าไม่ได้เป็นเช่นเดียวกับ[]new Array()

มันอาจจะเป็นการดีที่สุด[]ถ้าใช้ถ้าคุณรู้ว่าคุณต้องการอาเรย์ ฉันยังไม่แนะนำให้ไปรอบ ๆ และกำหนดอาร์เรย์ใหม่ ...

มีความแตกต่างที่สำคัญที่ยังไม่ได้รับคำตอบ

จากนี้:

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

คุณอาจคิดว่าnew Array(2)เทียบเท่ากับ[undefined, undefined], แต่ก็ไม่ได้!

ลองด้วยmap():

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

ดู? ความหมายต่างกันโดยสิ้นเชิง! แล้วทำไมถึงเป็นอย่างนั้น?

ตาม ES6 Spec 22.1.1.2 งานของArray(len)เพิ่งสร้างอาร์เรย์ใหม่ซึ่งคุณสมบัติlengthถูกตั้งค่าเป็นอาร์กิวเมนต์lenและนั่นคือมันหมายความว่าไม่มีองค์ประกอบจริงใด ๆภายในอาร์เรย์ที่สร้างขึ้นใหม่นี้

ฟังก์ชั่นmap()ตามข้อมูลจำเพาะ 22.1.3.15 จะตรวจสอบก่อนHasPropertyแล้วโทรกลับ แต่มันกลับกลายเป็นว่า:

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

และนั่นเป็นเหตุผลที่คุณไม่สามารถคาดหวังการทำงาน iterating ใด ๆ new Array(len)ทำงานตามปกติในอาร์เรย์ที่สร้างขึ้นจาก

BTW, Safari และ Firefox มี "การพิมพ์" ที่ดีขึ้นในสถานการณ์นี้:

// 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 ]

ฉันได้ส่งปัญหาไปที่ Chromium และขอให้พวกเขาแก้ไขการพิมพ์ที่สับสน: https://bugs.chromium.org/p/chromium/issues/detail?id=732021

อัปเดต: ได้รับการแก้ไขแล้ว Chrome พิมพ์ออกมาเป็น:

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

ผิดปกติพอnew Array(size)เร็วกว่า[]Chrome ประมาณ2 เท่าและประมาณเท่ากันใน FF และ IE (วัดจากการสร้างและเติมอาร์เรย์) มันสำคัญถ้าคุณรู้ขนาดโดยประมาณของอาเรย์ หากคุณเพิ่มรายการมากกว่าความยาวที่คุณได้รับการเพิ่มประสิทธิภาพจะหายไป

แม่นยำยิ่งขึ้น: Array(เป็นการดำเนินการเวลาคงที่ที่รวดเร็วซึ่งไม่จัดสรรหน่วยความจำ wheras []เป็นการดำเนินการเชิงเส้นเวลาที่กำหนดประเภทและค่า

สำหรับข้อมูลเพิ่มเติมหน้าต่อไปนี้อธิบายถึงสาเหตุที่คุณไม่จำเป็นต้องใช้new Array()

คุณไม่จำเป็นต้องใช้new Object()ใน JavaScript ใช้วัตถุตามตัวอักษร{} แทน ในทำนองเดียวกันอย่าใช้new Array()ให้ใช้ตัวอักษรของอาร์เรย์[] แทน อาร์เรย์ใน JavaScript ไม่ทำงานเหมือนกับอาร์เรย์ใน Java และการใช้ไวยากรณ์เหมือน Java จะทำให้คุณสับสน

อย่าใช้new Number, หรือnew String new Booleanแบบฟอร์มเหล่านี้สร้างตัวห่อวัตถุที่ไม่จำเป็น เพียงใช้ตัวอักษรธรรมดาแทน

นอกจากนี้ตรวจสอบความคิดเห็น - new Array(length)แบบฟอร์มไม่ได้ให้บริการเพื่อวัตถุประสงค์ที่เป็นประโยชน์ใด ๆ (อย่างน้อยในการใช้งาน JavaScript ในปัจจุบัน)

เพื่อให้เข้าใจ[]และ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

ผลลัพธ์ข้างต้นมาจากคอนโซลของ Google Chrome บน Windows 7

คนแรกคือการเรียกการสร้างวัตถุเริ่มต้น คุณสามารถใช้มันพารามิเตอร์ถ้าคุณต้องการ

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

อันที่สองให้ความสามารถในการสร้างอาเรย์ไม่ว่าง:

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

ฉันสามารถอธิบายได้อย่างเฉพาะเจาะจงมากขึ้นโดยเริ่มจากตัวอย่างนี้ซึ่งอิงจากตัวอย่างที่ดีของ 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);

ฉันเพิ่งเพิ่มค่าอื่นเข้าไปในอาร์เรย์และทำการแจ้งเตือนสี่ครั้ง: ครั้งแรกและครั้งที่สองคือการให้ค่าที่เราเก็บไว้ในแต่ละอาร์เรย์เพื่อให้แน่ใจเกี่ยวกับค่า พวกเขาจะกลับมาเหมือนเดิม! ลองอันที่สามมันกลับมาผิดนั่นเป็นเพราะ

JS ถือว่าtest1เป็นตัวแปรที่มีชนิดข้อมูลของอาเรย์และถือว่าtest2เป็นOBJECT ด้วยฟังก์ชันการทำงานของอาเรย์และมีความแตกต่างเล็กน้อยที่นี่

ความแตกต่างแรกคือเมื่อเราเรียก test1 มันเรียกตัวแปรโดยไม่ต้องคิดมันแค่คืนค่าที่เก็บไว้ในตัวแปรนี้โดยไม่คำนึงถึงชนิดข้อมูล! แต่เมื่อเราเรียก test2 จะเรียกใช้ฟังก์ชันArray ()แล้วเก็บค่า"Pushed"ของเราในคุณสมบัติ"Value"ของมันและเกิดขึ้นเมื่อเราแจ้งเตือน test2 มันจะส่งคืนคุณสมบัติ"Value"ของวัตถุอาร์เรย์

ดังนั้นเมื่อเราตรวจสอบว่า test1 เท่ากับ test2 แน่นอนว่าพวกเขาจะไม่กลับมาจริงหนึ่งคือฟังก์ชั่นและอื่น ๆ ที่เป็นตัวแปร (กับประเภทของอาร์เรย์) แม้ว่าพวกเขาจะมีค่าเดียวกัน!

เพื่อให้แน่ใจเกี่ยวกับเรื่องนี้ให้ลองแจ้งเตือนครั้งที่ 4 โดยเพิ่มค่า. value ไว้ มันจะกลับมาจริง ในกรณีนี้เราบอก JS "การไม่สนใจประเภทของคอนเทนเนอร์ไม่ว่าจะเป็นฟังก์ชั่นหรือตัวแปรโปรดเปรียบเทียบค่าที่เก็บไว้ในแต่ละคอนเทนเนอร์และบอกสิ่งที่คุณเห็น!" นั่นคือสิ่งที่เกิดขึ้น

ฉันหวังว่าฉันจะพูดความคิดที่อยู่เบื้องหลังอย่างชัดเจนและขอโทษสำหรับภาษาอังกฤษที่ไม่ดีของฉัน

ไม่มีความแตกต่างเมื่อคุณเริ่มต้นอาร์เรย์โดยไม่มีความยาว ดังนั้นvar a = []และvar b = new Array()เป็นเหมือนกัน

แต่ถ้าคุณ initialise อาร์เรย์ที่มีความยาวเช่นvar b = new Array(1);นั้นก็จะกำหนดความยาวของวัตถุอาร์เรย์ 1 var b = []; b.length=1;ดังนั้นเพื่อให้เทียบเท่า

นี่จะเป็นปัญหาเมื่อใดก็ตามที่คุณทำ array_object.push จะเพิ่มรายการหลังจากองค์ประกอบสุดท้าย & เพิ่มความยาว

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

VS

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

อันแรกคือตัวสร้างวัตถุเริ่มต้น call.mostly ใช้สำหรับค่าแบบไดนามิก

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

อาร์เรย์ที่สองถูกใช้เมื่อสร้างค่าคงที่

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

ไม่มีความแตกต่างใหญ่พวกเขาโดยทั่วไปทำสิ่งเดียวกัน แต่ทำในวิธีที่แตกต่างกัน แต่อ่านต่อดูคำสั่งนี้ที่ W3C:

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

และ

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

ตัวอย่างสองตัวอย่างข้างต้นทำสิ่งเดียวกัน ไม่จำเป็นต้องใช้ Array ใหม่ ()
เพื่อความง่ายการอ่านและความเร็วในการดำเนินการให้ใช้วิธีแรก (วิธีเรียงตามตัวอักษร)

แต่ในเวลาเดียวกันการสร้างอาร์เรย์ใหม่โดยใช้new Arrayไวยากรณ์ถือเป็นแนวทางปฏิบัติที่ไม่ดี:

หลีกเลี่ยงอาร์เรย์ใหม่ ()

ไม่จำเป็นต้องใช้ตัวสร้างอาร์เรย์ในตัวของ JavaScript ใหม่ Array ()
ใช้ [] แทน
ข้อความทั้งสองที่แตกต่างกันเหล่านี้ทั้งสองสร้างอาร์เรย์ว่างใหม่ชื่อคะแนน

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

ข้อความทั้งสองที่แตกต่างกันทั้งสองนี้สร้างอาร์เรย์ใหม่ที่มี 6 หมายเลข

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

ใหม่คำหลักเพียงความซับซ้อนรหัส นอกจากนี้ยังสามารถให้ผลลัพธ์ที่ไม่คาดคิด:

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

ถ้าฉันลบองค์ประกอบใดรายการหนึ่งออก

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

ดังนั้นโดยทั่วไปแล้วไม่ถือว่าเป็นแนวปฏิบัติที่ดีที่สุดนอกจากนี้ยังมีความแตกต่างเล็กน้อยอีกประการหนึ่งคุณสามารถส่งความยาวnew Array(length)แบบนี้ได้ซึ่งไม่ใช่วิธีที่แนะนำ

ความแตกต่างของการใช้

var arr = new Array(size);

หรือ

arr = [];
arr.length = size;

ตามที่ได้กล่าวไปแล้วเพียงพอในคำถามนี้

ฉันต้องการเพิ่มความเร็ว - วิธีที่เร็วที่สุดในปัจจุบันgoogle chromeคืออันที่สอง

แต่ให้ความสนใจสิ่งเหล่านี้มีแนวโน้มที่จะเปลี่ยนไปมากด้วยการอัพเดท นอกจากนี้เวลาทำงานจะแตกต่างกันระหว่างเบราว์เซอร์ที่แตกต่างกัน

ตัวอย่างเช่น - ตัวเลือกที่ 2 ที่ฉันพูดถึงทำงานที่ 2 ล้าน [ops / วินาที] ในchromeแต่ถ้าคุณลองมันmozilla dev.คุณจะได้รับอัตราที่สูงขึ้นอย่างน่าประหลาดใจ 23 ล้าน

อย่างไรก็ตามฉันขอแนะนำให้คุณตรวจสอบทุกครั้งในเบราว์เซอร์ที่แตกต่างกัน (และเครื่อง) โดยใช้เว็บไซต์เช่นนี้

ที่ผมรู้ diference ยูสามารถหาชิ้น (หรือ funcitons อื่น ๆ ของอาร์เรย์) เช่นรหัส 1 .and code2แสดงยูอาร์เรย์ของเขาและอินสแตนซ์ :

รหัส 1:

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

code2:

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

สรุป:

ในขณะที่คุณสามารถดู[]และnew Array()สร้างอินสแตนซ์ใหม่ของ Array และพวกเขาทั้งหมดได้รับฟังก์ชั่นต้นแบบจากArray.prototype

พวกเขาเป็นเพียงตัวอย่างที่แตกต่างกันของ Array.so อธิบายว่าทำไม [] != []

:)

ฉันมีพฤติกรรมแปลก ๆ โดยใช้ []

เรามีโมเดล "คลาส" พร้อมฟิลด์ที่เริ่มต้นด้วยค่าบางค่า เช่น:

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

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

ฉันพบว่าเมื่อฟิลด์ถูกเริ่มต้นด้วย[]แล้วมันจะถูกใช้ร่วมกันโดยวัตถุแบบจำลองทั้งหมด การเปลี่ยนแปลงที่มีผลกระทบต่อคนอื่นทั้งหมด

นี้ไม่ได้เกิดขึ้น initialising new Array()พวกเขาด้วย เหมือนกันสำหรับการเริ่มต้นของ Objects ( {}vs new Object())

TBH ฉันไม่แน่ใจว่าเป็นปัญหากับกรอบที่เราใช้ ( Dojo )

มีมากกว่านี้มากกว่าที่ตาเห็น คำตอบอื่น ๆ ส่วนใหญ่นั้นถูกต้องแต่ก็ยัง ..

new Array(n)

• อนุญาตให้เอ็นจิ้นจัดสรรพื้นที่สำหรับnองค์ประกอบใหม่
• ปรับให้เหมาะสมสำหรับการสร้างอาร์เรย์
• อาเรย์ที่สร้างถูกทำเครื่องหมายว่าเบาบางซึ่งมีการดำเนินการอาเรย์ที่มีประสิทธิภาพน้อยนั่นเป็นเพราะการเข้าถึงแต่ละดัชนีจะต้องตรวจสอบขอบเขตดูว่ามีค่าอยู่หรือไม่และเดินโซ่ลูกโซ่ต้นแบบ
• หากอาร์เรย์ถูกทำเครื่องหมายเป็นเบาบางจะไม่มีทางย้อนกลับ (อย่างน้อยใน V8) มันจะช้าลงตลอดช่วงชีวิตแม้ว่าคุณจะเติมเนื้อหาด้วย (อาร์เรย์ที่บรรจุ) 1ms หรือ 2 ชั่วโมงต่อมาไม่สำคัญ

[1, 2, 3] || []

• อาร์เรย์ที่สร้างถูกทำเครื่องหมายบรรจุแล้ว (ยกเว้นว่าคุณใช้deleteหรือ[1,,3]ไวยากรณ์)
• เหมาะสำหรับอาร์เรย์การดำเนินงาน ( for .., forEach, mapฯลฯ )
• Engine ต้องการจัดสรรพื้นที่ใหม่เมื่ออาเรย์เติบโต

นี่อาจไม่ใช่กรณีของเบราว์เซอร์รุ่นเก่า / เบราว์เซอร์

ฉันพบความแตกต่างระหว่างสองสิ่งก่อสร้างที่ทำให้ฉันค่อนข้างยาก

สมมติว่าฉันมี:

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

ในชีวิตจริงถ้าฉันทำสิ่งนี้:

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

สิ่งที่ฉันท้ายที่สุดคือ:

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

ผมไม่ทราบว่าสิ่งที่สเปคภาษาที่กล่าวว่าควรจะเกิดขึ้น new Array()แต่ถ้าผมต้องการที่วัตถุสองของฉันจะมีอาร์เรย์คุณสมบัติที่ไม่ซ้ำกันในวัตถุของฉันฉันมีกับการใช้งาน

การใช้ Constructor Array สร้างอาร์เรย์ใหม่ของความยาวที่ต้องการและเติมดัชนีแต่ละรายการโดยไม่ได้กำหนดอาร์เรย์ที่กำหนดให้กับตัวแปรจะสร้างดัชนีที่คุณให้ข้อมูล