箭頭函數(shù)

• 箭頭函數(shù)一個(gè)重要的好處就是對(duì)于this對(duì)象指向問(wèn)題，在普通函數(shù)中this對(duì)象的指向是可變的，所以在普通函數(shù)中this對(duì)象可能會(huì)存在null的情況，但是箭頭函數(shù)中this是固定的。
• this指向定義時(shí)所在對(duì)象的作用域而不是使用時(shí)的。
• 關(guān)于使用

  //箭頭函數(shù)
  press0 = () => {
    this.setState({
      data0: "0被點(diǎn)擊了"
    })
  };

• 調(diào)用（以下區(qū)別：調(diào)用時(shí)是否加（））
  • (1) 正確：不被立即執(zhí)行
    正確的方式應(yīng)該不在render的時(shí)候立即執(zhí)行。因此正確調(diào)用方法如下，同時(shí)，箭頭函數(shù)將一個(gè)函數(shù)賦值給press0變量，變量在調(diào)用的時(shí)候自然不需要加（）

 <Text
  style={styles.text}
  onPress={this.press0}>{this.state.data0}</Text>

• (2) 錯(cuò)誤：被立即執(zhí)行
  {/*下面的調(diào)用方法錯(cuò)誤，原因：下面的調(diào)用方式導(dǎo)致onPress事件直接被調(diào)用press0方法修改了state，
  由于state被修改，頁(yè)面被重新渲染，再次直接調(diào)用press0形成循環(huán)
  */}

 <Text
  style={styles.text}
  onPress={this.press0()}>{this.state.data0}</Text>

普通函數(shù)

普通函數(shù)的無(wú)參與有參的調(diào)用方式相同。注意的是有參的函數(shù)使用bind方式傳遞參數(shù)時(shí)this必須在最前面。

調(diào)用方式

(1) 箭頭方式

onPress={() => this.press1()}

(2) bind方式

  onPress={this.press2.bind(this)}

無(wú)參

// 一般方法（無(wú)參）

  press1() {
    this.setState({
      data1: "1被點(diǎn)擊了"
    })
  };

  press2() {
    this.setState({
      data2: "2被點(diǎn)擊了"
    })
  };

調(diào)用
（1）正確：不被立即執(zhí)行

    <Text
      style={styles.text}
      onPress={() => this.press1()}
    >{this.state.data1}</Text>

    <Text
      style={styles.text}
      onPress={this.press2.bind(this)}
    >{this.state.data2}</Text>

(2)錯(cuò)誤：被立即執(zhí)行
錯(cuò)誤原因：同上render渲染被循環(huán)調(diào)用

<Text
    style={styles.text}
    onPress={this.press1()}>
{this.state.data1}</Text>

有參
//一般方法（有參）

  press3(x) {
    this.setState({
      data3: x
    })
  };

  press4(x) {
    this.setState({
      data4: x
    })
  };

調(diào)用：
（1）正確：不被立即執(zhí)行

        <Text
          style={styles.text}
          onPress={this.press3.bind(this, 2222)}
        >{this.state.data3}</Text>
        <Text
          style={styles.text}
          onPress={()=>this.press4(2222)}
        >{this.state.data4}</Text>

（2）錯(cuò)誤：被立即執(zhí)行

  press5 = (x) => {
    this.setState({
      data5: x
    })
  };

  <Text
    style={styles.text}
    onPress={this.press5(2222)}>{this.state.data5}</Text>

————————————————
版權(quán)聲明：本文為CSDN博主「danfengw」的原創(chuàng)文章，遵循CC 4.0 BY-SA版權(quán)協(xié)議，轉(zhuǎn)載請(qǐng)附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/danfengw/article/details/80840060