JavaScript에서 (function () {}) ()보다! function () {} ()의 장점은 무엇입니까?

JavaScript에서 (function () {}) ()보다! function () {} ()의 장점은 무엇입니까? [복제]

---

중복 가능성 :
기능 앞에 느낌표는 무엇을합니까?

저는 오랫동안 JavaScript에서 자체 실행되는 익명 함수에 다음을 사용했습니다.

(function () { /* magic happens */ })()

최근에 다음 패턴의 더 많은 인스턴스를보기 시작했습니다 (예 : Bootstrap ).

!function () { /* presumably the same magic happens */ }()

두 번째 패턴의 장점이 무엇인지 아는 사람이 있습니까? 아니면 그냥 문체 선호일까요?

---

이 두 가지 다른 기술은 기능적 차이 뿐만 아니라 모양도 다릅니다. 한 기술이 다른 기술에 비해 잠재적 인 이점은 이러한 차이 때문입니다.

간결

자바 스크립트는 페이지가로드 될 때 자바 스크립트가 다운로드 되기 때문에 간결성 이 매우 중요한 언어 입니다. 즉, 자바 스크립트가 간결할수록 다운로드 시간이 빨라집니다 . 이러한 이유로 다운로드 시간을 최적화하기 위해 Javascript 파일을 압축하는 Javascript minifier 와 obfuscator 가 있습니다. 예를 들면, 공간을 위해 최적화된다 .alert ( "Hi" ) ;alert("Hi");

이 점을 염두에두고이 두 패턴을 비교하세요.

• 일반 폐쇄 :   (function(){})() 16 자
• 폐쇄 거부 :!function(){}() 15 자

이것은 기껏해야 마이크로 최적화이므로 코드 골프 대회를 진행 하지 않는 한 이것이 특별히 설득력있는 주장이라고 생각하지 않습니다 .

반환 된 값 부정

a및 의 결과 값을 비교합니다 b.

var a = (function(){})()
var b = !function(){}()

때문에 a함수가 아무것도 반환하지 않는 a것입니다 undefined. 의 부정은 undefined이므로 true로 b평가됩니다 true. 이는 함수의 반환 된 값을 부정하거나 모든 것이 반드시 반환해야하는 null이 아닌 값 또는 정의되지 않은 값 페티쉬를 갖고 싶은 사람들에게 이점입니다. 이 다른 Stack Overflow 질문 에서 이것이 어떻게 작동하는지에 대한 설명을 볼 수 있습니다 .

일반적으로 안티 패턴 으로 간주되는이 함수 선언의 근거를 이해하는 데 도움이되기를 바랍니다 .

---

나는 항상 이와 같은 질문에 대해 Ben Alman의 IIFE 작품으로 돌아갑니다 . 내가 생각하는 한 결정적입니다.

기사 의 핵심은 다음과 같습니다 .

// Either of the following two patterns can be used to immediately invoke
// a function expression, utilizing the function's execution context to
// create "privacy."

(function(){ /* code */ }()); // Crockford recommends this one
(function(){ /* code */ })(); // But this one works just as well

// Because the point of the parens or coercing operators is to disambiguate
// between function expressions and function declarations, they can be
// omitted when the parser already expects an expression (but please see the
// "important note" below).

var i = function(){ return 10; }();
true && function(){ /* code */ }();
0, function(){ /* code */ }();

// If you don't care about the return value, or the possibility of making
// your code slightly harder to read, you can save a byte by just prefixing
// the function with a unary operator.

!function(){ /* code */ }();
~function(){ /* code */ }();
-function(){ /* code */ }();
+function(){ /* code */ }();

// Here's another variation, from @kuvos - I'm not sure of the performance
// implications, if any, of using the `new` keyword, but it works.
// http://twitter.com/kuvos/status/18209252090847232

new function(){ /* code */ }
new function(){ /* code */ }() // Only need parens if passing arguments

---

핵심은 기본적으로 파서가 함수를 함수 선언으로 해석하지 못하도록 유지하고 대신 익명의 함수 표현식으로 해석된다는 것입니다.

Using the parens to group the expression or using the ! to negate the return are both just techniques of changing the parsing. It's then immediately invoked by the following parens. Any and all of these forms are having the same net effect in that regard, assuming no explicit return value:

(function(){ /* ... */ })(); // Arguably most common form, => undefined
(function(){ /* ... */ }()); // Crockford-approved version, => undefined
!function(){ /* ... */ }();  // Negates the return, so => true
+function(){ /* ... */ }();  // Attempts numeric conversion of undefined, => NaN
~function(){ /* ... */ }();  // Bitwise NOT, => -1

If you're not capturing the returned value, there's no significant difference. One could argue that the ~ might be a faster op since it's just flipping bits, or maybe ! is a faster op since it's a true/false check and returning the negation.

At the end of the day though, the way most people are using this pattern is that they're trying to break off a new level of scope to keep things clean. Any and all work. The latter forms are popular because while they do introduce an additional (typically unnecessary) operation, saving every extra byte helps.

Ben Alman has a fantastic writeup on the topic: http://benalman.com/news/2010/11/immediately-invoked-function-expression/

---

The first "pattern" calls the anonymous function (and has the result of its return value) while the second calls the anonymous function and negates its result.

Is that what you're asking? They do not do the same thing.

---

It is almost only stylistic preference, except for the fact that ! provides a function return (i.e. returns true, which comes from !undefined).

Also, it's one fewer character.

---

Well in the first case you are using ( ) to wrap the object you want to execute with the next set of (), and in the next case you are using operator that takes one argument (negation operator !) and you are making it implicitly wrap its argument (funcion) with ( ) so you actually get !(function () { })(), execute the function, and negate the result it returns. This can also work with -, +, ~ in the same principle since all those operators take one argument.

!function () { /* presumably the same magic happens */ }()
-function () { /* presumably the same magic happens */ }()
+function () { /* presumably the same magic happens */ }()
~function () { /* presumably the same magic happens */ }()

Why would you want to do this? I guess it is a personal preference or if you have big .JS and want to save 1 char per anonymous function call... :D

참고URL : https://stackoverflow.com/questions/7586870/in-javascript-what-is-the-advantage-of-function-over-function