首页 > 代码库 > 说出this的三个应用
说出this的三个应用
1.this是javascript中的一个关键字,它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。
2.随着函数使用场合的不同,this的值会发生变化,但是有一个原则,就是this指的是调用函数的那个对象。
3.this分类
1)纯粹的函数调用
这时的this指向window。(函数没有所属对象:指向全局对象)
eg:
var x=1;
function test(){
alert(this.x);
}
test();
2)作为对象方法的调用
这时的this指向上级对象。(函数有所属对象时:指向所属对象)
eg:
function test(){
alert(this.x)
}
var o={};
o.x=1;
o.m=test;
o.m();
3)作为构造函数调用
构造函数,就是通过这个函数生成一个新对象。这时的this指向这个新对象。(构造器中的 this:指向新对象)
eg:
function test(){
this.x=1;
}
var o=new test();
alert(o.x);
var x=2;
function test(){
this.x=1;
}
var o=new test();
alert(x);
function foo(){return this.a};
var a=2;
var o={a:3,foo:foo};
var p={a:4};
console.log(o.foo());
p.foo=o.foo;
console.log(p.foo());
console.log(foo());
4)apply或者call的调用
是改变函数对象的一个方法,作用是改变函数的调用对象。
eg:
var x=0;
function test(){
alert(this.x);
}
var o={};
o.x=1;
o.m=test;
o.m();
o.m.apply();
例题
//1
var point={
x:0,
y:0,
moveTo:function(x,y){
this.x=this.x+x;
this.y=this.y+y;
alert(this.x); //1
alert(this.y); //1
}
}
point.moveTo(1,1);
//2
var myObject = {value: 100};
myObject.getValue = http://www.mamicode.com/function () {
console.log(this.value);
console.log(this);
return this.value;
};
console.log(myObject.getValue()); // 100 object{value: 100} 100
//3
var myObject = {value: 100};
myObject.getValue = http://www.mamicode.com/function () {
var foo = function () {
console.log(this.value);
console.log(this);
};
foo();
return this.value;
};
console.log(myObject.getValue()); //undefined window 100
//4
var SomeClass = function(){
this.value = http://www.mamicode.com/100;
}
var myCreate = new SomeClass();
console.log(myCreate.value); //100
//5
var myObject = {value: 100};
var foo = function(){
console.log(this);
};
foo(); //window
foo.apply(myObject); //object{value: 100}
foo.call(myObject); //object{value: 100}
//6
var name = "clever coder";
var person = {
name : "foocoder",
hello : function(sth){
var sayhello = function(sth) {
console.log(this.name + " says " + sth);
};
sayhello(sth);
}
}
person.hello("hello world"); //clever coder says hello world
//7
var name = "clever coder";
var person = {
name : "foocoder",
hello : function(sth){
var that = this;
var sayhello = function(sth) {
console.log(that.name + " says " + sth);
};
sayhello(sth);
}
}
person.hello("hello world"); ////foocoder says hello world
//1
var point={
x:0,
y:0,
moveTo:function(x,y){
this.x=this.x+x;
this.y=this.y+y;
console.log(this.x);
console.log(this.y);
}
};
point.moveTo(1,1); //1 1
//2
var myObject = {value: 100};
myObject.getValue = http://www.mamicode.com/function () {
console.log(this.value);
console.log(this);
return this.value;
};
console.log(myObject.getValue()); //100 object 100
//3
var myObject = {value: 100};
myObject.getValue = http://www.mamicode.com/function () {
var foo = function () {
console.log(this.value);
console.log(this);
};
foo();
return this.value;
};
console.log(myObject.getValue());//undefined window 100
//4
var SomeClass = function(){
this.value = http://www.mamicode.com/100;
}
var myCreate = new SomeClass();
console.log(myCreate.value); //100
//5
var myObject = {value: 100};
var foo = function(){
console.log(this);
};
foo(); //window
foo.apply(myObject);//Object
foo.call(myObject); //Object
//6
var name = "clever coder";
var person = {
name : "foocoder",
hello : function(sth){
var sayhello = function(sth) {
console.log(this.name + " says " + sth);
};
sayhello(sth);
}
}
person.hello("hello world"); //clever coder says hello world
//7
var name = "clever coder";
var person = {
name : "foocoder",
hello : function(sth){
var that = this;
var sayhello = function(sth) {
console.log(that.name + " says " + sth);
};
sayhello(sth);
}
}
person.hello("hello world"); //foocoder says hello world
//8
var name="window";
var Bob={
name:"Bob",
showName:function(){
alert(this.name);
}
};
var Tom={
name:"Tom",
showName:function(){
var fun=Bob.showName;
fun();
}
}
Tom.showName(); //window
//9
var name="Bob";
var nameObj={
name:"Tom",
showName:function(){
alert(this.name);
},
waitShowName:function(){
!function(__callback){
__callback();
}(this.showName);
}
}
nameObj.waitShowName(); //Bob
var name="Bob";
var nameObj={
name:"Tom",
showName:function(){
alert(this.name);
},
waitShowName:function(){
var that=this;
setTimeout(function(){
that.showName();
},1000);
}
};
nameObj.waitShowName(); //Tom
说出this的三个应用
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。