欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

淺談JavaScript中的this指針和引用知識

 更新時間:2016年08月05日 10:45:28   作者:xuht_nb  
this是javascript的一個關(guān)鍵字,隨著函數(shù)使用場合不同,this的值會發(fā)生變化。但是總有一個原則,那就是this指的是調(diào)用函數(shù)的那個對象。接下來通過本文給大家介紹js中的this指針和引用,非常不錯,需要的朋友參考下

this是javascript的一個關(guān)鍵字,隨著函數(shù)使用場合不同,this的值會發(fā)生變化。但是總有一個原則,那就是this指的是調(diào)用函數(shù)的那個對象。

this指針在傳統(tǒng)OO語言中,是在類中聲明的,表示對象本身.在JavaScript中,this表示當前上下文,即調(diào)用者的引用

********this永遠指向的是(函數(shù)對象)的所有者

this和全局對象:

var a = 1; 
function foo(){ 
var b = 2; 
console.log(this.a+b);//3 
} 
foo(); 
//foo函數(shù)所有者是window,全局函數(shù)中this指代的是window對象(********除非使用new,call,apply方法來改變this的指代關(guān)系)

this和對象:

var person = { 
name:'Theo Wong', 
gender:'male', 
getName:function(){ 
console.log(this.name);//getName函數(shù)所有者是person對象 
} 
}; 
person.getName();

嵌套函數(shù)中的this

var myObject = { 
func1:function() { 
console.log(this); //myObject 
var func2=function() { 
console.log(this); //window 
var func3=function() { 
console.log(this); //window 
}(); 
}(); 
} 
}; 
myObject.func1(); 
//在嵌套函數(shù)中,由于嵌套函數(shù)的執(zhí)行上下文是window,所以this指代的是window對象,其實這是ECMA-262-3的一個bug,在最新的ECMA-262-5中已經(jīng)修復(fù)

事件處理中的this:

var showValue = function(){ 
alert(this.value); 
};

1.<input id="test" type="text" />

通過dom.onclick綁定事件,document.getElementById('test').onclick = showValue;

此時showValue是作為dom的onclick方法被調(diào)用的,所以它的this應(yīng)該指代的是dom對象,而不再是window對象

2.寫在html標簽內(nèi),<input id="test" type="text" onclick="showValue();" />

當點擊dom時,我們獲取不到正確的this,此時的this指代的是window對象,因為window對象中沒有定義value的值,所以獲取不到this.value

***此時的不是將showValue函數(shù)賦值給dom對象的onclick,而是引用,此時function()函數(shù)所有者是window

document.getElementById('test').onclick = function(){
showValue();
}

通過addEventListener/attachEvent綁定事件監(jiān)聽

<input type="text" id="test" /> 
<script type="text/javascript"> 
var dom = document.getElementById('test'); 
id = 'window'; 
function test(){ 
alert(this.id); 
} 
dom.addEventListener?dom.addEventListener('click',test,false):dom.attachEvent('onclick',test); 
//addEventListener test 
//attachEvent window 
</script>
//這種綁定事件監(jiān)聽的方式,attachEvent this是window對象,而addEventListener則是dom對象的

this和構(gòu)造:

function obj(name,age){ 
this.name = name; 
this.age = age; 
this.fun = function(){ 
alert(this.name); 
}; 
} 
var obj = new obj('xht',18);//this就指這個新對象,new 改變this的指代關(guān)系 
obj.fun();//xht

this和call

//定義一個人,名字為jack 
var jack = { 
name : "jack", 
age : 26 
} 
//定義另一個人,名字為abruzzi 
var abruzzi = { 
name : "abruzzi", 
age : 26 
} 
//定義一個全局的函數(shù)對象 
function alertName(){ 
return this.name; 
} 
//設(shè)置alertName的上下文為jack, 此時的this為jack 
alert(alertName.call(jack)); 
//設(shè)置alertName的上下文為abruzzi,此時的this為abruzzi 
alert(alertName.call(abruzzi));

引用是一個比較有意思的主題,跟其他的語言不同的是,JavaScript 中的引用始終指向最終的對象,而并非引用本身

var obj = {}; // 空對象 
var ref = obj; // 引用 
obj.name = "objectA" ; 
alert(ref . name); //ref 跟著添加了 name 屬性 
obj = ["one" , "two" , "three"]; //obj 指向了另一個對象 ( 數(shù)組對象 ) 
alert(ref.name); //ref 還指向原來的對象 
alert(obj.length ); //3 
alert(ref.length);

obj 只是對一個匿名對象的引用,所以, ref 并非指向它.

引用指向的只能是具體的對象,當具體對象改變的時候,引用還是引用原來的對象,而不是改變后的對象。

以上所述是小編給大家介紹的JavaScript中的this指針和引用知識,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!

相關(guān)文章

  • JavaScript 一行代碼,輕松搞定浮動快捷留言-V2升級版

    JavaScript 一行代碼,輕松搞定浮動快捷留言-V2升級版

    前天熬了大半宿發(fā)了一篇[一行代碼輕松搞定快捷留言功能],同時發(fā)布了V1.0beta版的快捷留言功能和源代碼,之所以是beta版,就是當時感覺雖然基本功能有了,但是還不夠完善,特性也不一定合理
    2010-04-04
  • 用roll.js實現(xiàn)的圖片自動滾動+鼠標觸動的特效

    用roll.js實現(xiàn)的圖片自動滾動+鼠標觸動的特效

    用roll.js實現(xiàn)的圖片自動滾動+鼠標觸動的特效...
    2007-03-03
  • js判斷手機訪問或者PC的幾個例子(常用于手機跳轉(zhuǎn))

    js判斷手機訪問或者PC的幾個例子(常用于手機跳轉(zhuǎn))

    js判斷手機或者PC的例子我們在幾乎所有網(wǎng)站都會有這段代碼了,現(xiàn)在手機流量與pc差不多了,下面來看兩段js判斷手機或者PC例子吧
    2015-12-12
  • 微信小程序自定義底部彈出框動畫

    微信小程序自定義底部彈出框動畫

    這篇文章主要為大家詳細介紹了微信小程序自定義底部彈出框動畫,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2020-11-11
  • Highcharts使用簡例及異步動態(tài)讀取數(shù)據(jù)

    Highcharts使用簡例及異步動態(tài)讀取數(shù)據(jù)

    Highcharts 是一個用純JavaScript編寫的一個圖表庫, 能夠很簡單便捷的在web網(wǎng)站或是web應(yīng)用程序添加有交互性的圖表,并且免費提供給個人學(xué)習(xí)、個人網(wǎng)站和非商業(yè)用途使用,通過本文給大家介紹Highcharts使用簡例及異步動態(tài)讀取數(shù)據(jù)的相關(guān)知識,感興趣的朋友一起學(xué)習(xí)吧
    2015-12-12
  • 如何安裝控制器JavaScript生成插件詳解

    如何安裝控制器JavaScript生成插件詳解

    這篇文章主要給大家介紹了關(guān)于如何安裝控制器JavaScript生成插件的相關(guān)資料,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2018-10-10
  • JS實現(xiàn)多物體運動

    JS實現(xiàn)多物體運動

    這篇文章主要為大家詳細介紹了JS實現(xiàn)多物體運動,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2022-05-05
  • js select option對象小結(jié)

    js select option對象小結(jié)

    本篇文章主要是對js中的select option對象進行了總結(jié)介紹,需要的朋友可以過來參考下,希望對大家有所幫助
    2013-12-12
  • IE6/7 and IE8/9/10(IE7模式)依次隱藏具有absolute或relative的父元素和子元素后再顯示父元素

    IE6/7 and IE8/9/10(IE7模式)依次隱藏具有absolute或relative的父元素和子元素后再顯示

    多數(shù)情況下隱藏(設(shè)置display:none)一個元素,無需依次將其內(nèi)的所有子元素都隱藏。非要這么做,有時會碰到意想不到的bug。
    2011-07-07
  • JavaScript事件機制的剖析與優(yōu)化詳解

    JavaScript事件機制的剖析與優(yōu)化詳解

    在現(xiàn)代前端開發(fā)中,JavaScript事件處理是一個至關(guān)重要的部分,它能夠使網(wǎng)頁與用戶交互,實現(xiàn)豐富的交互體驗,然而,對JavaScript事件機制的深入理解是開發(fā)者成為優(yōu)秀前端工程師的關(guān)鍵所在,本文將全面剖析JavaScript事件機制,需要的朋友可以參考下
    2023-12-12

最新評論