博客
关于我
ES6 函数模块(四)
阅读量:295 次
发布时间:2019-03-03

本文共 1350 字,大约阅读时间需要 4 分钟。

参数默认值

使用

在书写形参时,直接给形参赋值,附的值即为默认值

这样一来,当调用函数时,如果没有给对应的参数赋值(给它的值是undefined),则会自动使用默认值。

[扩展]对arguments的影响

只要给函数加上参数默认值,该函数会自动变量严格模式下的规则:arguments和形参脱离

[扩展]留意暂时性死区

形参和ES6中的let或const声明一样,具有作用域,并且根据参数的声明顺序,存在暂时性死区。

剩余参数

arguments的缺陷:

  1. 如果和形参配合使用,容易导致混乱
  2. 从语义上,使用arguments获取参数,由于形参缺失,无法从函数定义上理解函数的真实意图

ES6的剩余参数专门用于手机末尾的所有参数,将其放置到一个形参数组中。

语法:

function (...形参名){   }

细节:

  1. 一个函数,仅能出现一个剩余参数
  2. 一个函数,如果有剩余参数,剩余参数必须是最后一个参数

展开运算符

使用方式:...要展开的东西

对数组展开 ES6

const arr1 = [1,2,3,1];const arr2 = [...arr1]

对对象展开 ES7

const obj2 = {           ...obj1,        address: {             ...obj1.address,        },        loves: [...obj1.love, "yy5"],      };      console.log(obj2);      console.log(obj1 === obj2);      const arr1 = [3, 67, 8, 5];

明确函数的双重用途

ES6提供了一个特殊的API,可以使用该API在函数内部,判断该函数是否使用了new来调用

new.target //该表达式,得到的是:如果没有使用new来调用函数,则返回undefined//如果使用new调用函数,则得到的是new关键字后面的函数本身

箭头函数

回顾:this指向

  1. 通过对象调用函数,this指向对象
  2. 直接调用函数,this指向全局对象
  3. 如果通过new调用函数,this指向新创建的对象
  4. 如果通过apply、call、bind调用函数,this指向指定的数据
  5. 如果是DOM事件函数,this指向事件源

使用语法

箭头函数是一个函数表达式,理论上,任何使用函数表达式的场景都可以使用箭头函数

完整语法:

(参数1, 参数2, ...)=>{       //函数体}

如果参数只有一个,可以省略小括号

参数 => {   }

如果箭头函数只有一条返回语句,可以省略大括号,和return关键字

参数 => 返回值

注意细节

  • 箭头函数中,不存在this、arguments、new.target,如果使用了,则使用的是函数外层的对应的this、arguments、new.target
  • 箭头函数没有原型
  • 箭头函数不能作用构造函数使用

应用场景

  1. 临时性使用的函数,并不会可以调用它,比如:
    1. 事件处理函数
    2. 异步处理函数
    3. 其他临时性的函数
  2. 为了绑定外层this的函数
  3. 在不影响其他代码的情况下,保持代码的简洁,最常见的,数组方法中的回调函数

转载地址:http://qnlm.baihongyu.com/

你可能感兴趣的文章
修复苹果Mac中的快速视频播放错误的方法
查看>>
苹果HomePod智能音箱怎么使用广播功能?
查看>>
Mac系统投屏到电视机的方法
查看>>
【Docker&ARM】ARM架构服务器上docker的安装
查看>>
【Tinyproxy】CentOS7.X http代理tinyproxy的安装配置与使用
查看>>
php-foreach遍历一维数组
查看>>
php--自定义错误处理函数的使用方法
查看>>
php--异常处理主动抛出异常的使用方法
查看>>
php--简易的相册1
查看>>
php---xml基础知识
查看>>
php--class static
查看>>
php--匿名函数的使用
查看>>
php--json_decode
查看>>
php--class的工厂模式的示例
查看>>
php--模拟调用接口的代码
查看>>
php教程--案例20(用户登录)
查看>>
php教程--案例29(文件上传类)
查看>>
jQuery练习t76
查看>>
jQuery练习t78
查看>>
jQuery练习t79
查看>>