[js][填坑] 函数表达式
#
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title></title> 7 </head> 8 9 <body> 10 <script> 11 //console.log(a);//error,还未创建该变量 12 //console.log(b);//error 13 console.log(c); //打印出该方法 14 console.log(c()); //打印出return 的值,同时执行了一次 15 c(); //c 可以直接执行 16 //console.log(c.name); //error,实例化后才可访问 17 var cc = new c(); //实例化,同时执行了一次 18 //var cc = new c;//一个效果 19 console.log(cc.name); 20 var a = (function() { 21 //this.name = 'aa'; //error a.name访问不到,相当于赋值了一个全局变量 name,这里的this相当于window 22 console.log('a'); 23 return 'A'; 24 })(); 25 (function b() { 26 console.log('b'); 27 return 'B'; 28 })(); //直接执行,但这么写是不对的 29 (function() { 30 console.log('anonymous'); 31 })(); //直接执行,但只是执行了该匿名函数 32 function c() { 33 this.name = 'ccc'; 34 console.log('c'); 35 }; 36 var d = (function() { 37 console.log('d'); 38 //return this.name = 'dd';//相当于赋值了一个全局变量 name,这里的this相当于window 39 //return name = 'dd';//相当于赋值了一个全局(window)变量 name 40 return { 41 name: 'dd' 42 }; 43 })(); 44 var e = function() { 45 console.log('e'); 46 this.name = 'eee';//这里的this指向的是该函数,如果使用了return{},this指向window 47 }; 48 console.warn(a); 49 //console.log(a());//error,本质是变量 50 //var aa = new a();//error 51 //var aa = new a;//error 不能也不需要实例化 52 //a();//error 不可以直接执行 53 console.log(name); //变量name 54 console.log(d.name); 55 console.warn(e); //打印出该方法 56 console.log(e()); //打印出return 的值,同时执行了一次 57 e(); 58 //console.log(e.name); //error,实例化后才可访问 59 var ee = new e(); //实例化,同时执行了一次 60 //var ee = new e;//等价 61 console.log(ee.name); 62 </script> 63 </body> 64 65 </html>
总结 :
function x(){}称之为函数声明
var x = function(){} 称之为函数表达式,也就是匿名函数
(function(){})() 立即调用的函数表达式 (IIFE)
function x(){}与var x = function(){}的区别在于var x = function(){} 需要在使用前创建,
他们使用对象都需要实例化。
function x(){
this.nature
}
function x(){
return{}
}
上面两种方式只能二选一,不然容易混淆。
(function(){})() 直接执行一次函数。
var x = (function(){})() 模块化,使用对象不需要实例化。
var x = (function(){
this.nature//不能这么写
})();
下面两种随意
var x = (function(){
return {}
})();
var x = (function(){
var y = {};
return y;
})();