专栏首页前端与Java学习js中(function(){})()的写法用处

js中(function(){})()的写法用处

以前看到老师写js的单例模式时疑惑为什么要这么写

var singleton = (function () {
    var privateVariable;
    function privateFunction(x) {
        ...privateVariable...
    }
    return {
        firstMethod: function (a, b) {
            ...privateVariable...
        },
        secondMethod: function (c) {
            ...privateFunction()...
} };
}());

后来查了下资料,js中(function(){…})()立即执行函数写法理解,终于了解了。

来来来,首先嘛,JS中函数有两种命名方式

1、一种是声明式。

而声明式会导致函数提升,function会被解释器优先编译。即我们用声明式写函数,可以在任何区域声明,不会影响我们调用。

function XXX(){}1

2、一种是函数表达式

函数表达式我们经常使用,而函数表达式中的function则不会出现函数提升。而是JS解释器逐行解释,到了这一句才会解释。因此如果调用在函数表达式之前,则会调用失败。
fn1();
function fn1(){}//可以正常调用
fn2();
var fn2 = function(){}//无法调用

OK,下面进入正题,对函数表达式加上(),是可以直接调用的

但是如果是对声明式的后部加上()则是会被编译器忽略。

var fn2 = function(){}();//对,就是这样
function fn1(){}();//{}会被忽略

而平常的function(){}则是一种声明式,如果加上()括号后,则会被编译器认为是函数表达式,(加上+-号都可以),从而可以用()来直接调用

(function fn1(){})();

以上转自:https://blog.csdn.net/u010958922/article/details/47007589?depth_1-utm_source=distribute.pc_relevant.none-task&utm_source=distribute.pc_relevant.none-task


for (var i = 0; i < oLi.length; i++) {
    (function (m) {
 oLi[m].onmouseover = function () {
 console.log(m);
 oImg[indexBan].className = "";
 indexBan = m;
 oImg[indexBan].className = "banOn";
 onChange();
        }
    })(i)//回调函数
}

看上去(function(j){})(i)比较神奇,其实很简单,第一个括号定义了一个匿名函数,后一个括号是指调用了这个函数,并传入参数i。当然这个匿名函数接受一个参数,命名为j

原文链接:https://blog.csdn.net/u010958922/article/details/47007589?depth_1-utm_source=distribute.pc_relevant.none-task&utm_source=distribute.pc_relevant.none-task

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 前端day20-JS高级(递归和闭包)学习笔记

    帅的一麻皮
  • 前端day15-JS(WebApi)学习笔记(三大家族、事件对象、getComputedStyle)

    offsetWidth、offsetHeight、offsetParent、offsetLeft、offsetTop

    帅的一麻皮
  • 前端day16-JS(WebApi)学习笔记(事件补充、事件冒泡与捕获)

    var code = e.keyCode || e.charCode || e.which;

    帅的一麻皮
  • JavaScript立即调用的函数表达式

    主要参考知乎上这个问题:javascript 匿名函数有哪几种执行方式 长天之云的回答。

    meteoric
  • 性能优化三部曲之三——Node直出让你的网页秒开

    项目: 手Q群成员分布直出 原因: 为家校群业务直出做准备 群成员分布业务是小型业务,而且逻辑相当简单,方便做直出试验田 基本概念: 直出其实并不算是新概念。只...

    李成熙heyli
  • phpcms v9 常用函数

    常用函数 , 打开include/global.func.php,下面存放一些公共函数 view plaincopy to clipboardprint? fu...

    joshua317
  • 页面点击特效源码解析

    这次给大家分享一个被广泛应用在个人网站中的骚骚的效果,就是鼠标左键点击出现小心心,来看下效果 :

    石璞东
  • webpack2 的 tree-shaking 好用吗?

    代码压缩的现状 下面是一个使用 react 的业务的代码依赖,但是实际上业务代码中并没有对依赖图中标识的模块,也就是说构建工具将不需要的代码打包到了最终的代码当...

    IMWeb前端团队
  • python 中面向切面编程AOP和装饰器

    简言之、这种在运行时,编译时,类和方法加载时,动态地将代码切入到类的指定方法、指定位置上的编程思想就是面向切面的编程。

    用户7625070
  • lodash源码解读之模块化的基础——IIFE

    IIFE包含两部分。 第一部分是一个匿名函数,它包裹在分组操作符()中,拥有独立的词法作用域。 第二部分是再一次使用分组操作符(),创建一个立即执行函数表达式。...

    我是leon

扫码关注云+社区

领取腾讯云代金券