今天就跟大家聊聊有關(guān)如何進(jìn)行關(guān)于js中this、原型與閉包的深入理解，可能很多人都不太了解，為了讓大家更加了解，小編給大家總結(jié)了以下內(nèi)容，希望大家根據(jù)這篇文章可以有所收獲。

創(chuàng)新互聯(lián)專注于濱州企業(yè)網(wǎng)站建設(shè),自適應(yīng)網(wǎng)站建設(shè),成都做商城網(wǎng)站。濱州網(wǎng)站建設(shè)公司,為濱州等地區(qū)提供建站服務(wù)。全流程按需開發(fā)，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)

1、this關(guān)鍵字

a、有對(duì)象指向?qū)ο螅?/p>

b、沒對(duì)象指向全局變量（window）;

c、有new指向new出的新對(duì)象；

d、bind,call&apply改變this的指向；

e、setTimeout/setInterval this指向window；

f、箭頭函數(shù) this 是由函數(shù)定義時(shí)候確定的；

var adder = {  base : 1,      add : function(a) {    
var f = v => v + this.base;    
return f(a);
  },  addThruCall: function inFun(a) {    
var f = v => v + this.base;    
var b = {      base : 2    };               
 return f.call(b, a);  
 }};

var obj = {  i: 10,  b: () => console.log(this.i, this),  c: function() {    console.log( this.i, this)  }}obj.b();  // undefined window{...}原型obj.c();  // 10 Object {...}

2、原型

prototype:

prototype:每一個(gè)對(duì)象都會(huì)在其內(nèi)部初始化一個(gè)屬性：即prototype；

原型鏈：當(dāng)我們訪問一個(gè)對(duì)象的屬性時(shí)，如果這個(gè)對(duì)象內(nèi)部不存在這個(gè)屬性，那么就回去__proto__里找這個(gè)屬性，這樣一直找下去就是：原型鏈；

instanceof 原理是判斷實(shí)例對(duì)象的__proto__和生成該實(shí)例的構(gòu)造函數(shù)的prototype是不是引用的同一個(gè)地址。

hasOwnProperty 是 JavaScript 中一個(gè)處理屬性但是不查找原型鏈的函數(shù)。

構(gòu)造函數(shù)  ->prototype-> 原型對(duì)象 -> constructor -> 構(gòu)造函數(shù)

構(gòu)造函數(shù) -> new -> 實(shí)例對(duì)象

實(shí)例對(duì)象 -> __proto__-> 原型對(duì)象-> __proto__->原型對(duì)象->->null

執(zhí)行上下文：

變量聲明與函數(shù)聲明，其作用域會(huì)提升到方法體的頂部；

作用域：

a、javascript沒有塊級(jí)作用域

b、javascript除了全局作用域之外，只有函數(shù)可以創(chuàng)建的作用域。作用域在函數(shù)定義時(shí)就已經(jīng)確定了。而不是在函數(shù)調(diào)用時(shí)確定。

閉包：

概念： 內(nèi)部函數(shù)可以訪問外部函數(shù)中的變量；

使用：函數(shù)作為返回值；函數(shù)作為參數(shù)；

作用：封裝變量，收斂權(quán)限；

缺點(diǎn)：消耗內(nèi)存

創(chuàng)建對(duì)象的方法：

對(duì)象字面量；

構(gòu)造函數(shù)；

立即執(zhí)行函數(shù)；

Object.create()；

new 對(duì)象過程：

創(chuàng)建新對(duì)象；

this指向這個(gè)新對(duì)象；

執(zhí)行代碼；

返回this；

類與繼承：

類的聲明：

function Animal(){    this.name = 'name';} // es6  class Animal2{    constructor(){        this.name = 'name2';    }}

繼承：

1.借助構(gòu)造函數(shù)實(shí)現(xiàn)繼承

function Parent(){    this.name = 'parent';} function Child(){    Parent.call(this);    this.type = 'child1';}

缺點(diǎn)：

部分繼承；

繼承不到父類原型對(duì)象上的方法；(只有父類的屬性掛載到子類上了，Child的prototype沒變?yōu)镃hild.prototype繼承不了Parent的prototype）

2.原型鏈繼

function Parent(){    this.name = 'name';}function Child(){    this.type = 'child';} Child.prototype = new Parent();

缺點(diǎn)：原型鏈上原型對(duì)象是共用的。(原型的屬性修改，所有繼承自該原型的類的屬性都會(huì)一起改變)

3.組合方式

function Parent(){    this.name = 'parent';}function Child(){    Parent.call(this);    this.type = 'child';}Child.prototype = new Parent();

缺點(diǎn)：

父類執(zhí)行函數(shù)執(zhí)行兩次；

constructor指向父類；

function Parent(){    this.name = 'parent';}function Child(){    Parent.call(this);    this.type = 'child';}Child.prototype = Parent.prototype;

缺點(diǎn)：

子類constructor指向父類

function Parent(){    this.name = 'parent';}function Child(){    Parent.call(this);    this.type = 'child';}Child.prototype = Object.create(Parent.prototype);Child.prototype.constructor = Child;

優(yōu)點(diǎn)：

子類的原型指向Object.create(Parent.prototype)，實(shí)現(xiàn)了子類和父類構(gòu)造函數(shù)的分離，但是這時(shí)子類中還是沒有自己的構(gòu)造函數(shù)，

所以緊接著又設(shè)置了子類的構(gòu)造函數(shù)，由此實(shí)現(xiàn)了完美的組合繼承。（也就是把父類的prototype寫入子類的prototype,在定義子類的constructor）

4. es6

class Child extends Parent {    constructor(){     }}

看完上述內(nèi)容，你們對(duì)如何進(jìn)行關(guān)于js中this、原型與閉包的深入理解有進(jìn)一步的了解嗎？如果還想了解更多知識(shí)或者相關(guān)內(nèi)容，請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝大家的支持。

文章題目：如何進(jìn)行關(guān)于js中this、原型與閉包的深入理解-創(chuàng)新互聯(lián)
分享URL：http://jinyejixie.com/article2/jihoc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)建站、做網(wǎng)站、標(biāo)簽優(yōu)化、面包屑導(dǎo)航、品牌網(wǎng)站設(shè)計(jì)、網(wǎng)站設(shè)計(jì)公司

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)