JS一次性函数 匿名函数的理解

本文详细介绍了JavaScript中的立即执行函数(IIFE)的多种写法及其作用,包括如何利用IIFE实现局部变量到全局变量的转换以及创建私有命名空间。此外,还讨论了IIFE在避免全局变量污染、提升代码组织效率等方面的优势,并给出了实际示例,如在jQuery中使用IIFE的案例。
摘要由CSDN通过智能技术生成

一,
例如:

(function (){
console.log(“函数”);
})();

推理过程:
function fn1(){
console.log(“函数”);
};

// 调用函数
fn1();

let a = function fn1() {
console.log(“函数”);
};

//   调用函数
// fn1();
log(a)

// fn1时函数名,它包含函数的代码,函数的代码就是“function(){console.log(“函数”);}”,用括号包裹,替换fn1,得:

(function (){
console.log(“函数”);
})();

此函数是一次性函数,申明的同时就调用了,页面加载完后函数就执行完了

(function (形参){
console.log(“函数”);
})(实参);

那么,再引申一个例子:实现局部变量到全局变量的转换

(function (win){
var num=123;
win.numk=num
})(window);
console.log(“numk”); //全写就是console.log(“window.numk”);

局部变量将值赋给window。

window是对象,所以不能写win=num,再log(win),需要采用添加属性的方式


1、局部变量 变 全局:自调用函数将实参设置为window就可以外部访问局部变量了,调用时省略(window.num)直接num
在这里插入图片描述

2、将要使用的方法写入自调用函数中,使外部访问时更加方便

(function(window){
//產生隨機數的構造函數
function Random(){
}
//在原型對象中添加方法
Random.prototype.num=function(min,max){
return Math.floor(Math.random()*max+(max-min));
}
//把Random對象暴露給頂級對象window—》外部可以直接使用這個對象
window.Random=Random;
})(window);
var t1=new Random();
document.write(t1.num(0,5));
————————————————

三,最喜欢的
js立即执行函数用法
js立即执行函数可以让你的函数在创建后立即执行,js立即执行函数模式是一种语法,可以让你的函数在定义后立即被执行,这种模式本质上就是函数表达式(命名的或者匿名的),在创建后立即执行。

一、JS立即执行函数的写法

方式1、最前最后加括号

(function(){alert(1);}());
方式2、function外面加括号

(function(){alert(1);})();
方式3、function前面加运算符,常见的是!与void

!function(){alert(1);}();
void function(){alert(2);}();
二、立即执行函数的参数

可以给立即执行函数传递参数,例如

(function(who, when) {
    console.log("I met " + who + " on " + when);
} (“Joe Black”, new Date()));
记住:

1、立即函数内部是可以访问外部变量的,所以很多情况下,我们并不需要传参数。如:jQuery的window实参,如果不传入。内部也是可以直接使用的。

2、通常你不应该给立即执行函数传递太多的函数,因为它很快会成为一个负担——为了理解代码是如何工作的,你不得不经常上下滚动源代码。


在这里插入图片描述
从图中可以看出,除了使用()运算符之外,!,+,-,=等运算符都能起到立即执行的作用。这些运算符的作用就是将匿名函数或函数声明转换为函数表达式,如下图所示,函数体是函数声明的形式,使用运算符将其转换为函数表达式之后就可达到立即执行效果

2.使用立即执行函数的好处

通过定义一个匿名函数,创建了一个新的函数作用域,相当于创建了一个“私有”的命名空间,该命名空间的变量和方法,不会破坏污染全局的命名空间。此时若是想访问全局对象,将全局对象以参数形式传进去即可,如jQuery代码结构:
在这里插入图片描述
其中window即是全局对象。给其传入参数这样的好处是,可以缩短查询时的作用域链。作用域隔离非常重要,是一个JS框架必须支持的功能,jQuery被应用在成千上万的JavaScript程序中,必须确保jQuery创建的变量不能和导入他的程序所使用的变量发生冲突。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值