本文介绍了JavaScript里面的this属性。这个属性是理解JavaScript类和继承的重要基础。
this属性表示当前对象,如果在全局作用范围内使用this,则指代当前页面对象window; 如果在
函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用。 我们还可以使用apply和call两个全局方法来改变函数中this的具体指向。
先看一个在全局作用范围内使用this的例子:
- < script type="text/javascript">
- console.log(this === window); // true
- console.log(window.alert === this.alert); // true
- console.log(this.parseInt("021", 10)); // 10
- < /script>
函数中的this属性是在运行时决定的,而不是函数定义时,如下:
- // 定义一个全局函数
- function foo() {
- console.log(this.fruit);
- }
- // 定义一个全局变量,等价于window.fruit = "apple";
- var fruit = "apple";
- // 此时函数foo中this指向window对象
- // 这种调用方式和window.foo();是完全等价的
- foo(); // "apple"
- // 自定义一个对象,并将此对象的属性foo指向全局函数foo
- var pack = {
- fruit: "orange",
- foo: foo
- };
- // 此时函数foo中this指向window.pack对象
- pack.foo(); // "orange"
全局函数apply和call可以用来改变函数中this属性的指向,如下:
- // 定义一个全局函数
- function foo() {
- console.log(this.fruit);
- }
- // 定义一个全局变量
- var fruit = "apple";
- // 自定义一个对象
- var pack = {
- fruit: "orange"
- };
- // 等价于window.foo();
- foo.apply(window); // "apple"
- // 此时foo中的this === pack
- foo.apply(pack); // "orange"
注:apply和call两个函数的作用相同,唯一的区别是两个函数的参数定义不同。
因为在JavaScript中函数也是对象,所以我们可以看到如下有趣的例子:
- // 定义一个全局函数
- function foo() {
- if (this === window) {
- console.log("this is window.");
- }
- }
- // 函数foo也是对象,所以可以定义foo的属性boo为一个函数
- foo.boo = function() {
- if (this === foo) {
- console.log("this is foo.");
- } else if (this === window) {
- console.log("this is window.");
- }
- };
- // 等价于window.foo();
- foo(); // this is window.
- // 可以看到函数中this的指向调用函数的对象
- foo.boo(); // this is foo.
- // 使用apply改变函数中this的指向
- foo.boo.apply(window); // this is window.
转载于:https://blog.51cto.com/liweibird/275817