ES6
Steven--Lee
这个作者很懒,什么都没留下…
展开
-
三分钟搞懂es6 Symbols
一、描述Symbols是JavaScript在es6版本新引入的一种基本数据类型,其中每个从Symbol()返回的symbol值都是唯一的。二、基本用法给user对象添加一个唯一的keyconst id = Symbol('id')let user = { value: '999', id: '001', [id]: 1001}console.log(user) /...原创 2020-04-06 16:50:34 · 5614 阅读 · 0 评论 -
generator-yield(es6)入门系列
一、概念generator函数是一种执行过程中可暂停的函数。比如在一个函数中需要发起一次ajax请求,在请求之后再向下执行,这种场景我们可以使用generator函数。二、语法1. 定义函数generator英文翻译为构造器的意思,可以将一个generator函数理解为多个普通函数构成的函数function * nice () { console.log(1) yield ...原创 2019-06-09 22:19:27 · 651 阅读 · 0 评论 -
rgb颜色与16进制颜色相互转化函数-javascript
rgb颜色转化为16进制颜色传入rgb颜色(数组类型),将会得到16进制颜色的字符串当传入的数值不符合规范,将会返回字符串Invalid data/** * @param rgb [] * @returns {string} * * eg. * input: [220,20,60] * output: #dc143c */const convertRGBToHex ...原创 2018-07-07 20:25:27 · 2316 阅读 · 0 评论 -
箭头函数中优雅的使用this
箭头函数ES6标准新增了一种新的函数:Arrow Function,叫箭头函数这个名字是因为定义它就是用一个箭头。众所周知,箭头函数中不会默认绑定外层的this了,所以大多数人的用法都是不在箭头函数中使用this关键字了。今天在重构一段es5代码时突然感觉有点不太方便,于是就有了本文,如何优雅的在箭头函数中使用this关键字。箭头函数中使用this简单的说就是在调用箭头函数时绑...原创 2018-05-14 18:07:59 · 961 阅读 · 0 评论 -
JavaScript中class类的三种方法详解(静态方法、普通方法与构造方法)
在js的类中,可分为三种方法,constructor构造方法、静态方法与普通方法。一、constructor构造方法1.概念类的作用在于构建对象,而constructor构造方法就是用于构建对象实例。2.使用方法在使用new关键字生成对象时,constructor方法会被执行,最终return的结果就是生成的对象实例。当一个类没有constructor方法时会自...原创 2018-04-18 22:13:08 · 16283 阅读 · 0 评论 -
功能强大的扩展运算符 [...]
主要介绍扩展运算符...是es6的一种新特性(当然现在es6也不算新啦),作用是将一个数组转化为用逗号分隔的参数序列。 用了几次这个es6新特性后发现这个方法真的很强大很实用,于是在下面总结了一些比较实用的功能。使用语法扩展运算符之后可以直接跟一个数组或者是小括号括起来的一个表达式,甚至可以是一个函数,但是函数的返回值必须是一个数组。console.log(...[1...原创 2018-03-22 01:08:38 · 774 阅读 · 0 评论 -
一行代码实现输入框的全选反选
先说句题外话,使用了es6的新语法让我们可以写出更简洁高效的代码,当然相对于习惯老版本的写法的童鞋来说看起来很反人类。开始我也是这么觉得,但是后来逐渐熟悉了这些语法我才发现这么写真的很爽。核心代码const selectAll = () => [...$('.index')].map(v => v.checked = $('#selectAll').checked);看...原创 2018-03-23 01:07:45 · 836 阅读 · 0 评论 -
es6-class初体验
class简介class(类)作为对象的模板,可用于定义类(底层实现仍然是原型机制)。以下是定义一个Point类的es5、es6写法对比。基础用法es5function Point(x, y) { this.x = x; this.y = y;}Point.prototype.toString = function () { return '('原创 2018-01-07 19:44:06 · 526 阅读 · 0 评论 -
canvas高级验证码
直接上代码,canvas与原生实现的高级验证码,无法复制选中拖拽以及获取标签内元素来获取验证码的值.function showCheck(){var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); ctx.clearRect(原创 2017-01-17 23:21:11 · 2461 阅读 · 0 评论 -
es6-set简介
Set简介Set:ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。成员唯一可直接传入数组无隐式类型转换(set中,数字5和字符串’5’是两个值)原创 2017-12-29 01:02:11 · 513 阅读 · 0 评论 -
es6-map简介
map简介JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键。Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。原创 2017-12-29 00:57:00 · 2862 阅读 · 0 评论 -
es6 Destructuring(解构)
简介ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring);一、解构赋值1. 基本示例//ES5var a=1, b=2, c=3;//ES6 数组let [a,b,c]=[1,2,3];/*es6 对象*对象解构赋值时需注意*被赋值的部分也是个复杂对象时,取值需使用冒号后边那个值原创 2017-12-27 16:13:51 · 1441 阅读 · 0 评论 -
关于es6的一些常用关键字以及set与数组的操作
因为一个数组取差集的需求,搜索答案中顺便学习了下es6的新语法,自己总结了下,感觉很有意义,希望对您有所帮助。首先介绍下let,与var类似,但用let声明的变量的作用域只是外层块,而不是整个外层函数。 以下代码中还用到了set(一群值的集合,与数组类似)。//let setOfWords1 = new Set([1, 2, 3]);//let setOfWords2 = new Set([3,原创 2017-04-26 16:32:08 · 3828 阅读 · 0 评论