js中this的使用
this一般指执行当前代码的所有者
一个小李子:
<script type="text/javascript"> var name = "Kevin Yang"; function sayHi(){ alert("你好,我的名字叫" + this.name); } var person = {}; person.sayHello = sayHi; person.sayHello(); script>
sayHi() //Kevin Yang
person.sayHello() //name is undefined
sayHi()函数中的this此时代表的window或者global ,window下有name属性
person.sayHello()中的this代指的就是person对象了,person中无name属性
本文例句三种指针使用错误情况:
1.dom中的函数事件
<script type="text/javascript"> function sayHi(){ alert("当前点击的元素是" + this.tagName); } script> <input id="btnTest" type="button" value="点击我" onclick="sayHi()">
会报错,因为行数中的this此时指代的是window而不是dom
2.临时变量导致this丢失
<script type="text/javascript"> var Utility = { decode:function(str){ return unescape(str); }, getCookie:function(key){ // ... 省略提取cookie字符串的代码 var value = "i%27m%20a%20cookie"; return this.decode(value); } }; alert(Utility.getCookie("identity")) script>
这种写法是可以的但是一下写法就是错误的
<script type="text/javascript"> function showUserIdentity(){ // 保存getCookie函数到一个局部变量,因为下面会经常用到 var getCookie = Utility.getCookie; alert(getCookie("identity")); } showUserIdentity(); script>
getCookie是一个临时变量,getCookie中的指针指代的是window,所以会报错
<script type="text/javascript">
function showUserIdentity(){
// 保存getCookie函数到一个局部变量,因为下面会经常用到
var getCookie = Utility.getCookie;
alert(getCookie.call(Utility,"identity"));
//alert(getCookie.apply(Utility,["identity"]));
}
showUserIdentity();
script>
3.传参时导致指针丢失 注意,Javascript里面都是值传递的,没有引用传递的概念
<script type="text/javascript">
var person = {
name:"Kevin Yang",
sayHi:function(){
alert("你好,我是"+this.name);
}
}
setTimeout(person.sayHi,5000);
script>
window.setTimeout中this指向window
var boundFunc = person.sayHi.bind(person,person.sayHi);
setTimeout(boundFunc,5000);