es6学习笔记(四)箭头函数

简介: es6学习笔记(四)箭头函数

es6中出现了一种新的语法,箭头函数,我们学习的时候需要注意两点,一个是写法,另外一个是使用的场景,写法比较简单就是一个符号=>这就代表着箭头的意思,教程里这样定义箭头函数

参数 => 函数体

这是一种写法

如果函数体有多行代码需要用大括号包裹起来

适应场景是在回调函数中,如果不使用箭头函数,我们经常需要这样定义

var that = this

笔者在学习小程序开发的时候,在官方的视频教程里经常出现这种语法,当时不知道为啥会有这种操作,后来用的熟练了也就理解了,给一个实际的案例

createData() {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
          this.temp.author = 'vue-element-admin'
          this.temp.status = '待支付'
          this.temp.no = parseTime(new Date(), '{y}{m}{d}') + (++this.total).toString().padStart(5, '0')
          this.$cloudbase.database().collection('order').add({
            no: this.temp.no,
            name: this.temp.name,
            telphone: this.temp.telphone,
            address: this.temp.address,
            items: this.products,
            totalprice: this.temp.totalprice,
            discountprice: this.temp.discountprice,
            status: this.temp.status,
            createdate: new Date()
          }).then((res) => {
            this.temp._id = res.id
            this.list.unshift(this.temp)
            this.dialogFormVisible = false
            this.$notify({
              title: '提示信息',
              message: '新增成功',
              type: 'success',
              duration: 2000
            })
            this.fetchData()
          }).catch((e) => {})
        }
      })
    }

箭头函数的用处就是为了在回调里继续使用this,只需要记住这一点会用就可以,当然他还有很多知识点,但是作为实用主义的我来说,不细究,学会用就可以了。

相关文章
|
2月前
ES6之箭头函数
ES6之箭头函数
|
2月前
|
网络架构
ES6箭头函数的特性
ES6箭头函数的特性
|
4月前
Es6箭头函数
Es6箭头函数
36 0
|
4月前
|
自然语言处理 前端开发 安全
【面试题】ES6语法五之箭头函数
【面试题】ES6语法五之箭头函数
|
5月前
|
JSON JavaScript 数据格式
ES6箭头函数和模板字符串
ES6箭头函数和模板字符串
25 0
|
6月前
|
前端开发
ES6系列笔记-箭头函数
ES6系列笔记-箭头函数
17 1
|
10月前
|
自然语言处理 JavaScript
ES6中的箭头函数及其使用场景
ES6 (ECMAScript 2015) 引入了许多新特性,其中之一就是箭头函数。箭头函数是一种更加简洁和便捷的函数定义方式,本文将详细介绍 ES6 中的箭头函数,并探讨其适用场景及注意事项。
|
11月前
【ES6】 箭头函数
【ES6】 箭头函数
32 0
|
网络架构
ES6箭头函数总结
ES6箭头函数总结
ES6箭头函数总结
ES6 从入门到精通 # 05:函数之扩展运算符、箭头函数
ES6 从入门到精通 # 05:函数之扩展运算符、箭头函数
41 0
ES6 从入门到精通 # 05:函数之扩展运算符、箭头函数