ES6笔记

作者: YOLO_2a2d | 来源:发表于2020-01-15 16:52 被阅读0次

let命令:

  • 用来声明变量
  • 不存在变量提升,所声明的变量必须声明后才能调用,否则报错
  • 暂时性死区(TDZ)在代码块内,使用let命令声明变量之前,该变量都是不可用的
  • 不允许重复声明

块级作用域

function f1() {
  let n = 5;
  if (true) {
    let n = 10;
  }
  console.log(n); // 5
}

const命令:

  • const声明一个只读的常量。一旦声明,常量的值就不能改变
  • 不存在变量提升,所声明的变量必须声明后才能调用,否则报错
  • 暂时性死区(TDZ)在代码块内,使用let命令声明变量之前,该变量都是不可用的
  • 不允许重复声明
  • 本质:并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动

变量结构赋值:

数组的解构赋值:

let [a, b, c] = [1, 2, 3];
  • 本质:“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值
  • Set 结构,也可以使用数组的解构赋值
let [x, y, z] = new Set(['a', 'b', 'c']);
x // "a"
  • 解构赋值允许指定默认值:
let [foo = true] = [];
foo // true

对象的解构赋值:

  • 数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。
let { bar, foo } = { foo: 'aaa', bar: 'bbb' };
foo // "aaa"
bar // "bbb"

let { baz } = { foo: 'aaa', bar: 'bbb' };
baz // undefined
  • 默认值:对象的解构也可以指定默认值
  • 默认值生效的条件是,对象的属性值严格等于undefined
var {x = 3} = {x: undefined};
x // 3

var {x = 3} = {x: null};
x // null

字符串的解构赋值:

  • 字符串被转换成了一个类似数组的对象
const [a, b, c, d, e] = 'hello';
a // "h"
b // "e"
c // "l"
d // "l"
e // "o"

数值和布尔值的解析赋值:

  • 解构赋值的规则是,只要等号右边的值不是对象或数组,就先将其转为对象。由于undefined和null无法转为对象,所以对它们进行解构赋值,都会报错

函数参数的解构赋值

function add([x, y]){
 return x + y;
}

add([1, 2]); // 3

用途:

  • 交换变量的值
let x = 1;
let y = 2;

[x, y] = [y, x];
  • 从函数返回多个值
// 返回一个数组

function example() {
  return [1, 2, 3];
}
let [a, b, c] = example();

  • 函数参数的定义

// 参数是一组有次序的值
function f([x, y, z]) { ... }
f([1, 2, 3]);

// 参数是一组无次序的值
function f({x, y, z}) { ... }
f({z: 3, y: 2, x: 1});
  • 提取 JSON 数据
let jsonData = {
  id: 42,
  status: "OK",
  data: [867, 5309]
};

let { id, status, data: number } = jsonData;

console.log(id, status, number);
// 42, "OK", [867, 5309]
  • 函数参数的默认值
  • 遍历 Map 结构
const map = new Map();
map.set('first', 'hello');
map.set('second', 'world');

for (let [key, value] of map) {
  console.log(key + " is " + value);
}
// first is hello
// second is world
  • 输入模块的指定方法

字符串的新增方法

  1. String.fromCodePoint()
    用于从 Unicode 码点返回对应字符
  2. String.raw()
    该方法返回一个斜杠都被转义(即斜杠前面再加一个斜杠)的字符串,往往用于模板字符串的处理方法。
String.raw`Hi\n${2+3}!`
// 实际返回 "Hi\\n5!",显示的是转义后的结果 "Hi\n5!"
  1. codePointAt()
    能够正确处理 4 个字节储存的字符,返回一个字符的码点。
let s = '𠮷a';

s.codePointAt(0) // 134071
s.codePointAt(1) // 57271

s.codePointAt(2) // 97
  1. normalize()
    用来将字符的不同表示方法统一为同样的形式,这称为 Unicode 正规化。

  2. includes(),startsWith(),endsWith()

    includes():返回布尔值,表示是否找到了参数字符串。
    startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。
    endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。

  1. repeat()
    repeat方法返回一个新字符串,表示将原字符串重复n次

  2. padStart(),padEnd()
    如果某个字符串不够指定长度,会在头部或尾部补全。padStart()用于头部补全,padEnd()用于尾部补全。

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'

'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'
  1. trimStart(),trimEnd()
    ES2019 对字符串实例新增了trimStart()trimEnd()这两个方法。它们的行为与trim()一致,trimStart()消除字符串头部的空格,trimEnd()消除尾部的空格。它们返回的都是新字符串,不会修改原始字符串

  2. matchAll()
    matchAll()方法返回一个正则表达式在当前字符串的所有匹配

参考链接:http://es6.ruanyifeng.com/#README

相关文章

  • Ant Design Pro的知识储备

    Less 笔记 Less 官方文档 ReactJs笔记 ReactJs官方文档 ES6笔记 ES6文档 dvaJs...

  • [总结]ES6 Array

    学习es6时做得小笔记

  • ES6_note

    ES6笔记 es6 - 解构 数组的 解构赋值 let [a, b, c] = [1, 2, 3]; 这种写法属于...

  • Node.js笔记七:es6

    Node.js笔记七:es6 es6是javascript的新一代语法规范,现在很多新的库都是基于新的es6语法规...

  • ES6 笔记(常量&&变量)

    ES6 笔记(常量&&变量) 变量&&常量 新特性 ES6 新增了let命令,用来声明变量。它的用法类似于var,...

  • 1、let和const命令

    阮一峰《ES6 标准入门》 笔记阮一峰 博客案例 在ES6中,我们通常实用 let 表示变量,const 表示常量...

  • let 和 const 命令

    ES6学习笔记1、let命令ES6中新增了let,用于声明变量,与var类似,但let声明只是在其block(块)...

  • 2.let 和 const 命令

    阮一峰ES6教程学习笔记原文地址 1. let和var let:ES6 新增命令用法类似于var,但是所声明的变量...

  • 《深入理解ES6》学习笔记(第一天)

    《深入理解ES6》学习笔记(第一天) 关于本书 深入理解ES6的特性对于所有JavaScript开发人员来说至关重...

  • ES6 let命令和const命令

    基于ES6标准入门(第3版)这本书的笔记要学习angula,vue,react等新的前端框架,必须先熟悉ES6的语...

网友评论

      本文标题:ES6笔记

      本文链接:https://www.haomeiwen.com/subject/nmutzctx.html