博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
解构赋值,reset参数,扩展运算符,class,import、export
阅读量:6678 次
发布时间:2019-06-25

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

  还是来用react了。前端框架都研究看看。这次网站就用它来做了。因为angular使用的ts,所以一些es6的规则也不是很清晰,都摘抄在下。

  es6允许按照一定模式从数组和对象中提取值,对变量进行赋值,这被称为解构。

  let [a,b,c]=[1,2,3];a//1 b//2

  对象解构:

  let name ='a';

  let age=18;

  let per={name,age};

  per//obj{name : 'a' ,age : 18}

  对象相反解构:

  let per={name:'a' , age:18};

  let {name ,age}=per;

  name//'a'

  age//18

  对象参数解构:

  function sum({x,y}){

    return x+y;

  }

  sum({x:1,y:2}); //3

  对象解构在这里让我感到比较困惑,以前得这种对象解构,赋值只会写成let name=per.name,现在直接将值赋予变量。对象参数解构中,直接传入对象,而不是对象的值,而在方法中直接使用对象的值,这个是不是应该和对象中得参数名相同才可以这样做,做个实验:

function sum({            x,            y        }) {            return x + y;        }            alert(sum({                a: 1,                b: 2            })); //NAN

  这样是不可以的,也就是解构过程会直接引用传入对象的相对应参数的值,假如没有对应参数,是没有值的。

  reset参数

  es6引入rest参数(形式为...变量名)用于获取函数的多余参数,以代替arguments对象的使用。rest参数是一个数组,数组中的元素是多余得参数。reset参数之后不能再有其他参数。

function t1(l1,...l2){  console.log(l2);  }t1(1,2,3,4)//[2,3,4]

  reset参数也用在小程序的模块数据绑定中:<template is="msgItem" data="{

{...item}}"/>

  扩展运算符

  扩展运算符是三个点(...),它将一个数组转为用逗号分隔的参数序列,类似于reset参数的逆运算。扩展运算符还常用于合并数组以及与解构赋值结合使用。

function test1(){            let ar1=[1,2];            let ar2=[3,4];            let ar3=[5,6];            let ar4=[...ar1,...ar2,...ar3];            return ar4;        }        console.log(test1());//[1,2,3,4,5,6]

  class

  ES6引入了class这个概念,新的class写法让对象原型的写法更加清晰,也更像传统的面向对象编程语言的写法。class之间可以通过extends关键字实现继承。

  import、export

  ES6实现了自己的模板化标准,ES6模块功能主要由两个关键字构成:export和import。export用于规定模块对外暴露的借口,Import用于引入其他模块提供的接口。

  看完之后,感觉越来越需要看一下阮一峰老师写的ES6了。行吧。加油。

  

转载于:https://www.cnblogs.com/wlxll/p/9157245.html

你可能感兴趣的文章
盘点互联网巨头奉献的十大开源安全工具[转]
查看>>
UISegmentedControl
查看>>
FileUtils工具类的使用
查看>>
VS2010 + WinDDK 搭建驱动开发环境(转)
查看>>
程序员找不女朋友的原因
查看>>
[摘录]第3章 终局谈判策略
查看>>
react-router中的路由钩子使用
查看>>
C#编程之“串口通讯多次接收”
查看>>
【python 文件操作】python 文件操作
查看>>
线程相关
查看>>
linux下svn服务器配置问题
查看>>
《自我介绍》
查看>>
【C语言】20-static和extern关键字2-对变量的作用
查看>>
使用mpvue开发github小程序总结
查看>>
用表格给表单定位
查看>>
Redis
查看>>
Intent-filter的介绍
查看>>
开博说明
查看>>
Scala方法定义,方法和函数的区别,将方法转换成函数
查看>>
Hbase 读写 原理
查看>>