javascript 自执行匿名函数

1、函数声明和函数表达式

1 function func(){ //函数声明
2             ...
3  }

函数表达式又分为两种

第一种是命名函数表达式

1 var func = function box(){
2             ...
3 }

注意：上述表达式，func可以在全局范围内找到，而box只能再函数体内使用

第二种是匿名函数表达式

1 var func = function (){ //把一个匿名函数赋值给一个变量
2             ...
3         }

2、自执行的匿名函数

在全局作用域内定义的所有东西，在任何地方都能找到

1 var func = function(){
2         console.log('Hello world!')
3 }
4 func()    //Hello world!

为了不让自己的变量和函数暴露在全局作用域中，我们可以封装在函数内部

1 var func = function(){
2         var greeting = 'Hello world!'
3 }
4 console.log(greeting)   //Uncaught ReferenceError: greeting is not defined

上面是显示的调用，更简洁的写法就是像下面这样

1 (function(){
2     var greeting = 'Hello world!'
3 }())
4 console.log( greeting ) //Uncaught ReferenceError: greeting is not defined

这就是自执行匿名函数,向自执行的匿名函数传递参数

1 (function(myVar){
2     alert(myVar)
3 }("Hello world")) //Hello world

例子1：

 1 var person = (function(){
 2     var name = 'Nelsen',
 3           age = 30;
 4     return {
 5         name : name + '-' + age,
 6         age : age
 7             }
 8 })()
 9 person.age = 60;
10 console.log( person.age )
11 console.log( person.name ) //Nelsen-30
12 console.log( person.age )     //30
13 console.log( person.name ) //Nelsen-30

此例中，匿名函数返回了一个对象，此对象有两个属性！当我们要重新设置内部属性时，无法覆盖

 1     var person = (function(){
 2             var name = 'Nelsen',
 3             age = 30;
 4             return {
 5                 name : function(){
 6                     return name + '-' + age;
 7                 },
 8                 setAge : function( newAge ){
 9                     age = newAge;
10                 }
11
12             }
13         })()
14         console.log( person.name() ) //Nelsen-30
15         person.setAge(80);     //30
16         console.log( person.name() ) //Nelsen-80

像上例这样改写就能更新了

例子2：

1     var person = (function(){
2             var name = 'Nelsen';
3             return { name : name } //将变量保存为对象上名字相同的属性,然后由模块模式返回该对象
4         })()
5     console.log(person.name)  //Nelsen

闭包是阻止垃圾回收器将变量从内存中移除的方法，使得在创建变量的执行环境外面能访问到该变量

1     var person = (function(){
2             var name = 'Nelsen222';
3             return { name : function(){
4                 return name
5             } }
6      })()
7     console.log(person.name())  //Nelsen

3、对象中的this，this指向当前的对象

1 var person = {
2             name : 'Nelsen',
3             getName : function(){
4                 console.log( this.name )
5             }
6         }
7 person.getName()  //Nelsen

此时的this指向全局window,找不到name值

1 var person = {
2      name : 'Nelsen',
3      getName : function(){
4           return function(){
5               console.log( this.name )
6                 }
7             }
8  }
9 person.getName()() //无法打印

稍加矫正

 1 var person = {
 2             name : 'Nelsen',
 3             getName : function(){
 4                 var that = this;
 5                 return function(){
 6                     console.log( that.name )
 7                 }
 8             }
 9         }
10 person.getName()() //Nelsen

转载于:https://www.cnblogs.com/Nelsen8/p/7081410.html

javascript 自执行匿名函数相关推荐

JavaScript自执行匿名函数
格式: (function(){ //代码 })(); 解释:这是相当优雅的代码(如果你首次看见可能会一头雾水:)),包围函数(function(){} ...
java调用js匿名函数参数,JavaScript匿名函数、自执行匿名函数
1. 函数也是一种类型要理解匿名函数,首先需要理解函数也是一种类型. 所以函数可以赋值给变量,如下: // 将数字类型值赋给变量 var num = 1; // 将函数类型值赋给变量 var hel ...
自执行匿名函数剖析整理
格式: (function(){ //代码 })(); 解释:这是相当优雅的代码(如果你首次看见可能会一头雾水:)),包围函数(function(){} ...
好程序员前端教程之JavaScript闭包和匿名函数的关系详解...
好程序员前端教程之JavaScript闭包和匿名函数的关系详解本文讲的是关于JavaScript闭包和匿名函数两者之间的关系,从匿名函数概念到立即执行函数,最后到闭包.下面一起来看看文章分析,希望你 ...
javaScript中的匿名函数
js中的匿名函数 js匿名函数 js中匿名函数的N种写法直接上代码和截图 <!DOCTYPE html> <html> <head> <meta chars ...
js之删除对象中的属性——delete、es6解构赋值、自执行匿名函数
js之删除对象中的属性--delete.es6解构赋值.自执行匿名函数实例 const person = {name: '李世民',gender: 'male',age: 24 };// 删除目标对 ...
Javascript中的自执行匿名函数
格式: (function(){ //代码 })(); 解释:这是相当优雅的代码(如果你首次看见可能会一头雾水:)),包围函数(function(){})的第一对括号向脚本返回未命名的函数,随后一对空 ...
Javascript进阶：匿名函数详解
匿名函数:意如其名,就是没有名字的函数. function (arg1,arg2){..... } 匿名函数的普遍用法: 1.赋值给变量: var func=function(arg1,arg2){. ...
JavaScript中的匿名函数及函数的闭包
1.匿名函数函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式第一种: ...

javascript 自执行匿名函数

javascript 自执行匿名函数相关推荐

最新文章

热门文章