js中this的使用
阿新 • • 發佈:2018-02-26
字符串 tco spa blog 而不是 hello 使用 屬性 點擊
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);
js中this的使用