ES6,ES7重点介绍
1. 字符串模板
<!--旧版拼接字符串-->
var str = '我是时间:'+new Date();
<!--新版拼接字符串-->
let str = `我是时间${new Date()}`;
2. 对象简写
<!--旧版对象写法-->
var name = "liming";
var age = 20;
var person = {name:name, age:age};
<!--新版对象写法-->
let name = "liming";
let age = 20;
let person = {name, age};
3. 箭头函数
<!--旧版定时器写法-->
setTimeout(function(res){
alert(res)
},50)
采用箭头函数后的写法
setTimeout((res) => {
alert(res)
})
4. 模块化
export 导出模块
import 导入模块
5. 解构
<!--解构的作用是可以快速取得数组或对象当中的元素或属性,而无需使用arr[x]或者obj[key]等传统方式进行赋值-->
let arr = ['string', 2, 3];
//传统方式
let a = arr[0],
b = arr[1],
c = arr[2];
//解构赋值,是不是简洁很多?
let [a, b, c] = arr;
console.log(a);<!--string-->
console.log(b);<!--2-->
console.log(c);<!--3-->
<!--嵌套数组解构:-->
let arr = [[1, 2, [3, 4]], 5, 6];
let [[d, e, [f, g]], h, i] = arr;
console.log(d);<!--1-->
console.log(f);<!--3-->
console.log(i);<!--6-->
<!--函数传参解构:-->
var arr = ['string', 2, 3]
function fn1([a, b, c]) {
console.log(a);
console.log(b);
console.log(c);
}
fn1(arr);
<!--string-->
<!--2-->
<!--3-->
<!--还有好多结构方法... 这里就不详细说了-->
6. Promise
<!--为了优化异步的回调地域,也便于复用和阅读,支持链式调用-->
new Promise((resolve,reject) => {
<!--这里写逻辑来判断走resolve(走的then分支)或者reject(走的catch分支,抛出异常)-->
})
.then((res) =>{})
.catch((err) =>{})
<!--es7还添加了一个async await语法糖,来解决回调地域-->
async await 讲解
<!--这里是新加的一些最常用字符串方法-->
1. includes
<!--查看是否包含字符串,直接返回布尔值,类似于indexOf().-->
<!--includes()比indexOf()的优势在于,indexOf()的返回结果不是布尔值,须与-1对比,不够直观。-->
let s = 'Hello world!';
s.includes('o') // true
2. repeat()
<!--可能在mvc框架中经常看到这个方法-->
<!--表示重复多少次。-->
<!--如果参数是正小数,会取整。-->
<!--如果参数是负数,会报错。-->
<!--如果参数是0,会得到空串。-->
<!--如果参数是字符串、布尔型或其他类型,会先换算成整数-->
<!--这里是最新添加的一些数组方法-->
1.最常见的循环
<!--forEach()
有三个参数, 第一个参数是当前元素, 第二个参数是当前元素的索引, 第三个参数是当前元素所属的数组.-->
let array = [1, 2, 3, 4];
array.forEach((item, index, arr) => {
console.log(item);
});
<!--map()-->
<!--map()的参数和forEach()是一样的-->
<!--map()不会改变原数组,-->
let array = [1, 2, 3, 4 ,5];
let temp = array.map((item, index, arr) => {
return item + 1;
});
<!--如果map循环里不return一个值的话,效果跟forEach()完全一样;-->
<!--如果map循环里return值的话会返回经过处理的新数组-->
<!--下面可以看到批量处理数据是非常方便快捷的-->
let array = [{name:'liming'},{name:'zhangsan'},{name:'wangwu'}]
let newArray = array.map((item, index, arr) => {
return {'姓名':`${item.name}***`}
})
console.log(newArray);<!-- [{'姓名':'liming***'},{'姓名':'zhangsan***'},{'姓名':'wangwu***'}]-->
<!--some()-->
<!--遍历数组的每一项, 然后根据循环体内的条件去判断, 只要有一个是true, 就会停止循环.-->
<!--应用场景比如判断学生成绩有没有不及格的,有的话循环停止,节省时间-->
let array = [100, 25, 35, 98, 67];
array.some((item, index, arr) => {
return item < 60 ;
});
<!--到第二次即能判断出来结果,循环两次即结束-->
2.filter
<!--类似于map-->
let array = [1, 2, 3, 4, 5];
let temp = array.filter((item, index, arr) => {
return item > 3;
});
console.log(temp);
console.log(array);
3.reduce
<!--reduce(),这个东西用的好的话可以省很多事,这个为一个累加器,类似于之前封装的回调函数,不明白的话看看下面写法就懂了-->
<!--它有4个参数, 按顺序分别是 上一次的值, 当前的值, 当前值的索引, 数组-->
let array = [1, 2, 3, 4, 5];
let total = array.reduce((a, b) => {
return a + b;
});
console.log(total); <!-- 15 -->
4. 还有类似于array.keys(),array.values()等就不多说了
ES6,ES7重点介绍的更多相关文章
- webpack 兼容低版本浏览器,转换ES6 ES7语法
ES6,ES7真的太棒了,async +await+Promise,让我阅读代码的时候不用再从左拉到右了(异步太多,一层套一层真的太头痛) 但是有个问题,打包后低版本浏览器运行不了,还有我用了一些混淆 ...
- 消息队列介绍、RabbitMQ&Redis的重点介绍与简单应用
消息队列介绍.RabbitMQ&Redis的重点介绍与简单应用 消息队列介绍.RabbitMQ.Redis 一.什么是消息队列 这个概念我们百度Google能查到一大堆文章,所以我就通俗的讲下 ...
- node mysql es6/es7改造
本文js代码采取了ES6/ES7的写法,而不是commonJs的写法.支持一波JS的新语法.node版本的mysql驱动,通过npm i mysql安装.官网地址:https://github.com ...
- jmockit使用总结-MockUp重点介绍
公司对开发人员的单元测试要求比较高,要求分支覆盖率.行覆盖率等要达到60%以上等等.项目中已经集成了jmockit这个功能强大的mock框架,学会使用这个框架势在必行.从第一次写一点不会,到完全可以应 ...
- es7重点笔记
1,函数绑定运算符,用来取代call,apply,bind调用,写法:并排的双冒号(::),左边是对象,右边是函数 foo :: bar; // 等同于bar.bind(foo); 双冒号返回的还是原 ...
- es6,es7,es8
概述 ES全称ECMAScript,ECMAScript是ECMA制定的标准化脚本语言.目前JavaScript使用的ECMAScript版本为ECMAScript-262. ECMAScript 标 ...
- es6/es7/es8常用新特性总结(超实用)
本文标题有误导性,因为我其实想写node8的新特性,说实话一下子从node v1.x跳跃到node 8.x+ 真有点受宠若惊的感觉.一直觉得node 数组. 对象.序列等的处理没有python方便,因 ...
- .NET:“事务、并发、并发问题、事务隔离级别、锁”小议,重点介绍:“事务隔离级别"如何影响 “锁”?
备注 我们知道事务的重要性,我们同样知道系统会出现并发,而且,一直在准求高并发,但是多数新手(包括我自己)经常忽略并发问题(更新丢失.脏读.不可重复读.幻读),如何应对并发问题呢?和线程并发控制一样, ...
- JavaScript ES6新特性介绍
介绍 ES6:ECMScript6 首先,一个常见的问题是,ECMAScript 和 JavaScript 到底是什么关系? ECMAScript是一个国际通过的标准化脚本语言: JavaScript ...
随机推荐
- PHP核心编程--文件上传(包含多文件上传)
一.单文件上传 图片上传界面: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- Data Lake Analytics中OSS LOCATION的使用说明
前言 Data Lake Analytic(后文简称 DLA)可以帮助用户通过标准的SQL语句直接对存储在OSS.TableStore上的数据进行查询分析. 在查询前,用户需要根据数据文件的格式和内容 ...
- onethink 返回上一页
// 记录当前列表页的cookie Cookie('__forward__',$_SERVER['REQUEST_URI']); $this->success('操作成功!',Co ...
- python 数据的写入
- @topcoder - 2017TCOAlgorithmRound2A - D1L2@ DistanceZeroAndOne
目录 @description@ @solution@ @accepted code@ @details@ @description@ 一个 n 个点的无向简单的连通图,编号从 0 到 n-1. 现给 ...
- 从零学React Native之05混合开发
本篇文章,我们主要讨论如何实现Android平台的混合开发. RN给Android端发送消息 首先打开Android Studio, Open工程, 在React Native项目目录下选择andro ...
- MySQL_分库分表
分库分表 数据切分 通过某种特定的条件,将我们存放在同一个数据库中的数据分散存放到多个数据库(主机)上面,以达到分散单台设备负载的效果.数据的切分同时还能够提高系统的总体可用性,由于单台设备Crash ...
- 通过GDB重新获得进程的输出
有时通过SecureCRT或者Putty远程ssh到主机上执行某个进程,因长时间没有交互导致ssh断链,此时该进程由init进程收留.该进程的输出也就无法获得了. 这种情况下,可以利用gdb重新获得该 ...
- 使用git和sourcetree提交代码的一些问题
今天遇到的几个坑算是解决了1.开始不能用指令提交,可以执行git add命令前添加gitdir=$(git rev-parse --git-dir); scp -p -P 29418 wangtao1 ...
- poj 3528 Ultimate Weapon (3D Convex Hull)
3528 -- Ultimate Weapon 一道三维凸包的题目,题目要求求出三维凸包的表面积.看懂了网上的三维凸包的代码以后,自己写的代码,跟网上的模板有所不同.调了一个晚上,结果发现错的只是数组 ...