ES3、ES5、ES6、ES2016、ES2017、ES2018、ES2019
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)
- Array.prototype.includes()
- 指数运算符 ** 和
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
动态导入语句 import()
import.meta
export * as ns from ‘module’
Promise.allSettled
新增数据类型: BigInt
顶层对象: globalThis
空值合并运算符: ??
a ?? b, 左侧操作符为 null 或者 undefined 的时候返回右侧的值可选链操作符:?.
a?.b 当a为 null或者undefined的时候 返回undefined,而不是报错
ES2021 (ECMAScript 2021)
- String.prototype.replaceAll
- Promise.any
- WeakRefs
- Logical Assignment Operators(逻辑赋值操作符)
- Numeric separators(数字分隔符 提高可读性)
const a = 100_000_00;
ES2022(ECMAScript 2022)
类字段,私有实例方法和访问器
正则表达式捕获组索引。
顶层await
ES3、ES5、ES6、ES2016、ES2017、ES2018、ES2019相关推荐
- JavaScript、ES5和ES6的介绍和区别
JavaScript简介 JavaScript一种动态类型.弱类型.基于原型的客户端脚本语言,用来给HTML网页增加动态功能. JavaScript由三部分组成: ECMAScript(核心)+DOM ...
- 常用浏览器内核的了解、ES5和ES6的区别、ES6的更新的笔试题
对浏览器的内核的了解?有哪些内核?(重点6分) 浏览器要渲染出网页给用户看,必须加载html编码和js脚本,渲染引擎渲染页面的UI和js执行引擎操作内存,就是浏览器的的重要组成程序:内核 根据不同的浏 ...
- 带你认识Javascript、ES5和ES6的介绍和区别
一.什么是Javascript? JavaScript(简称"JS")一种动态类型.弱类型.基于原型的客户端脚本语言,用来给HTML网页增加动态功能. 动态: 在运行时确定数据类型 ...
- ES5和ES6介绍及新增内容用法讲解
1.es5和es6的区别 ECMAScript5,即ES5,是ECMAScript的第五次修订,于2009年完成标准化 ECMAScript6,即ES6,是ECMAScript的第六次修订,于2015 ...
- JavaScript 中的 require / exports、import / export、浅谈JavaScript、ES5、ES6
Node.js 的基础教学 之 exports 和 module.exports:https://zhuanlan.zhihu.com/p/82057593 浅谈 JavaScript.ES5.ES6 ...
- es5和es6的区别、以及es6的新特性
es5和es6的区别 系统库的引入 es5:ES5中的引用需要先使用require导入React包,成为对象,再去进行真正引用 es6:ES6里,可以使用import方法来直接实现系统库引用,不需要额 ...
- ES6基础2(块级作用域、数组对象解构)-学习笔记
文章目录 ES6基础2(块级作用域.数组对象解构)-学习笔记 块级作用域 数组解构 对象解构 字符串解构 函数的参数解构 ES6基础2(块级作用域.数组对象解构)-学习笔记 块级作用域 //let c ...
- js笔记(三)ES5、ES5新增的数组的方法、字符串的方法、字符编码、对象的序列化和反序列化、bind
数组方法.字符串方法总结 大目录 小目录 一.ES5严格模式 1. 严格模式: 2. 严格模式的行为变更: 二.ES5新增的数组的方法 1. 判断是否为数组:Array.isArray(): 2. 判 ...
- Web开发的未来:React、Falcor和ES6
Widen是一家数字资产管理解决方案提供商.目前,其技术栈还非常传统,包括服务器端的Java.浏览器端的AngularJS.提供REST API支持的Jersey以及jQuery. Underscor ...
- 二、前端技术-es6的介绍
二.前端技术-es6的介绍 一.ECMAScript 6 简介 1.ECMAScript 和 JavaScript 的关系 2.ES6 与 ECMAScript 2015 的关系 二.基本语法 1.l ...
最新文章
- python之生成随机密码
- BZOJ2815: [ZJOI2012]灾难
- html录音并转为音频文件,HTML5音频API Web Audio
- Java8 EnumSet 源码简单分析
- eclipse配置PHP自动提示代码
- JDK8的日期时间类3
- MAVEN 私有仓库库迁移
- 【软件工程】IS的三级管理
- Graphviz下载 使用
- C语言:四则计算器(支持小数,括号和次方幂 组合输入计算)
- gif透明背景动画_图片的不同格式:JPG、PNG、GIF都有什么区别?
- 第 7 章 排序算法
- 像A + B一样容易
- NSGA2 算法Matlab实现
- 五个高效的工作方式,提高你的工作效率
- DevIL的学习笔记
- mocha检测c语言,mocha的时序规则讲解
- SQL1 从 Customers 表中检索所有的 ID
- curl调用接口方法
- Android中获取文本宽度和高度
热门文章
- 树莓派4b自带wifi_树莓派4B(ubuntu)无线网络配置
- 从“NVIDIA禁令”看如何正确选择NVIDIA GPU卡
- 2020年最好用的手机是哪一款_2020最好用的5G手机是哪一款?热销2020年5g手机推荐及点评...
- 【程序逻辑】数据时代的推断陷阱尔雅答案
- JZOJ1728. Antimonotonicity
- 数据库驱动加载失败,数据库连接失败
- linux驱动程序启动失败,打开程序提示加载驱动失败?三种故障原因及解决方法...
- 申请gmail邮箱及foxmail邮箱
- ES集群不通,日志报[node-3] not enough master nodes discovered during pinging (found [[Candidate{node={node-3
- 使用Git在G码云上传项目及同步