javascript thisとes 6矢印関数thisの理解及びcall()、apply()、bind()の使い方

18595 ワード

普通の関数で、3点を覚えてください.
関数をオブジェクトとする方法で呼び出すと、thisがオブジェクトです.
関数が単純な関数として呼び出されると、厳密なモードでは、thisはundefinedであり、厳密ではないモードではグローバルオブジェクトであり、ブラウザではwindowである.
thisは変数ではなく、ネスト関数のthisは外層からthis値を継承しません.var obj = {    func: function() {},    say: function () {      var that = this;        setTimeout(function () {        console.log(this)        that.func()        console.log(that)
     });    }  }  obj.say(); this : var obj = {  
    func: function() {},  
    say: function () {  
       // this obj  
      setTimeout(function () {  
        console.log(this)  
        this.func()  
      }.bind(this));  
    }  
  }  
  obj.say();
 
call()、apply()、bind() this !
var name=" ",age=17;
var obj={
    name:" ",
    objAge:this.age,
    myFun:function(){
        console.log(this.name+" "+this.age);
    }
}
obj.objAge
obj.myFun() -------华丽分割线---------var me={}
    name:「文」,    メッセージ:25 }obj.myFun.call/thisを私に向ける対象に当たるObj.myFun.apply Obj.myFun.bind(me)以上のbindメソッドの後ろに複数の()が出ましたが、結果は返っても同じです.これにより、bingが戻ってくるのは新しい関数であり、それを呼び出してこそ実行されると結論しました.
function func(sex){    consolie.log(sex)}func.call(私、男)func.apply(me,[男])func.bind(me,“男”)window.val = 1;  var obj = {    val: 2,    dbl: function () {      this.val *= 2;      val *= 2;      console.log(val);      console.log(this.val);    }  };  //  obj.dbl();  var func = obj.dbl;  func(); 矢印関数:
独自のthis値がなく、矢印関数内のthis値は外周作用領域から継承されます.矢印関数でthisを呼び出すと、単純にロールドメインチェーンに沿って上に探して、一番近いthisを見つけて使います.
矢印関数を定義した後、thisは変化しません.どんな方法で呼んでも、thisは変わりません.
function foo(){  this.a=1  let b=>consolie.log(this.a)  b()foo() 
function foo() {
  return () => console.log(arguments[0])
}
foo(1, 2)(3, 4) 
let a = {
  foo: 1,
  bar: () => console.log(this.foo)
}

a.bar()
let a = {
  foo: 1,
  bar: function() { console.log(this.foo) }
}

a.bar() 
function A() {
  this.foo = 1
}

A.prototype.bar = () => console.log(this.foo)

let a = new A()
a.bar()
答えは以下の通りです
http://cnodejs.org/topic/584a207a3ebad99b336b1ede
矢印関数はいつ使うべきですか?
1、矢印関数は、複雑な論理または副作用がない純粋な関数シーンに適しています.例えば、map、reduce、filterのコールバック関数定義に使用されます.2、一番外側に矢印関数を定義しないでください.関数の内部で操作すると、thisは大域作用領域を汚染しやすいからです.少なくとも矢印関数の外側には普通の関数があります.thisを可視範囲に制御します.3、最初に述べたように、矢印関数の一番魅力的なところは簡潔です.多層関数ネストがある場合は、矢印関数の簡潔性は大きく向上しておらず、逆に関数の作用範囲の識別度に影響を及ぼしているので、矢印関数の使用を推奨しない.
矢印関数にはthisがないことが分かります.その中のthisは変数によって検索されます.
function foo() {

	that = this

	this.arrow = () => { 
		console.log(this.name) 
	}

	this.simulationArrow = () => { 
		console.log(that.name) 
	}

	this.common = function() {
		console.log(this.name)
	}
}



var f = new foo()

arrow = f.arrow
simulationArrow = f.simulationArrow
common = f.common

f.name = "foo"
name = "global"

arrow() 
simulationArrow()  
common()