JavaScript พร้อมลงชื่อเข้าใช้ด้านหน้าของฟังก์ชันนิพจน์


866

ฉันกำลังมองหาข้อมูลเกี่ยวกับฟังก์ชั่นที่ถูกเรียกใช้ในทันทีและบางแห่งที่ฉันพบสัญกรณ์นี้:

+function(){console.log("Something.")}()

บางคนสามารถอธิบายให้ฉันฟังได้ว่าการ+ลงชื่อเข้าใช้ที่หน้าฟังก์ชันมีความหมายว่าอย่างไร


17
Ben Alman อธิบายทุกอย่างได้ที่นี่: mths.be/iife
Mathias Bynens

คำตอบ:


1320

มันบังคับให้ parser จัดการส่วนที่ตามหลัง+นิพจน์ โดยปกติจะใช้สำหรับฟังก์ชันที่เรียกใช้ทันทีเช่น:

+function() { console.log("Foo!"); }();

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

+เป็นเพียงหนึ่งในตัวเลือก นอกจากนี้ยังสามารถ-, !, ~หรือเพียงใดเกี่ยวกับผู้ประกอบการเอกภาคอื่น ๆ อีกวิธีหนึ่งคุณสามารถใช้วงเล็บ (นี่เป็นเรื่องธรรมดามากขึ้น แต่ไม่ถูกต้องมากขึ้นหรือน้อยลงในการสร้างประโยค)

(function() { console.log("Foo!"); })();
// or
(function() { console.log("Foo!"); }());

12
รายละเอียดเพิ่มเติมได้ที่นี่benalman.com/news/2010/11/…
Kundan Singh Chouhan

159
เราไม่สามารถพูดได้หรือไม่ว่า ฉันคุ้นเคยกับการให้บริการแบบ parens เพื่อรวมการแสดงออก มันไม่ชัดเจนเลยว่า + กำลังทำอะไรอยู่ในกรณีนี้ถ้าคุณยังไม่เคยรู้จักกับการเล่นโวหารนี้ของ js
คริส

1
หมายเหตุ: จากตัวเลือก parens สองตัวjsLint จะเลือกตัวเลือกที่สอง ฉันคิดว่าjsHintจุกจิกน้อยกว่า
บีทรูทบีทรูท

43
หนึ่งในห้องสมุดที่ใช้กันทั่วไปที่ใช้สัญลักษณ์ "บวก" คือBootstrap (ซึ่งเป็นวิธีที่ฉันลงเอยอ่านกระทู้นี้)
วิลล์

Bootstrap กำลังทำสิ่งนี้ btw: maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.js
xanderiel

94

บริษัท ย่อยของคำตอบของ @ TJCrowder +มักใช้ในการบังคับให้ใช้การคำนวณค่าตัวเลขตามคำตอบ SOนี้ ในกรณีนี้มันถูกเรียกว่า 'ผู้ประกอบการบวก unary' (เพื่อความสะดวกในการ googling)

var num = +variant;

ดังนั้นในด้านหน้าของฟังก์ชันมันสามารถเป็นวิธีบังคับให้ผลลัพธ์ของฟังก์ชันถูกตีความเป็นตัวเลข ฉันสงสัยว่ามันจะเกิดขึ้น แต่ในทางทฤษฎีแล้ว JIT สามารถใช้ฟังก์ชันนี้เพื่อรวบรวมฟังก์ชั่นเป็นตัวเลขเท่านั้นเป็นต้นอย่างไรก็ตามเพื่อป้องกัน unary plus และการต่อกันเมื่อใช้ในนิพจน์ขนาดใหญ่คุณจะต้องใช้วงเล็บ:

blah + (+(function(){ var scope; return "4"; })());

3
สิ่งนี้เคยได้รับ 37 upvotes อย่างไร (+function() { ... })()สัญกรณ์ไม่สามารถดำเนินการได้โดยไม่ต้องมีข้อผิดพลาด (นอกเหนือจากความจริงที่ว่านี้ไม่ตอบคำถาม)
whitequark

6
@whitequark: พลาดวงเล็บปีกกาหนึ่งรอบฟังก์ชัน + การโทร สงสัยว่า upvotes เพิ่มขึ้นเนื่องจากคำอธิบายการส่งหมายเลข
Phil H

10
ตกลงฉันอาจจะ nitpicking
whitequark

2
@Christoph ฉันอยากจะฝากไว้ที่นั่น ในความเป็นจริงฉันจะไปไกลเท่าที่จะเพิ่มพวกเขาหากพวกเขาหายไป มันทำให้ชัดเจนยิ่งขึ้นว่าเกิดอะไรขึ้นและป้องกันปัญหาเมื่อโค้ดถูกย่อขนาดเล็กสุดด้วยการลบช่องว่างซึ่งนำไปสู่3++function...สิ่งที่ไม่เหมือนกัน
Benjam

3
แม้ว่าในการสะท้อนเพิ่มเติมที่+function...ไม่จำเป็นในตัวเอง ผลลัพธ์เดียวกันสามารถมีblah + function( ){ ... }( );ซึ่งจะลบล้างความต้องการในการตัดวงเล็บ
Benjam

60

ดังนั้นคำตอบสั้น ๆ คือป้องกันข้อผิดพลาดทางไวยากรณ์โดยใช้ฟังก์ชั่นผลลัพธ์ไม่ทางใดก็ทางหนึ่ง

นอกจากนี้คุณยังสามารถสั่งให้เครื่องยนต์รู้ว่าคุณไม่สนใจค่าตอบแทนด้วยการใช้voidโอเปอเรเตอร์:

void function() { console.log("Foo!"); }();

แน่นอนว่าการใส่เครื่องมือจัดฟันไปรอบ ๆ สิ่งนั้นก็เพื่อจุดประสงค์นั้น


45
เป็นโมฆะหรือวงเล็บคืออย่างมากที่นิยม พวกเขาปราศจาก WTF การใช้ + เป็นความฉลาดที่ไม่ฉลาดนัก
Peter Wone

2
จุดที่ดี ดูเหมือนว่าการใช้ผู้ให้บริการรายใดรายหนึ่งจะไปเทียบกับมาตรฐานอุตสาหกรรมในปัจจุบัน บางทีอาจจะเป็น "เด็กเย็น" นักพัฒนาจะเลือกใช้มันมิฉะนั้นฉันยังคงไม่เห็นจุดของการใช้สิ่งที่มากกว่าการเป็นโมฆะหรือ (บริการ)
dudewad
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.