91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

原生javascript中this幾種常見用法總結

發布時間:2020-08-24 19:16:58 來源:腳本之家 閱讀:154 作者:巴啦啦小能量 欄目:web開發

本文實例講述了原生javascript中this幾種常見用法。分享給大家供大家參考,具體如下:

this的應用  “是”  代名詞

this必須出現在函數里面

//------------------默認綁定
function test (){
  console.log(this.a);//1
}
var a = 1;
test();

this取得是window的對象a;此處默認window

//---------------------隱士綁定?
function test (){
  console.log(this.a);//2
}
var foo = {
  a:2,
  f:test
}
var a = 1;
foo.f();

此處this取得是foo對象的a;

//---------------------隱士綁定 多層調用鏈?
function test (){
  console.log(this.a);//3
}
var foo = {
  a:3,
  f:test
}
var foo2 = {
  a:4,
  f:foo
}
var a = 1;
foo2.f.f();

此處this取得是foo對象的a,foo2中只起到調用foo,所以thisl指的還是foo;

//---------------------隱士綁定 (隱士丟失) 多層調用鏈?
function test (){
  console.log(this.a);//1
}
var foo = {
  a:2,
  f:test
}
var a = 1;
var fun = foo.f;
fun();

由于是賦值  調用的是fun(),foo.f 是取函數,但是this的對象是fun,是window對象,所以只能取得全局變量a

//1,this所在的函數是事件處理函數,那么this就是事件源;
var btns = document.getElementsByTagName("button");
獲取所有button
for(var i = 0; i < btns.length;i++){
  btns[i].onclick = function(){
    this代表當前事件源
    console.log(this)
  }
}

// 2、this所在函數是構造函數,那么this就是new的對象,并且會生成__proto__屬性。
function func(name,age){
  this.name = name;
  this.age = age;
  // console.log(this)
}
let f = new func("z",20);

// 3、this所在函數是類的方法,那么this就是調用方法時的對象
function Fnc(name,age){
  this.name = name;
  this.age = age;
}
Fnc.prototype.eat = function(){
  console.log(this);
}
let fn = new Fnc("a",12);
fn.eat();
let fn2 = new Fnc("b",10);
fn2.eat();

// 4、this的轉移 轉移到window
var btns = document.getElementsByTagName("button");
//獲取所有button
for(let i = 0; i < btns.length;i++){
  btns[i].onclick = function(){
    console.log(this)
    // this代表點擊事件源
    setTimeout(function(){
      console.log(this);
      // this代表window對象 發生了轉移
    },30)
  }
}
/*
以上所說的所在函數,重點看關鍵字function。不會受箭頭函數的影響
JavaScript中的一切的一切都屬于window對象。window對象可以省略。
所有的全部變量,函數,類,都屬于window對象。
this的轉移:發生在閉包里。*/

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具:http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。

更多關于JavaScript相關內容感興趣的讀者可查看本站專題:《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》

希望本文所述對大家JavaScript程序設計有所幫助。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

杭锦后旗| 从化市| 乌拉特前旗| 铁岭市| 连云港市| 大港区| 营山县| 常州市| 图木舒克市| 绿春县| 铁力市| 焦作市| 桂林市| 于田县| 怀宁县| 天门市| 台山市| 吉安市| 光泽县| 大石桥市| 黄山市| 乐亭县| 和田县| 绿春县| 弋阳县| 大港区| 灵山县| 土默特右旗| 夹江县| 本溪市| 宁远县| 五家渠市| 武夷山市| 景谷| 姜堰市| 岑溪市| 延长县| 铁力市| 会昌县| 确山县| 鹤峰县|