/*
js的this到底是谁?
js中函数的4种调用方式
*/
<script type="text/javascript">
alert(window.xx);
/*
1、普通函数调用
this的值指向window
准确的说,是this为null,被解释成window
*/
function t() {
this.xx = 333;
}
t(); //undefined
alert(window.xx); //333
</script>
<script type="text/javascript">
/*
2、作为对象的方法调用
this指向方法的调用者,即该对象
*/
var obj = {xx:999,yy:888,t:function(){alert(this.xx)}};
obj.t();
var dog = {xx:'wangwang'};
dog.t = obj.t;
dog.t(); //wangwang
/*
作为方法调用时,
this指向其调用那一刻的调用者,即母体对象
不管被调用函数声明的时候属于方法还是函数
*/
show = function() {
alert('show' + this.xx);
}
dog.t = show;
dog.t(); //show wangwang
</script>
<script type="text/javascript">
/*
3、函数作为构造函数调用时
js中没有类的概念,创建对象是用构造函数来完成,或者直接用json格式{}来写对象
new Dog发生了以下几个步骤
a:系统创建空对象 {},(空对象constructor属性指向Dog函数)
b:把函数的this指向-->该空对象
c:执行该函数
d:返回该对象
*/
function Dog(name,age) {
this.name = name;
this.age = age;
this.bark = function() {
alert('this is ' + this.name + '!');
}
} //this is huzi!
var dog = new Dog('huzi',2);
dog.bark();
// 下面这个返回什么?
function Pig() {
this.age = 99;
return 'abc';
}
var pig = new Pig();
//Pig对象,因为函数作为构造函数运行时,return的值是忽略的,还是返回对象
console.log(pig);
</script>
<script type="text/javascript">
/*
4、函数通过call,apply调用
语法格式:函数.call(对象,参数1,参数2...参数N)
*/
function t(num) {
alert('我的真实年龄是' + this.age);
alert('但我一般告诉别人我' + (this.age + num))
}
var human = {name:'lisi',age:28};
human.t = t;
human.t(-10);
// this指向了human,但是human多了个方法.
// 接下来,我们不把t赋为human的属性,也能把this指向human
var wangwu = {name:'wangwu',age:30};
t.call(wangwu,-15);
/*
解释
fn.call(对象obj,参数1,参数2...参数N)
运行如下:
a) fn函数中的this指向-->对象obj
b) 运行fn(参数1,参数2...参数N)
*/
</script>