码迷,mamicode.com
首页 > Web开发 > 详细

JS-this

时间:2019-07-29 00:48:51      阅读:115      评论:0      收藏:0      [点我收藏+]

标签:toc   ring   函数调用   zha   调用函数   min   token   set   声明   

 

 

call,apply,bind作用

call,apply,bind都是用来改变this的指向

使用例子

call的使用

function Person(){
	alert(this.name);
}
var student={
	name:"zhangShan"
};
Person.call(student);	//this指向student,输出zhangShan

apply和call的区别

var person={
	name:"zhangShan",
	say:function(age,phone){
		alert(this.name+" "+age+" "+phone);
	}
};
var person2={
	name:"xiaoMing"
};
person.say.call(person2,20,"12356985");	//值必须分开传递
person.say.apply(person2,[20,"12356985"]);	//必须是一个数组
var person2Args=[20,"12356985"];	//也可以单独声明然后用apply

bind和call的区别

function Person(){
	alert(this.name);
}
var student={
	name:"zhangShan"
};
Person.call(student);	//直接运行输出结果
Person.bind(student);	//不会运行,返回的是一个函数
Person.bind(student)(); //调用函数则运行
var StudentMethod=Person.bind(student);	//作为函数保存起来

this绑定

默认绑定

全局环境

console.log(this);	//输出window

函数调用

function pd(){
	console.log(this==window);
}
pd();	//输出true,函数里的额this被默认绑定window

被嵌套函数独立调用

var a=0;
function test(){
	var a=1;
	function t1(){
		console.log(this.a);	//输出0,this指向window
	}
	t1();
}
test();

上面4-7行等价于:

//IIFE形式
(function t1(){
	console.log(this.a);
})();

隐式绑定

var a=0;
var test={
	a:1,
	fun:function(){
		console.log(this.a);
	}
};
test.fun(); //this隐式绑定到test,输出1

隐式丢失

隐式丢失总结起来只有一种情况:一个对象的方法被独立调用时会造成隐式丢失

函数别名

var a=0;
var test={
	a:1,
	fun:function(){
		console.log(this.a);
	}
};
var f=test.fun;	//f仅仅等于独立的fun方法,所以this丢失绑定对象,转为默认绑定(绑到window)
f();	//输出0

函数作为参数传递

var a=0;
var test={
	a:1,
	fun:function(){
	console.log(this.a);
	}
};
function run(fun){
	fun();
}
run(test.fun);	/输出0

内置函数

//将上面代码的8-11行改为内置的setTimeout函数同样会引起隐式
setTimeout(test.fun,0);	//输出0

显示绑定

使用call,apply,bind绑定的即为显示绑定

另外还有一些自带对象的某些方法也有显示绑定功能:
例如数组的 map()、forEach()、filter()、some()、every() 方法

例子:数组的forEach()显示绑定

var a=0;
function say(){
	console.log(this.a);
}
var obj={
	a:1
};
[1,2,3].forEach(say,obj);	//参数一:遍历对象,参数二:显示绑定的对象

new绑定

ction person(name,age,phone){
	this.name=name; //this指向新创建的对象
	this.age=age;
	this.phone=phone;
}
var p1=new person("sam",20,"1256315");

构造函数中,this指向新创建的对象

JS-this

标签:toc   ring   函数调用   zha   调用函数   min   token   set   声明   

原文地址:https://www.cnblogs.com/yangjiale/p/11261375.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!