แบบแผนการตั้งชื่อ JavaScript [ปิด]


257

ฉันรู้ว่ามีข้อโต้แย้งมากมาย (อาจไม่ใช่ข้อโต้แย้ง แต่อย่างน้อยก็มีข้อโต้แย้ง) เกี่ยวกับแบบแผนการตั้งชื่อที่ดีที่สุดสำหรับ JavaScript

คุณตั้งชื่อตัวแปรฟังก์ชันวัตถุและสิ่งนั้นได้อย่างไร

ฉันจะทิ้งความคิดของฉันเองเกี่ยวกับเรื่องนี้เนื่องจากฉันไม่ได้ทำ JS มานาน (สองสามปีเท่านั้น) และฉันเพิ่งได้รับคำขอให้สร้างเอกสารที่มีแบบแผนการตั้งชื่อเพื่อใช้ในโครงการที่ทำงานของเรา . ดังนั้นฉันจึงได้ดู (google-ing) รอบ ๆ และมีความคิดเห็นที่แตกต่างกันมากมาย

หนังสือที่ฉันอ่านใน JS ใช้วิธีการตั้งชื่อต่าง ๆ ด้วยตัวเอง แต่พวกเขาก็เห็นด้วยเล็กน้อย:“ ค้นหาสิ่งที่เหมาะกับคุณและยึดมันไว้” แต่ตอนนี้ฉันได้อ่านหนังสือมากมายฉันพบว่าฉันชอบวิธีอื่นดีกว่าที่ฉันคุ้นเคย


คู่มือล่าสุดเกี่ยวกับสามัญสำนึกการตั้งชื่อใน JS: robinwieruch.de/javascript-naming-conventions
Robin Wieruch

คำตอบ:


202

ฉันทำตามข้อกำหนดของDouglas Crockfordสำหรับจาวาสคริปต์ ฉันยังใช้เครื่องมือJSLintของเขาเพื่อตรวจสอบการปฏิบัติตามอนุสัญญาเหล่านั้น


30
JSLint อาจรุนแรงเกินไปและเข้มงวดเกินไปสำหรับนักพัฒนาจำนวนมากดังนั้นJSHintจึงเป็นตัวเลือกที่ดีกว่า
Pavel Hodek

7
Crockford ไม่ได้ลงรายละเอียดในระดับนี้ แต่สิ่งที่เกี่ยวกับตัวแปรที่เริ่มต้นด้วยอักษรตัวใหญ่เพราะพวกเขาอ้างถึงตัวย่อ - อักษรตัวแรกควรหรืออักษรย่อทั้งหมดจะลดลง? ตัวอย่าง: ECBhandlevs. ecbHandle( ไม่สำคัญว่า ECB หมายถึงอะไร)
Dan Dascalescu

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

2
ฉันคิดว่าเขาทำได้ดีกับลิงค์ หากคุณเป็นกังวลคุณควรแก้ไขโพสต์
nckbrz

4
ฉันเงยหน้าขึ้นมอง Crockford จริง ๆ แต่รหัสของเขาดูเหมือนล้าสมัยมาก ฉันอยากจะแนะนำให้ดูที่ @PavelHodek คำตอบเพิ่มเติมลงรายการ
Per Hornshøj-Schierbeck

160

ขณะที่เจฟฟ์พูดสิ่งที่คร็อคฟอร์ดพูดนั้นดี

ข้อยกเว้นเดียวที่ฉันติดตาม (และเคยเห็นใช้กันอย่างแพร่หลาย) คือการใช้ $ varname เพื่อระบุวัตถุ jQuery (หรือไลบรารีใด ๆ ) เช่น

var footer = document.getElementById('footer');

var $footer = $('#footer');


7
ฉันใช้ $ สำหรับสิ่งนี้เช่นกัน ฉันมักจะเห็นคนใช้ $ เพื่อระบุสำเนาแคชของวัตถุ ฉันมักจะคิดว่ามันเล่นคำ แคช> "เงินสด"> $
Shawn Whinnery

1
นี่อาจไม่ใช่ความคิดที่ดีที่สุดถ้าคุณใช้ AngularJS - บริการหลักจะขึ้นต้นด้วย '$'
Filip Sobczak

2
ฉันไม่แนะนำให้ใช้อักขระพิเศษในชื่อตัวแปร กรอบการทำงานจำนวนมากใช้ $ โดยเฉพาะ
nckbrz

1
@nixxbb ไม่เป็นไรถ้าคุณวางขอบเขตตัวแปรอย่างถูกต้องซึ่งเฟรมเวิร์กที่เหมาะสมก็เช่นกัน
Andre Figueiredo

1
ฉันเห็นกิลเดลีนของ Crockford กล่าวถึง "อย่าใช้ _ underbar เป็นอักขระตัวแรกหรือตัวสุดท้ายของชื่อบางครั้งมันตั้งใจจะระบุความเป็นส่วนตัว" ฉันใช้อันเดอร์บาร์เป็นการส่วนตัวเพื่อระบุสมาชิกส่วนตัว นี่คือการปฏิบัติที่ไม่ดีหรือไม่? มีทางเลือกอื่นหรือไม่?
Ian G

112

คุณสามารถติดตามสิ่งนี้ คู่มือสไตล์ของ Google JavaScript

โดยทั่วไปให้ใช้ functionNamesLikeThis, variableNamesLikeThis, ClassNamesLikeThis, EnumNamesLikeThis, methodNamesLikeThis และ SYMBOLIC_CONSTANTS_LIKE_THIS

แก้ไข: ดูคอลเลกชันที่ดีของJavaScript สไตล์คู่มือและ Beautifiers


15
ฉันไม่แน่ใจว่าฉันเห็นด้วยอย่างเต็มที่หรือไม่เมื่อพิจารณาว่าพวกเขาพัฒนา Dart และ GWT (ส่วนขยายของโครเมียม javascript api นั้นก็เหมือนจาวามากเช่นกัน) สำหรับบางทีมใน Google วิธีที่ดีที่สุดในการพัฒนาจาวาสคริปต์อาจเป็นการเขียนด้วยภาษาอื่น
badunk

2
ฉันมักจะพบการตั้งชื่อส่วนตัวของ Google คี่แทนการ_fooBarที่พวกเขาทำfooBar_- ไมโครซอฟท์ได้รับมันขวา: asp.net/ajaxlibrary/act_contribute_codingStandards.ashx
แดเนียล Sokolowski

3
@DanielSokolowski จะเกิดอะไรขึ้นเมื่อใช้ Intellisense หากคุณนำหน้าตัวแปรจำนวนมากด้วยการขีดเส้นใต้นั่นเป็นเพียงอักขระอีกตัวที่คุณต้องพิมพ์ทุกครั้งที่คุณเข้าถึงตัวแปรเหล่านั้น ในตอนท้ายรายการ Intellisense ของคุณจะดูสะอาดตาและเร็วขึ้นเล็กน้อยเพื่อค้นหาสิ่งที่คุณต้องการ
FreeAsInBeer

@ FreeAsInBeer จริงเกี่ยวกับตัวละครพิเศษ แต่ฉันไม่คิดว่ามันเร็วขึ้น การพิมพ์_เมื่ออ้างอิง vars ส่วนตัวจะส่งผลให้เกิด intellisense ทันทีที่ จำกัด ผลลัพธ์ ในที่สุดคิดว่ามันเป็นความชอบส่วนตัว
Daniel Sokolowski

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

9

หนึ่งการประชุมที่ฉันต้องการลองคือการตั้งชื่อโมดูลสแตติกด้วยคำนำหน้า 'the' ลองดู. เมื่อฉันใช้โมดูลของคนอื่นมันไม่ง่ายเลยที่จะดูว่าฉันควรจะใช้มันอย่างไร เช่น:

define(['Lightbox'],function(Lightbox) {
  var myLightbox = new Lightbox() // not sure whether this is a constructor (non-static) or not
  myLightbox.show('hello')
})

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

define(['theLightbox'],function(theLightbox) {
  theLightbox.show('hello') // since I recognize the 'the' convention, I know it's static
})

6

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

ต้องบอกว่าฉันคิดว่าห้องสมุดส่วนใหญ่มักจะติดตาม CamelCase ของ Java อย่างง่าย ฉันพบว่าคำแนะนำของ Douglas Crockfordมีรสนิยมเพียงพอสำหรับฉัน


2

นั่นเป็นคำถามส่วนตัวที่อาจขึ้นอยู่กับว่าคุณทำงานอย่างไร บางคนชอบใส่ประเภทตัวแปรที่จุดเริ่มต้นของตัวแปรเช่น "str_message" และบางคนชอบใช้ขีดเส้นใต้ระหว่างคำของพวกเขา ("my_message") ในขณะที่คนอื่น ๆ ชอบที่จะแยกพวกเขาด้วยตัวอักษรตัวพิมพ์ใหญ่ ("myMessage")

ฉันมักจะทำงานกับห้องสมุด JavaScript ขนาดใหญ่ที่มีคนอื่นดังนั้นฟังก์ชั่นและตัวแปร (ยกเว้นตัวแปรส่วนตัวภายในฟังก์ชั่น) จะต้องเริ่มต้นด้วยชื่อของบริการเพื่อหลีกเลี่ยงความขัดแย้งในฐานะ "guestbook_message"

กล่าวโดยย่อ: ชื่อตัวแปรและฟังก์ชั่นภาษาอังกฤษที่ต่ำกว่าการจัดเรียงที่ดีเป็นสิ่งที่ดีกว่า ชื่อควรอธิบายการมีอยู่ของพวกเขามากกว่าที่จะสั้น


2
"เพื่อฟังก์ชั่นและตัวแปร (ยกเว้นตัวแปรส่วนตัวภายในฟังก์ชั่น) มีการเริ่มต้นที่มีชื่อของบริการเพื่อให้เกิดความขัดแย้งหลีกเลี่ยง" คำสั่งนี้เป็นที่ไม่ถูกต้อง คุณสามารถมีฟังก์ชั่น "namespaced" และวัตถุที่ไม่ตกอย่างถูกต้องผ่านกรอบงานจาวาสคริปต์หลายรายการ มีการนำเสนอที่ดีมากเกี่ยวกับวิธีการบรรลุเป้าหมายจาก MIX11 channel9.msdn.com/Events/MIX/MIX11/OPN08
Chris Marisic
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.