JavaScriptのコール（）（適用）バインド（）とプロトタイププロトタイプチェーンとの間の差

コール（）

• 今、関数の実装という。
• そこパラメータであり、パラメータは、オブジェクト・タイプである場合、この関数は、パラメータに変更される点を示します。
• この中に機能がない場合、コールはどんな意味がありません、と機能の一般的な概念は同じことを実行します。
• 実装に呼び出し（）関数は、関数のパラメータは第二から順次書き込まれます。
• （）の呼び出しまたは）は（適用される場合、最初のパラメータは窓関数にそこリダイレクトされることを、この手段は、空またはnullです。

構文：メソッド名は.call（オブジェクト）

function fn(_a,_b){
   this.a=_a;
   this.b=_b;
}
fn();//等同于
fn.call();//立即执行函数，this指向window

let obj={};
fn.call(obj);//立即执行函数，且this指向obj

fn(3,4);//等同于
fn.call(obj,3,4);

適用されます（）

• 適用（）、そしてこの点は、第1のパラメータオブジェクトを変更することであるように（）の呼び出しは同じです。
• ）（2つのパラメータのみを適用し、最初のパラメータは、この点の関数であり、2番目のパラメータは、アレイは、アレイは、パラメータの関数です。
• （）の呼び出しまたは）は（適用される場合、最初のパラメータは窓関数にそこリダイレクトされることを、この手段は、空またはnullです。

function fn(_a,_b){
   this.a=_a;
   this.b=_b;
}
fn();//等同于
fn.call();//立即执行函数，this指向window

let obj={};
fn.apply(obj);//立即执行函数，且this指向obj

fn(3,4);//等同于
fn.apply(obj,[3,4]);

ケース：

var obj={
    abc:function(_a,_b){
       this.a=_a;
       this.b=_b;
    }
}

obj.abc(3,5);//obj对象的a属性变为3,b属性变为5
var o1={};
obj.abc.call(o1,3,5);//将abc函数中的this指向o1
console.log(obj);//{a: 3, b: 5, abc: fn()}
console.log(o1);//{a: 3, b: 5}

）（場合（）の呼び出しまたは適用、最初のパラメータがnullの場合、この手段窓関数にそこにリダイレクトされること。

var obj={
    abc:function(_a,_b){
       this.a=_a;
       this.b=_b;
    }
}
obj.abc.call(null,3,4);
//等同于
obj.abc.call(window,3,4);
console.log(obj);//{abc:fn()}
console.log(a,b);//3,4

ケース：配列内の最大値を返します。

そここのヌルないMath.maxなく、後の任意のアクションなしに通過するので、目的は、アレイを通過したときにパラメータを渡すことです。

var Math={
    max:function(){
        if(arguments.length===0) return;
        var max=arguments[0];
        if(arguments.length===1) return max;
        for(var i=1;i<arguments.length;i++){
            max=max>arguments[i] ? max : arguments[i];
        }
        return max;
    }
}
var arr=[1,3,5,6];
var max=Math.max.apply(null,arr);
console.log(max);//6

ケース：配列に要素のコレクション

<div></div>
<div></div>
<div></div>
<div></div>
<script>
	var divs=document.getElementsByTagName("div");
    console.log(divs);//HTMLCollection(5) [div, div, div, div, div]
    var arr=Array.prototype.slice.call(divs);
    //var arr=[].slice.call(divs);//跟上面的写法意思一样
    console.log(arr);//[div, div, div, div, div]
</script>

Array.prototype.slice.call（）の実装の原則：

class Array1{
  constructor(){

    }
    // 属性和方法  动态属性,实例属性,该类的原型属性,实例化的原型链属性
    // 动态属性 其实相对static 静态来说的
    // 实例属性,该属性是通过new 构造函数来实例化对象以后调用的
    // 该类的原型属性 站在类的立场上,类.prototype.属性   ES5中的方式
    // 实例化的原型链属性 站在实例对象的的立场上,ES5中,对象中原型链上的方法和属性
    slice(start,end){
        // ES6中实例方法中的this就是该类实例化的对象
        start=Number(start);
        end=Number(end);
        if(isNaN(start)) start=0;
        if(isNaN(end)) end=this.length;
        if(start<0) start=this.length+start;
        if(end<0) end=this.length+end;
        var arr=[];
        for(var i=start;i<end;i++){
            arr.push(this[i]);
        }
        return arr;
    }
}

Array1.prototype.slice();//this指的是Array1
var arr=new Array1();
arr.slice();//this指的是实例化出来的arr，它的__proto__是Array1

arr.slice.call(divs);
Array1.prototype.slice.call(divs);

プロトタイププロトタイプチェーン

• オブジェクトのプロトタイプとプロトタイプチェーンコンストラクタ（クラス）が同じオブジェクト参照です。
• プロトタイプチェーンは、オブジェクトのための人気の名前、唯一の__proto__のみ対象です。
• コンストラクタ（クラス）、唯一のコンストラクタ（クラス）のプロトタイプを持っているためのプロトタイプ名。
• コンストラクタ（プロトタイプ）の例としては、一例としてコンストラクタメソッド（プロトタイプ）を呼び出すことができ、自動的に独自のプロパティとプロトタイプの方法を有することになります。

class Box{
    static a=3;
    b=4;
    constructor(){

    }
    play(){
        console.log(this);//打印结果如下图
    }
    static once(){

    }
}

Box.once();//静态方法
var b=new Box();
b.play();
Box.prototype.play();

それは.__ proto__ === Box.prototype bを見ることができます

//如果在对象的对象属性中没有找到,则会去原型链上找到里他最近的这个属性,
b.play()===b.__proto__.play();
Box.prototype.play()===b.play();
//得出如下结论
b.__proto__===Box.prototype

練る（）

あなたがコールバック関数にこのコールバック関数を再実行する必要があるときは、バインドを持つオブジェクトを指す必要があります

function fn1(fn){
    fn(3);
}
function fn2(_a){
    this.a=_a;
}

// 当需要在回调函数中重新执行回调函数中的this，就需要是用bind来指向对象
var obj={};
// 把fn2函数中的this指向obj，并且返回这个被指向this后新的函数
fn1(fn2.bind(obj));
console.log(obj);//{a:3}

// 这里创建了一个新的函数,return了一个新的函数
var fns=fn2.bind(obj);
console.log(fns===fn2);//false

バインド（）の実装の原則：

function fn1(fn){
    fn(3);
}
function fn2(_a){
    this.a=_a;
}
function bind(fn,obj){
   var fn1=function(){
       fn.apply(obj,Array.from(arguments));
   }
   return fn1;
}
var obj={};
var fns=bind(fn2,obj);
fn1(fns);
console.log(obj);//{a:3}

ケース：匿名のコールバック関数は、この点を変更するには

var obj={
 b:2,
    a:function(){
        setTimeout(function(){
            console.log(this.b);//this指向window
        },100)
        setTimeout((function(){
            console.log(this.b);//this指向obj
        }).bind(this),100)
        this.bindHandler=this.clickHandler.bind(this)
        //监听事件
        document.addEventListener("click",this.bindHandler);
    },
    clickHandler:function(e){
        console.log(this.b);//this指向Obj
        //解除事件监听
        document.removeEventListener("click",this.bindHandler);
    }
}
obj.a();

コール（）適用（）バインド（）の違い

• これらは、機能的に差がない、この点は、メインメソッドの異なる実装における差分嘘とパラメータ渡しを変更されています。電話して適用する方法を呼び出した直後に実行されます。しかし、バインド・コールの後に元の関数に復帰、再び呼ばれる実行する必要があります。
• 異なる文言：
• 機能は.call（オブジェクト、ARG1、ARG2 ...）
• .Apply関数（オブジェクト、[ARG1、ARG2 ...]）
• VAR FN =機能.bind（オブジェクト、ARG1、ARG2 ...）