乐趣区

关于javascript:ECMAScript新特性

jiezi

从本文你能理解到那些常识

  • JavaScript 和 ECMAScript 的关系
  • let , const 与块级作用域
  • 解构
  • 字符串的扩大
  • 数值的扩大
  • 函数的扩大
  • 数组的扩大
  • 对象的扩大
  • Proxy
  • Reflect
  • Promise
  • class 类
  • Set，Map
  • Symbol
  • for…of..
  • Iterable 接口
  • Generator

JavaScript 和 ECMAScript 的关系

ES 也是一门脚本语言，通常看作 JavaScript 的标准化标准，实际上 JavaScript 是 ECMAScript 的扩大语言
ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现（另外的 ECMAScript 方言还有 JScript 和 ActionScript）

JS 在浏览器环境下，JS = WEB + ES

JS 在 Node 环境下 JS = Node + ES

版本迭代

  • 解决原有语法上的一些问题和有余
  • 对原有语法进行加强
  • 全新的对象，办法和性能
  • 全新的数据类型，数据结构

let 与块级作用域

文章入口

解构

文章入口

字符串扩大

ES2015 为字符串增加了 Iterator。所以字符串能够 for...of.. 遍历
模板字符串

  • 传统字符串不反对换行 \n

    const str = `hello es2015

this is made in China`
console.log(str);  // 会输入空行

const name = "tom"
const msg = `hello ${name}` // 插值表达式
console.log(msg);

  • 标签模板

    // 模板字符串前能够增加标签，是个办法 ["hello world"]
const tag = console.log`hello world` 
    const n = "mcgee"
const bol = true
function myTagFnc(arr,n,bol){ // 参数为动态内容，插值，插值...
console.log(arr,n,bol); //['hey,','is a','.'] 动态内容的宰割

// 标签的作用，对值进行加工
const sex = bol?"man":"woman"

// return 123
return arr[0]+n+arr[1]+sex+arr[2]
}
const result = myTagFnc`hey,${n} is a ${bol}.`

console.log(result); //123 || hey,mcgee is a true  ||  hey,mcgee is a man
  • 标签的作用

对插值进行加工。文本的多语言化，翻译成中英文。查看模板字符串内的不平安字符

字符串新增罕用办法

  • includes() 示意是否找到了参数字符串
  • startsWith() 示意参数字符串是否在原字符串的头部
  • endsWith() 示意参数字符串是否在原字符串的尾部
  • repeat() 返回一个新字符串，示意将原字符串反复 n 次
  • padStart(str.length,” 用来补全的值 ”),padEnd() 字符串补全长度 (ES2017)
const msg = 'Mcgee is a man'
console.log(msg.startsWith("Mcgee")) //true
console.log(msg.endsWith("n")); //true
console.log(msg.includes("is")); //true
'na'.repeat(0) // ""'na'.repeat(2.9) // "nana"
'na'.repeat(Infinity) // RangeError
'na'.repeat(-1) // RangeError
// 如果 repeat 的参数是字符串，则会先转换成数字。'na'.repeat('na') // ""'na'.repeat('3') // "nanana"

数值的扩大

  • Number.parseInt()
  • Number.parseFloat()
  • Number.isInteger() 用来判断一个数值是否为整数
  • 2 ** 3 //8 (ES2016)
  • BigInt 数据类型（示意整数）
Number.isInteger(25) // true
Number.isInteger(25.0) // true
Number.isInteger(25.1) // false
Number.isInteger() // false
Number.isInteger(null) // false
Number.isInteger('15') // false
Number.isInteger(true) // false

函数的扩大

文章入口

数组的扩大

文章入口

对象的扩大

文章入口

Proxy,Reflect

文章入口

Class 类

文章入口

Set,Map 数据结构

文章入口

Symbol 类型

文章入口

Iterator,Generator

文章入口

退出移动版