babel lsit
提案 stage4

ES3

ES5(2009年12月)

浏览器支持
Firefox 4
Safari 5.1 不支持 Function.prototype.bind
Chrome 13
IE9不支持严格模式, 其它都可以
IE10和其他主流浏览器都支持了
PC端开发需要注意IE9以下的兼容, 但移动端开发时不需要
IE8只支持部分方法,需要使用es5-shim.
IE8 几乎不支持 ES5,但支持Object.defineProperty, Object.getOwnPropertyDescriptor, JSON 解析和通过索引访问字符串(‘abcd’[1])

严格模式

使用use strict开启严格模式。
1. 消除不安全之处,保证安全运行
2. 提升编译效率
3. 未来发展趋势
严格模式下: 规则:
1)变量先定义在使用
2)不允许变量重名

var a=1;
function a(){}

3)不允许使用eval
4)不允许delete
5)不允许with语句

var sMessage = "hello";
with(sMessage) {alert(toUpperCase());}

JSON

JSON.parse、JSON.stringify

数组方法

every、some、forEach、filter、indexOf、lastIndexOf、map、reduce、reduceRight
Array.isArray

Object方法

Object.getPrototypeOf

Object.create

Object.getOwnPropertyNames

方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组。

Object.defineProperty

Object.defineProperty(object1, 'property1', {value: 42,writable: false
});

Object.getOwnPropertyDescriptor
获取对象的修饰符

Object.defineProperties

Object.defineProperties(obj, {'property1': {value: true,writable: true},'property2': {value: 'Hello',writable: false}// etc. etc.
});

Object.keys
Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致 。

Object.preventExtensions / Object.isExtensible
禁止扩展,对象不可以新增属性。

Object.seal / Object.isSealed
seal 之后的对象,不可以新增,删除属性,也不可以将其修改为访问器属性,只可以修改属性值
Object.freeze / Object.isFrozen
freeze 之后的对象什么都不可以改

for…in
以任意顺序遍历一个对象的除Symbol以外的可枚举属性。for…in不应该用于迭代一个关注索引顺序的 Array。
会遍历对象原型上的可枚举属性,如果需要只循环对象自身属性,那么使用 getOwnPropertyNames() 或执行 hasOwnProperty() 来判断某属性是否是对象本身。

var t = {a:12,b:55};
t.hasOwnProperty('a'); // true
Object.getOwnPropertyNames(t); // ['a', 'b']
for(temp in t){console.log(temp); // a b
}
//
var t = [1,2,3];
for(temp in t){console.log(temp); // 0 1 2
}
//
for(temp in 'abcd'){console.log(temp); // 0 1 2 3
}

ES6(ECMAScript 2015)

  从这个版本开始,规范命名按照年份命名。至于我们还在说的ES7,ES8什么的应该只是大家按照习惯继续增加而已,实际上标准是按照年份命名的,每年的标准在6月份获准生效。我们在配置babel指定版本的时候需要写成es2017,而不能写成ES8什么的。

(1)块作用域 - let

(2)常量 - const

(3)解构数组 - Array Destructuring

(4)解构对象 - Object Destructuring

(5)模板字符串 - Template Strings

(6)展开操作符

(7)剩余操作符

(8)解构参数

(9)箭头函数

(10)对象表达式

(11)对象属性名

(12)对比两个值是否相等

(13)把对象的值赋值到另一个对象中

(14)设置对象的prototype属性

(15)原型 - proto

(16)supper

(17)迭代器

(18)class类

(19)get set

(20)静态方法

(21)继承

(22)模块化

(23) for…of
在可迭代对象上创建循环,

var t = [1,2,3];
for(temp of t){console.log(temp); //  1 2 3
}
//
for(temp in 'abcd'){console.log(temp); // a b c d
}

ES2016(ECMAScript 2016)

  1. Array.prototype.includes()
  2. 指数运算符 ** 和 Math.pow() 类似 12 ** 3 === Math.pow(12,3) 都等于8.

ES2017(ECMAScript 2017)

String padding

padStart 和 padEnd 将字符串填充到指定长度

'es8'.padStart(5);          // '  es8'
'es8'.padStart(6, 'woof');  // 'wooes8'
'es8'.padStart(14, 'wow');  // 'wowwowwowwoes8'

Object.values and Object.entries

ES5 引入了Object.keys方法,返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历( enumerable )属性的键名。
Object.values方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历( enumerable )属性的键值。
Object.entries方法返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历( enumerable )属性的键值对数组

Async/Await

Object.getOwnPropertyDescriptors

批量获取修饰符

函数参数和函数调用中的尾逗号

当我们在函数参数列表后面加上不必要的逗号,函数参数中的尾逗号可以让编辑器不再抛出错误。

function es8(var1, var2, var3,) {
// …
}
像函数声明中的那样,也可以应用到函数的调用:

es8(10, 20, 30,);
这个特性是从对象和数组的字面量的尾逗号中受到启发, [10, 20, 30,] 和 { x: 1, }。

共享内存和原子

ES2018(ECMAScript 2018)

for await of

Object Rest Spread

const input = {a: 1,b: 2,c: 1
}
const output = {...input,c: 3
}
console.log(output) // {a: 1, b: 2, c: 3}

Promise.prototype.finally()

4.新的正则表达式特性

ES9为正则表达式添加了四个新特性,进一步提高了JavaScript的字符串处理能力。这些特点如下:

s (dotAll) 标志
命名捕获组
Lookbehind 后行断言
Unicode属性转义

ES2019(ECMAScript 2019)

Array.prototype.flat()
抹平数组,可指定深度,默认为1
Array.prototype.flatMap()
抹平一层数组,并调用map方法。
Object.fromEntries()
Object.entries 的反操作
String.trimStart 和 String.trimEnd
移除字符串前后空格 trimLeft()和trimRight() 是对应方法的别名
try…catch
catch后面的参数可选
Symbol.prototype.description
获取Symbol的描述字符
Function.prototype.toString()
获取函数声明,现在返回精确字符,包括空格和注释,

JSON 超集
此提议的动机是 JSON 字符串可以包含未转义的 U + 2028 LINE SEPARATOR (行分隔符)和 U + 2029 PARAGRAPH SEPARATOR 字符,而 ECMAScript 字符串则不能。在 ES2019 之前,它会产生错误SyntaxError: Invalid or unexpected token

const LS = eval('"\u2028"');
const PS = eval("'\u2029'");

ES2020(ECMAScript 2020)

String.prototype.matchAll

  1. 动态导入语句 import()

  2. import.meta

  3. export * as ns from ‘module’

  4. Promise.allSettled

  5. 新增数据类型: BigInt

  6. 顶层对象: globalThis

  7. 空值合并运算符: ??
    a ?? b, 左侧操作符为 null 或者 undefined 的时候返回右侧的值

  8. 可选链操作符:?.
    a?.b 当a为 null或者undefined的时候 返回undefined,而不是报错

ES2021 (ECMAScript 2021)

  1. String.prototype.replaceAll
  2. Promise.any
  3. WeakRefs
  4. Logical Assignment Operators(逻辑赋值操作符)
  5. Numeric separators(数字分隔符 提高可读性)
const a = 100_000_00;

ES2022(ECMAScript 2022)

类字段,私有实例方法和访问器
正则表达式捕获组索引。
顶层await

ES3、ES5、ES6、ES2016、ES2017、ES2018、ES2019相关推荐

  1. JavaScript、ES5和ES6的介绍和区别

    JavaScript简介 JavaScript一种动态类型.弱类型.基于原型的客户端脚本语言,用来给HTML网页增加动态功能. JavaScript由三部分组成: ECMAScript(核心)+DOM ...

  2. 常用浏览器内核的了解、ES5和ES6的区别、ES6的更新的笔试题

    对浏览器的内核的了解?有哪些内核?(重点6分) 浏览器要渲染出网页给用户看,必须加载html编码和js脚本,渲染引擎渲染页面的UI和js执行引擎操作内存,就是浏览器的的重要组成程序:内核 根据不同的浏 ...

  3. 带你认识Javascript、ES5和ES6的介绍和区别

    一.什么是Javascript? JavaScript(简称"JS")一种动态类型.弱类型.基于原型的客户端脚本语言,用来给HTML网页增加动态功能. 动态: 在运行时确定数据类型 ...

  4. ES5和ES6介绍及新增内容用法讲解

    1.es5和es6的区别 ECMAScript5,即ES5,是ECMAScript的第五次修订,于2009年完成标准化 ECMAScript6,即ES6,是ECMAScript的第六次修订,于2015 ...

  5. JavaScript 中的 require / exports、import / export、浅谈JavaScript、ES5、ES6

    Node.js 的基础教学 之 exports 和 module.exports:https://zhuanlan.zhihu.com/p/82057593 浅谈 JavaScript.ES5.ES6 ...

  6. es5和es6的区别、以及es6的新特性

    es5和es6的区别 系统库的引入 es5:ES5中的引用需要先使用require导入React包,成为对象,再去进行真正引用 es6:ES6里,可以使用import方法来直接实现系统库引用,不需要额 ...

  7. ES6基础2(块级作用域、数组对象解构)-学习笔记

    文章目录 ES6基础2(块级作用域.数组对象解构)-学习笔记 块级作用域 数组解构 对象解构 字符串解构 函数的参数解构 ES6基础2(块级作用域.数组对象解构)-学习笔记 块级作用域 //let c ...

  8. js笔记(三)ES5、ES5新增的数组的方法、字符串的方法、字符编码、对象的序列化和反序列化、bind

    数组方法.字符串方法总结 大目录 小目录 一.ES5严格模式 1. 严格模式: 2. 严格模式的行为变更: 二.ES5新增的数组的方法 1. 判断是否为数组:Array.isArray(): 2. 判 ...

  9. Web开发的未来:React、Falcor和ES6

    Widen是一家数字资产管理解决方案提供商.目前,其技术栈还非常传统,包括服务器端的Java.浏览器端的AngularJS.提供REST API支持的Jersey以及jQuery. Underscor ...

  10. 二、前端技术-es6的介绍

    二.前端技术-es6的介绍 一.ECMAScript 6 简介 1.ECMAScript 和 JavaScript 的关系 2.ES6 与 ECMAScript 2015 的关系 二.基本语法 1.l ...

最新文章

  1. python之生成随机密码
  2. BZOJ2815: [ZJOI2012]灾难
  3. html录音并转为音频文件,HTML5音频API Web Audio
  4. Java8 EnumSet 源码简单分析
  5. eclipse配置PHP自动提示代码
  6. JDK8的日期时间类3
  7. MAVEN 私有仓库库迁移
  8. 【软件工程】IS的三级管理
  9. Graphviz下载 使用
  10. C语言:四则计算器(支持小数,括号和次方幂 组合输入计算)
  11. gif透明背景动画_图片的不同格式:JPG、PNG、GIF都有什么区别?
  12. 第 7 章 排序算法
  13. 像A + B一样容易
  14. NSGA2 算法Matlab实现
  15. 五个高效的工作方式,提高你的工作效率
  16. DevIL的学习笔记
  17. mocha检测c语言,mocha的时序规则讲解
  18. SQL1 从 Customers 表中检索所有的 ID
  19. curl调用接口方法
  20. Android中获取文本宽度和高度

热门文章

  1. 树莓派4b自带wifi_树莓派4B(ubuntu)无线网络配置
  2. 从“NVIDIA禁令”看如何正确选择NVIDIA GPU卡
  3. 2020年最好用的手机是哪一款_2020最好用的5G手机是哪一款?热销2020年5g手机推荐及点评...
  4. 【程序逻辑】数据时代的推断陷阱尔雅答案
  5. JZOJ1728. Antimonotonicity
  6. 数据库驱动加载失败,数据库连接失败
  7. linux驱动程序启动失败,打开程序提示加载驱动失败?三种故障原因及解决方法...
  8. 申请gmail邮箱及foxmail邮箱
  9. ES集群不通,日志报[node-3] not enough master nodes discovered during pinging (found [[Candidate{node={node-3
  10. 使用Git在G码云上传项目及同步