ตัวแปร JavaScript ประกาศนอกหรือในวง?

ใน AS3 ฉันเชื่อว่าคุณควรเริ่มต้นตัวแปรทั้งหมดนอกลูปเพื่อประสิทธิภาพที่เพิ่มขึ้น เป็นกรณีนี้กับ JavaScript เช่นกัน? แบบไหนดีกว่า / เร็วกว่า / แนวปฏิบัติที่ดีที่สุด

var value = 0;

for (var i = 0; i < 100; i++)
{
    value = somearray[i];
}

หรือ

for (var i = 0 ; i < 100; i++)
{
    var value = somearray[i];
}

มีอย่างไม่แตกต่างกันในความหมายหรือประสิทธิภาพใน JavaScript หรือ ActionScript

varเป็นคำสั่งสำหรับ parser และไม่ใช่คำสั่งที่ถูกเรียกใช้ในเวลาทำงาน หากมีการประกาศตัวระบุเฉพาะvarหนึ่งครั้งหรือมากกว่าในที่ใดก็ได้ในส่วนของฟังก์ชั่น (*) การใช้ตัวระบุนั้นในบล็อกทั้งหมดจะอ้างอิงถึงตัวแปรท้องถิ่น มันไม่ได้ทำให้ความแตกต่างไม่ว่าจะvalueมีการประกาศว่าจะvarอยู่ในวงนอกวงหรือทั้งสองอย่าง

ดังนั้นคุณควรเขียนสิ่งที่คุณเห็นว่าอ่านง่ายที่สุด ฉันไม่เห็นด้วยกับ Crockford ที่วาง vars ทั้งหมดที่ด้านบนของฟังก์ชั่นเป็นสิ่งที่ดีที่สุดเสมอ สำหรับกรณีที่มีการใช้ตัวแปรชั่วคราวในส่วนของรหัสจะเป็นการดีกว่าที่จะประกาศvarในส่วนนั้นดังนั้นส่วนจะยืนอยู่คนเดียวและสามารถคัดลอกวางได้ มิฉะนั้นให้คัดลอกวางโค้ดสองสามบรรทัดไปยังฟังก์ชันใหม่ในระหว่างการปรับโครงสร้างใหม่โดยไม่ต้องแยกออกจากกันและย้ายส่วนที่เกี่ยวข้องvarและคุณได้ประสบอุบัติเหตุระดับโลก

โดยเฉพาะอย่างยิ่ง:

for (var i; i<100; i++)
    do something;

for (var i; i<100; i++)
    do something else;

Crockford จะแนะนำให้คุณลบอันที่สองvar(หรือลบทั้งสองอย่างvarและทำvar i;ข้างบน) และ jslint จะเข้ามาหาคุณในเรื่องนี้ แต่ IMO จะรักษาได้ทั้งสองvars เก็บรหัสที่เกี่ยวข้องทั้งหมดไว้ด้วยกันแทนที่จะมีบิตพิเศษที่ถูกลืมได้ง่ายที่ด้านบนของฟังก์ชัน

โดยส่วนตัวแล้วฉันมักจะประกาศว่าvarเป็นการกำหนดครั้งแรกของตัวแปรในส่วนที่เป็นอิสระของรหัสไม่ว่าจะมีการใช้งานที่แยกต่างหากของชื่อตัวแปรเดียวกันในส่วนอื่น ๆ ของฟังก์ชั่นเดียวกันหรือไม่ สำหรับฉันการประกาศvarทั้งหมดเป็นหูดที่ไม่พึงประสงค์ JS (มันจะดีกว่าที่จะมีตัวแปรเริ่มต้นเป็นท้องถิ่น); ฉันไม่เห็นว่าเป็นหน้าที่ของฉันที่จะทำซ้ำข้อ จำกัด ของ [การแก้ไขแบบเก่า] ANSI C ใน JavaScript เช่นกัน

(*: นอกเหนือจากในฟังก์ชั่นที่ซ้อนกัน)

ในทางทฤษฎีแล้วมันไม่ควรสร้างความแตกต่างใด ๆ กับ JavaScript เนื่องจากภาษาไม่มีขอบเขตบล็อก แต่เป็นเพียงขอบเขตหน้าที่เท่านั้น

ฉันไม่แน่ใจเกี่ยวกับข้อโต้แย้งด้านประสิทธิภาพ แต่Douglas Crockfordยังคงแนะนำว่าvarข้อความควรเป็นข้อความแรกในเนื้อหาของฟังก์ชัน การอ้างอิงจากCode Conventions สำหรับภาษาการเขียนโปรแกรม JavaScript :

JavaScript ไม่มีขอบเขตบล็อกดังนั้นการกำหนดตัวแปรในบล็อกอาจสร้างความสับสนให้โปรแกรมเมอร์ที่มีประสบการณ์กับภาษาตระกูล C อื่น ๆ กำหนดตัวแปรทั้งหมดที่ด้านบนของฟังก์ชั่น

ฉันคิดว่าเขามีประเด็นอย่างที่คุณเห็นในตัวอย่างต่อไปนี้ การประกาศตัวแปรที่ด้านบนของฟังก์ชั่นไม่ควรทำให้ผู้อ่านสับสนว่าคิดว่าตัวแปรi นั้นอยู่ในขอบเขตของforลูปบล็อค:

function myFunction() {
  var i;    // the scope of the variables is very clear

  for (i = 0; i < 10; i++) {
    // ...
  }
}

ECMA-/Javascriptภาษาhoistsตัวแปรใด ๆ ที่มีการประกาศใดก็ได้ไปด้านบนของฟังก์ชั่น นั่นเป็นเพราะภาษานี้ไม่ได้function scopeและไม่ได้มีblock scopeอื่น ๆ อีกหลาย C-เช่นภาษา ที่ยังเป็นที่รู้จักกัน
lexical scope

ถ้าคุณประกาศสิ่งที่ชอบ

var foo = function(){
    for(var i = 0; i < 10; i++){
    }
};

นี่hoistedคือ:

var foo = function(){
    var i;
    for(i = 0; i < 10; i++){
    }
}

ดังนั้นจึงไม่ได้สร้างความแตกต่างในการแสดง (แต่แก้ไขให้ถูกต้องถ้าฉันผิดทั้งหมด)
อาร์กิวเมนต์ที่ดีกว่ามากสำหรับการไม่ประกาศตัวแปรที่อื่นที่ด้านบนของฟังก์ชั่นคือการอ่านได้ ประกาศตัวแปรภายในfor-loopอาจนำไปสู่สมมติฐานผิดว่าตัวแปรนี้สามารถเข้าถึงได้เฉพาะภายในร่างกายของวงซึ่งเป็นผิดทั้งหมด Infact คุณสามารถเข้าถึงตัวแปรนั้นได้ทุกที่ภายในขอบเขตปัจจุบัน

ในปีหน้าเบราว์เซอร์ทั้งหมดจะมีเอ็นจิน JS ที่รวบรวมรหัสไว้ล่วงหน้าดังนั้นความแตกต่างของประสิทธิภาพ (ซึ่งมาจากการแยกวิเคราะห์รหัสบล็อกเดียวกันซ้ำแล้วซ้ำอีกรวมถึงการดำเนินการมอบหมาย) ควรจะไม่มีความสำคัญ

นอกจากนี้อย่าเพิ่มประสิทธิภาพการทำงานเว้นแต่คุณจะต้องทำ การเก็บรักษาตัวแปรใกล้กับสถานที่ที่คุณต้องการในครั้งแรกทำให้รหัสของคุณสะอาด ด้านลบคนที่คุ้นเคยกับภาษาที่มีขอบเขตบล็อกอาจสับสน

ข้อควรพิจารณาอีกประการหนึ่งตอนนี้เรามีletและconstใน ES2015 คือตอนนี้คุณสามารถกำหนดขอบเขตตัวแปรเฉพาะให้กับบล็อกลูปได้ ดังนั้นหากคุณไม่ต้องการตัวแปรเดียวกันนอกลูป (หรือถ้าการวนซ้ำแต่ละครั้งขึ้นอยู่กับการดำเนินการที่ทำกับตัวแปรนั้นในการทำซ้ำก่อนหน้า) ก็อาจจะดีกว่าที่จะทำสิ่งนี้:

for (let i = 0; i < 100; i++) {
    let value = somearray[i];
    //do something with `value`
}

ฉันเพิ่งจะทดสอบง่ายๆใน Chrome ลองเล่นซอในเบราว์เซอร์ของคุณและดูผลลัพธ์

  var count = 100000000;
    var a = 0;
    console.log(new Date());

    for (var i=0; i<count; i++) {
      a = a + 1
    }

    console.log(new Date());

    var j;
    for (j=0; j<count; j++) {
      a = a + 1;
    }

    console.log(new Date());

    var j;
    for (j=0; j<count; j++) {
        var x;
        x = x + 1;
    }

    console.log(new Date());

ผลลัพธ์คือการทดสอบครั้งสุดท้ายใช้เวลา ~ 8 วินาทีและ 2 ก่อนหน้านี้เพียง ~ 2 วินาที ทำซ้ำมากและไม่คำนึงถึงการสั่งซื้อ

ดังนั้นนี่เป็นข้อพิสูจน์สำหรับฉันว่าคนหนึ่งควรประกาศขวดด้านนอกของลูป กรณีที่อยากรู้อยากเห็นสำหรับฉันเป็นคนแรกที่ฉันประกาศiในคำสั่งสำหรับ () สิ่งนี้ดูเหมือนจะเร็วเท่ากับการทดสอบครั้งที่ 2 ที่ฉันประกาศดัชนีล่วงหน้า

JavaScript เป็นภาษาที่เขียนที่ด้านล่างโดย C หรือ C ++ ฉันไม่แน่ใจว่าเป็นภาษาใด และหนึ่งในวัตถุประสงค์ของมันคือการประหยัดการจัดการหน่วยความจำภายใน แม้แต่ใน C หรือ C ++ คุณไม่ต้องกังวลว่าจะใช้ทรัพยากรจำนวนมากหรือไม่เมื่อมีการประกาศตัวแปรภายในลูป ทำไมคุณควรกังวลใน JavaScript?

นั่นขึ้นอยู่กับสิ่งที่คุณพยายามที่จะบรรลุ ... หากvalueสมมติว่าเป็นเพียงตัวแปรชั่วคราวในการบล็อกแบบลูปคุณจะเห็นได้อย่างชัดเจนว่าใช้รูปแบบที่สอง นอกจากนี้ยังมีเหตุผลและ verbose มากขึ้น

มันไม่ได้สร้างความแตกต่างถ้าคุณประกาศตัวแปรภายในหรือภายนอกของลูป ด้านล่างเป็นตัวอย่างโค้ดที่จะทดสอบ

function a() {
   console.log('Function a() starts');
   console.log(new Date());
    var j;
    for (j=0; j<100000000; j++) {
        var x;
        x = x + 1;
    }
    console.log(new Date());
    console.log('Function a() Ends');
}
a()
function b() {
console.log('Function B() starts');
   console.log(new Date());
    var a;
    var j;
    for (j=0; j<100000000; j++) {
      a = a + 1;
    }
    console.log(new Date());
    console.log('Function B() Ends');
}
b()

ผลลัพธ์แสดงให้เห็นในกรณีของฉัน

Function a() starts
VM121:3 Thu Apr 12 2018 15:20:26 GMT+0530 (India Standard Time)
VM121:9 Thu Apr 12 2018 15:20:26 GMT+0530 (India Standard Time)
VM121:10 Function a() Ends
VM121:14 Function B() starts
VM121:15 Thu Apr 12 2018 15:20:26 GMT+0530 (India Standard Time)
VM121:21 Thu Apr 12 2018 15:20:26 GMT+0530 (India Standard Time)
VM121:22 Function B() Ends

ขอบคุณ - MyFavs.in

คำถามที่นี่เป็นพื้นประกาศวาภายในวง แค่คิดว่าจะเกิดอะไรขึ้นถ้าคุณทำสิ่งนี้:

var a = 30;
var a = 50;
var a = 60;

คุณคิดว่าถูกต้องหรือไม่ ไม่ ... เพราะคุณไม่ต้องการประกาศตัวแปรหลายครั้ง เมื่อคุณประกาศตัวแปรภายในลูปมันจะไม่ประกาศกี่ครั้งที่ลูปทำงาน เห็นได้ชัดว่ามันจะตบคุณเมื่อคุณอยู่ในโหมด 'ใช้เข้มงวด' ผู้คนไม่เห็นด้วยกับ Crockford โดยไม่คิดถึงคำถามต้นฉบับ

ดังนั้นจึงเป็นการดีที่จะประกาศตัวแปรด้านบน - 1 เพื่อให้อ่านได้ง่าย 2. สร้างนิสัยที่ดี

เกี่ยวกับประสิทธิภาพหลังจากรันการทดสอบบน Chrome, Firefox และ jsperf บนระบบปฏิบัติการ Linux ดูเหมือนว่าจะมีความแตกต่างระหว่างการประกาศตัวแปรในลูปและลูป มันเป็นความแตกต่างเล็ก ๆ น้อย ๆ แต่สิ่งนี้ยังรวมกับจำนวนการทำซ้ำและปริมาณของการประกาศตัวแปร

ดังนั้นเพื่อประสิทธิภาพที่ดีที่สุดฉันจะต้องแนะนำการประกาศตัวแปรนอกลูป หรือดีกว่ายังประกาศตัวแปรของคุณในบรรทัด ดูตัวอย่าง

// inline
for (var ai = 0, al = 100000000, av; ai < al; ai++) {
    av = av + 1;
}

// outside
var bv;
var bl = 100000000;
for (var bi = 0; bi < bl; bi++) {
    bv = bv + 1;
}

สังเกตว่าตัวแปร 'al' และ 'av' อยู่ในบรรทัดสำหรับการประกาศลูป การประกาศแบบอินไลน์นี้ทำให้ฉันมีประสิทธิภาพที่ดีขึ้นอย่างต่อเนื่อง แม้จะมีการประกาศตัวแปรนอกวง ความแตกต่างด้านประสิทธิภาพอีกครั้งมีขนาดเล็กมาก

https://jsperf.com/outside-inline-for-loop-ase/1