51dev.com IT技术开发者社区

51dev.com 技术开发者社区

ES6

Vue(1)- es6的语法、vue的基本语法、vue应用示例,vue基础语法

Vue(1)- es6的语法、vue的基本语法、vue应用示例,vue基础语法

一、es6的语法1、let与var的区别  ES6新增了let命令,用来声明变量。它的用法类似于var(ES5),但是所声明的变量,只在let命令所在的代码块内有效。如下代码:{  leta=10;  varb=1;}a//ReferenceError:aisnotdefined.b//1  上面代码在代码块之中,分别...

用es6的Array.reduce()方法计算一个字符串中每个字符出现的次数

用es6的Array.reduce()方法计算一个字符串中每个字符出现的次数

有一道经典的字符串处理的问题,统计一个字符串中每个字符出现的次数。用es6的Array.reduce()函数配合“...”扩展符号可以更方便的处理该问题。 s='abananbaacnncn'[...s].reduce((res,c)=>{res[c]?res[c]++:res[c]=1;returnr...

ES6,Array.includes()函数的用法

ES6,Array.includes()函数的用法

在ES5,Array已经提供了indexOf用来查找某个元素的位置,如果不存在就返回-1,但是这个函数在判断数组是否包含某个元素时有两个小不足,第一个是它会返回-1和元素的位置来表示是否包含,在定位方面是没问题,就是不够语义化。另一个问题是不能判断是否有NaN的元素。constarr1=['a','b','c','d'...

ES6,数组遍历

ES6,数组遍历

ES6提供了entries(),keys(),values()方法返回数组的遍历器,对于遍历器(Iterator)可以使用for...of进行便利,也可是使用entries()返回的遍历器Iterator.next()方法进行遍历。 1.使用keys()遍历。keys()返回的是数组元素索引号的遍历器。con...

ES6,Array.fill()函数的用法

ES6,Array.fill()函数的用法

ES6为Array增加了fill()函数,使用制定的元素填充数组,其实就是用默认内容初始化数组。该函数有三个参数。arr.fill(value,start,end)value:填充值。start:填充起始位置,可以省略。end:填充结束位置,可以省略,实际结束位置是end-1。 例如:1.采用一默认值填初始化...

ES6,Array.find()和findIndex()函数的用法

ES6,Array.find()和findIndex()函数的用法

ES6为Array增加了find(),findIndex函数。find()函数用来查找目标元素,找到就返回该元素,找不到返回undefined。findIndex()函数也是查找目标元素,找到就返回元素的位置,找不到就返回-1。他们的都是一个查找回调函数。[1,2,3,4].find((value,index,arr)...

ES6,Array.copyWithin()函数的用法

ES6,Array.copyWithin()函数的用法

ES6为Array增加了copyWithin函数,用于操作当前数组自身,用来把某些个位置的元素复制并覆盖到其他位置上去。Array.prototype.copyWithin(target,start=0,end=this.length)该函数有三个参数。target:目的起始位置。start:复制源的起始位置,可以省略...

ES6,Array.of()函数的用法

ES6,Array.of()函数的用法

ES6为Array增加了of函数用已一种明确的含义将一个或多个值转换成数组。 因为,用newArray()构造数组的时候,是有二意性的。构造时,传一个参数,表示生成多大的数组。构造时,传多个参数,每个参数都是数组的一个元素。constarr1=newArray()constarr2=newArray(5)co...

ES6,Array.from()函数的用法

ES6,Array.from()函数的用法

ES6为Array增加了from函数用来将其他对象转换成数组。当然,其他对象也是有要求,也不是所有的,可以将两种对象转换成数组。1.部署了Iterator接口的对象,比如:Set,Map,Array。2.类数组对象,什么叫类数组对象,就是一个对象必须有length属性,没有length,转出来的就是空数组。 ...

ES6,扩展运算符的用途

ES6,扩展运算符的用途

ES6的扩展运算符可以说是非常使用的,在给多参数函数传参,替代Apply,合并数组,和解构配合进行赋值方面提供了很好的便利性。扩展运算符就是三个点“...”,就是将实现了Iterator接口的对象中的每个元素都一个个的迭代并取出来变成单独的被使用。看这个例子:console.log(...[3,4,5])结果:345调...

ES6,新增数据结构Map的用法

ES6,新增数据结构Map的用法

Javascript的Object本身就是键值对的数据结构,但实际上属性和值构成的是”字符串-值“对,属性只能是字符串,如果传个对象字面量作为属性名,那么会默认把对象转换成字符串,结果这个属性名就变成”[objectObject]“。ES6提供了”值-值“对的数据结构,键名不仅可以是字符串,也可以是对象。它是一个更完善...

ES6,新增数据结构WeakSet的用法

ES6,新增数据结构WeakSet的用法

WeakSet和Set类似,同样是元素不重复的集合,它们的区别是WeakSet内的元素必须是对象,不能是其它类型。特性:1.元素必须是对象。添加一个number类型的元素。constws=newWeakSet()ws.add(1)结果是报类型错误。TypeError:Invalidvalueusedinweakset&...

ES6,新增数据结构Set的用法

ES6,新增数据结构Set的用法

ES6提供了新的数据结构Set。 特性似于数组,但它的一大特性就是所有元素都是唯一的,没有重复。我们可以利用这一唯一特性进行数组的去重工作。单一数组的去重。letset6=newSet([1,2,2,3,4,3,5])console.log('distinct1:',set6)结果:distinct1:Set...

利用babel-cli搭建支持ES6的node环境

利用babel-cli搭建支持ES6的node环境

现在ES6盛行,开始大量使用ES6的特性敲代码,但限于Node.js本身对ES6的特性支持的不够完备,那么需要借助于其他工具来完成。基本上,现在都直接写ES6的代码,然后使用babel-cli提供的babel转换成ES5或者使用babel-node直接运行ES6的代码。 安装执行命令,全局安装babel-cl...

利用es-checker检测当前node对ES6的支持情况

利用es-checker检测当前node对ES6的支持情况

ode.js发展非常快,对es6特性的支持也越来越良心,但node.js版本很多,各版本对es6的支持度都不一样,为了能清晰的了解各版本对es6特性的支持,需要有一个工具能提供比较清晰的支持说明,甚至于能提供在程序中调用检测对某特性的支持,帮助程序里有选择性的使用es6特性。 es-checker提供了比较好...