การกำหนดตัวแปรทั่วโลกของ Javascript ใหม่หรือไม่

ฉันมีคำถามเกี่ยวกับขอบเขตตัวแปรใน Javascript ฉันมีชุดสคริปต์บนหน้าเว็บที่โหลดในเวลาต่างกัน ฉันต้องการวัตถุส่วนกลางที่เรียกว่า MyVar เพื่อให้ทุกคนสามารถเข้าถึงได้ ฉันต้องการหลีกเลี่ยงการกำหนดใหม่ แต่ฉันเดาว่าสคริปต์แรกจะต้องกำหนดไว้ ณ จุดใดจุดหนึ่ง คำถามของฉันคือใช้ var MyVar = MyVar || {} วิธีแก้ปัญหาใช่ไหม

ขอบคุณ

 /**
 * Script 1
 */


var MyVar = MyVar || {};
MyVar.config = {
    x : 2,
    y : 3
};


/**
* Script 2
*/

//is this correct?
var MyVar = MyVar || {};
//to which MyVar am I assigning the apple property?
MyVar.apple = 'red';

อัปเดต

คำตอบที่ยอดเยี่ยมจนถึงตอนนี้ขอบคุณ

ส่วนสุดท้าย คำสั่ง var ที่สองทำอะไรเมื่อฉันทำซ้ำ var MyVar = MyVar || {}; เป็นครั้งที่สอง เป็นการสร้าง var ใหม่ในขอบเขตส่วนกลางที่เรียกว่า MyVar ซึ่งได้รับการกำหนดค่าของ MyVar ที่มีอยู่หรือไม่

ผู้โพสต์อื่นๆ มีสิทธิ์ที่จะถือว่าฉันมีสคริปต์เหล่านี้โหลดพร้อมกันในแท็ก <script> แต่เนื่องจากการแบ่งงาน ฉันสร้างสคริปต์จึงไม่สามารถควบคุมเวลาและวิธีโหลดสคริปต์ได้ ดังนั้นจึงต้องมีวิธีการที่ไม่ซับซ้อนเพื่อสร้าง/ใช้งานวัตถุ MyVar ของฉัน .

ขอบคุณ


javascript variables global-variables scope
person JackMahoney    schedule 10.01.2013    source แหล่งที่มา
comment
ลองดูคำถามนี้เกี่ยวกับแนวทางปฏิบัติที่ดีที่สุดเมื่อต้องรับมือกับตัวแปรร่วม   -  person sinelaw    schedule 11.01.2013
comment
ใช่ รหัสของคุณจะใช้งานได้ ใช่ คุณควรหลีกเลี่ยงโกลบอลทุกครั้งที่เป็นไปได้   -  person wless1    schedule 11.01.2013
comment
อ่าน var MyVar = MyVar || {}; เป็น var MyVar = MyVar if it exists (and isn't equal to false or 0) , or a new object if it doesn't   -  person ic3b3rg    schedule 11.01.2013

คำตอบ (4)


arrow_upward
2
arrow_downward

ฉันมีชุดสคริปต์บนหน้าเว็บที่โหลดในเวลาต่างกัน

มีอันใดที่โหลดแบบอะซิงโครนัสหรือไม่? หากเป็นเพียงชุดของแท็ก <script> แท็กเหล่านั้นจะถูกโหลดพร้อมกันตามลำดับ

MyVar ใดที่ฉันกำลังกำหนดทรัพย์สินของ Apple ให้กับ MyVar

หากคุณประกาศ MyVar ในขอบเขตส่วนกลางทุกครั้ง จะมีเพียง MyVar เพียงอันเดียว คุณสมบัติ apple จะถูกสร้างขึ้นบนตัวแปรที่มีอยู่ หากมี หรือในวัตถุว่างที่สร้างด้วย var MyVar = MyVar || {}; หากไม่มี

บรรทัดล่าง: หลังจาก var MyVar = MyVar || {}; แรก การประกาศต่อไปนี้จะถูกละเว้น และคุณสมบัติใหม่จะถูกผนวกเข้ากับตัวแปรที่มีอยู่ เพียงระวังอย่าเขียนทับคุณสมบัติที่มีอยู่

person bfavaretto    schedule 11.01.2013
comment
นี่เป็นคำอธิบายที่ดี ส่วนสุดท้าย คำสั่ง var ที่สองทำอะไรเมื่อฉันทำซ้ำ var MyVar = MyVar || {}; เป็นครั้งที่สอง เป็นการสร้าง var ใหม่ในขอบเขตส่วนกลางที่เรียกว่า MyVar ซึ่งได้รับการกำหนดค่าของ MyVar ที่มีอยู่หรือไม่ - person JackMahoney; 11.01.2013
comment
มันจะทำ MyVar = MyVar (ซึ่งโดยพื้นฐานแล้วไม่ได้ทำอะไรเลย) - person bfavaretto; 11.01.2013
comment
@JackMahoney - เพื่อชี้แจงเฉพาะคำจำกัดความ var แรกสำหรับชื่อตัวแปรเฉพาะเท่านั้นที่จะกำหนดตัวแปรนั้น คำสั่ง var ที่ตามมาสำหรับชื่อตัวแปรเดียวกันจะไม่ทำอะไรเลย โดยเฉพาะ ไม่ สร้างตัวแปรใหม่ที่มีชื่อเดียวกัน - person David R Tribble; 10.11.2016

arrow_upward
2
arrow_downward

รหัสของคุณถูกต้องและอาจทำงานได้ตามที่คาดไว้ แต่โปรดคำนึงถึงขอบเขตที่ MyVar ถูกสร้างขึ้น สมมติว่าไฟล์ของคุณเป็นไปตามที่โพสต์ ไฟล์เหล่านั้นจะสร้าง MyVar ภายในขอบเขต window (สมมติว่ามีบริบทของเบราว์เซอร์) หากหนึ่งในนั้นถูกรวมไว้ในฟังก์ชันที่ไม่ระบุตัวตน เช่นเดียวกับวิธีปฏิบัติทั่วไปกับ รูปแบบโมดูล, MyVar จะถูกสร้างขึ้นภายในขอบเขตของฟังก์ชันนั้นเท่านั้น:

(function() {
    var MyVar = MyVar || {};
    // If MyVar doesn't already exist in the global context,
    // the current MyVar reference will only be scoped to this function.
})();

รูปแบบที่ดีกว่าที่จะใช้คือ:

var MyVar = window.MyVar || (window.MyVar = {});

ซึ่งจะทำให้มั่นใจได้ว่าข้อมูลดังกล่าวจะถูกสร้างขึ้นและอ้างอิงจากขอบเขตทั่วโลกเสมอ คุณสามารถส่งผ่านบริบทเพื่อทำให้การปรับโครงสร้างใหม่ในอนาคตง่ายขึ้น:

(function(context) {
    var MyVar = context.MyVar || (context.MyVar = {}));
})(window);
person roryf    schedule 10.01.2013
comment
ขอบคุณ. ดังนั้นใน var MyVar = window.MyVar คือ MyVar การอ้างอิงถึง window.MyVar หรือเป็นการกำหนดค่า? - person JackMahoney; 11.01.2013
comment
หากมี window.MyVar อยู่แล้ว ตัวแปร MyVar ในเครื่องของคุณจะเป็นการอ้างอิงถึงตัวแปรนั้น หากไม่มีอยู่ ส่วนที่สอง || (window.MyVar = {}) จะสร้างออบเจ็กต์ใหม่ กำหนดให้กับ window.MyVar และส่งคืนข้อมูลอ้างอิงที่จะกำหนดให้กับตัวแปร MyVar ในเครื่อง - person roryf; 11.01.2013

arrow_upward
1
arrow_downward

ทดสอบได้ง่าย:

var MyVar = MyVar || {};
MyVar.config = {
    x : 2,
    y : 3
};

console.log(MyVar);

var MyVar = MyVar || {};
MyVar.apple = 'red';

console.log(MyVar);
person ic3b3rg    schedule 10.01.2013
comment
จะเกิดอะไรขึ้นหากลำดับของสคริปต์ที่อ้างอิงถึงมีการเปลี่ยนแปลง? ตัวอย่างของคุณไม่ใช่โปรแกรมป้องกันที่ดี - person roryf; 11.01.2013
comment
ฉันอ่านมันเป็นสคริปต์ระดับหน้าต่างแยกกันสองตัว ฉันคิดว่าพวกเขาสามารถเรียงลำดับใหม่ภายใน html ได้ แต่ฉันคิดว่านั่นเกินกว่าคำถามของแจ็ค - person ic3b3rg; 11.01.2013
comment
@ ic3b3rg คุณพูดถูกแล้ว มันเป็นสองสคริปต์ที่แยกจากกัน และฉันไม่รู้ว่าพวกเขาจะเรียงลำดับอะไร - person JackMahoney; 11.01.2013
comment
ในกรณีนั้น คำแนะนำของ @roryf จะดีกว่า แม้ว่าคุณอาจพบว่าคำแนะนำของฉันในการทดสอบด้วย console.log มีประโยชน์ก็ตาม - person ic3b3rg; 11.01.2013

arrow_upward
0
arrow_downward

นี่คือวิธีที่ฉันทำ:

window.myVar||(window.myVar={});

วิธีนี้จะทำให้คุณไม่ต้องประกาศตัวแปรซ้ำหากมีอยู่แล้ว

person Christophe    schedule 11.01.2013