一、普通方式
1 /*普通模式*/ 2 3 // 声明一个函数,并调用 4 function func() { 5 console.log("Hello World"); 6 } 7 func();
二、函数表达式
1 /*函数表达式*/ 2 // 使用函数的Lambda表达式定义函数,然后调用 3 var func = function() { 4 console.log("你好,百度一下"); 5 }; 6 func(); 7 8 //可以发现函数调用很简单,就是平时学习的一样. 9 //这里的关键是,在函数调用模式中,函数里的 this 关键字指全局对象, 10 //如果在浏览器中就是 window 对象. 例如: 11 var func = function() { 12 console.log(this); 13 }; 14 func(); 15 // 此时,会弹出对话框,打印出 [object Window]
三、方法调用模式
1 /*方法调用模式*/ 2 //函数调用模式很简单,是最基本的调用方式. 3 //但是同样的是函数,将其赋值给一个对象的成员以后,就不一样了. 4 //将函数赋值给对象的成员后,那么这个就不在称为函数,而应该叫做方法. 5 6 // 定义一个函数 7 var func = function() { 8 alert("我是一个函数么?"); 9 }; 10 11 // 将其赋值给一个对象 12 var o = {}; 13 o.fn = func; // 注意这里不要加圆括号 14 // 调用 15 o.fn(); 16 17 //此时,o.fn 则是方法,不是函数了. 18 //实际上 fn 的方法体与 func 是一模一样的,但是这里有个微妙的不同. 看下面的代码: 19 // 接上面的代码 20 alert(o.fn === func); 21 //打印结果是 true ,这个表明两个函数是一样的东西. 但是修改一下函数的代码: 22 23 // 修改函数体 24 var func = function() { 25 alert(this); 26 }; 27 var o = {}; 28 o.fn = func; 29 // 比较 30 alert(o.fn === func); 31 // 调用 32 func(); 33 o.fn(); 34 // 这里的运行结果是,两个函数是相同的,因此打印结果是 true. 35 // 但是由于两个函数的调用是不一样的, 36 // func的调用,打印的是 [object Window],而o.fn 的打印结果是[object Object]. 37 // 这里便是函数调用与方法调用的区别. 38 // 函数调用中,this专指全局对象window, 39 // 而在方法中this专指当前对象. 即o.fn 中的this 指的就是对象o.
四、构造函数调用模式
1 /*构造函数调用模式*/ 2 3 // 同样是函数,在单纯的函数模式下,this表示window; 4 // 在对象方法模式下,this指的是当前对象. 5 // 除了这两种情况,JavaScript中函数还可以是构造器. 6 // 将函数作为构造器来使用的语法就是在函数调用前面加上一个new关键字. 如代码: 7 // 定义一个构造函数 8 var Person = function() { 9 this.name = "百度一下"; 10 this.sayHello = function() { 11 alert("你好,这里是" + this.name); 12 }; 13 }; 14 // 调用构造器,创建对象 15 var p = new Person(); 16 // 使用对象 17 p.sayHello(); 18 19 // 上面的案例首先创建一个构造函数Person,然后使用构造函数创建对象p. 20 // 这里使用 new语法.然后使用对象调用sayHello()方法. 21 // 这个使用构造函数创建对象的案例比较简单. 从案例可以看到,此时 this指的是对象本身.
五、apply、call调用模式
上篇中详细讲解了。