ES6自用笔记(一)

168 阅读6分钟

let 与 const

let 声明的变量只在 let 命令所在的代码块内有效。 const 声明一个只读的常量,一旦声明,常量的值就不能改变。

解构赋值

解构赋值是对赋值运算符的扩展。

let [a, b, c] = [1, 2, 3];

let [a, [[b], c]] = [1, [[2], 3]];

let [a, , b] = [1, 2, 3];

let [a = 1, b] = []; // a = 1, b = undefined

let [a, ...b] = [1, 2, 3];

let [a, b, c, d, e] = 'hello';

解构默认值 let [a = 2] = [undefined]; // a = 2

ES6 Symbol

Symbol 函数栈不能用 new 命令,因为 Symbol 是原始数据类型,不是对象

let sy = Symbol("KK");
console.log(sy);    // Symbol(KK)

作为属性名:

let sy = Symbol("key1");
// 写法1 
let syObject = {}; 
syObject[sy] = "kk";
// 写法2 
let syObject = { [sy]: "kk" };

Map Set

Map对象保存键值对。任何值(对象或者原始值)都可以作为一个键或一个值。

Maps 和 Objects 的区别

  • 一个Object的键只能是字符串或者Symbols,但一个Map的键可以是任意值
  • Map中的键值是有序的FIFO原则,而添加到对象中的键则不是
  • Map的键值对个数可以从size属性获取,而Object的键值对个数只能手动计算
  • Object都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突

Map 对象

//key是字符串

var myMap = new Map(); 
var keyString = "a string";    //key是字符串
myMap.set(keyString, "和键'a string'关联的值");
myMap.get(keyString); // "和键'a string'关联的值" myMap.get("a string"); // "和键'a string'关联的值"

//key是对象

var myMap = new Map();
var keyObj = {},
myMap.set(keyObj, "和键 keyObj 关联的值");
myMap.get(keyObj); // "和键 keyObj 关联的值" 
myMap.get({}); // undefined, 因为 keyObj !== {}

Map 对象操作

  1. Map与array转换
var kvArray = [["key1", "value1"], ["key2", "value2"]]; 
// Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象 
var myMap = new Map(kvArray); 
// 使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组 
var outArray = Array.from(myMap);
//Array.from 浅拷贝,迭代
  1. Map的克隆
var myMap1 = new Map([["key1", "value1"], ["key2", "value2"]]); 
var myMap2 = new Map(myMap1); 
// 打印 false。 Map 对象构造函数生成实例,迭代出新的对象。
  1. Map合并
var first = new Map([[1, 'one'], [2, 'two'], [3, 'three'],]);
var second = new Map([[1, 'uno'], [2, 'dos']]);
// 合并两个 Map 对象时,如果有重复的键值,则后面的会覆盖前面的,对应值即 uno,dos, three
var merged = new Map([...first, ...second]);

Set对象

  • Set对象存储的值总是唯一的,所以需要判断两个值是否恒等
  • +0 与 -0 在存储判断唯一性的时候是恒等的,所以不重复
  • undefined 与 undefined 是恒等的,所以不重复
  • NaN 与 NaN 是不恒等的,但是在 Set 中只能存一个,不重复
let mySet = new Set(); 
mySet.add(1); // Set(1) {1} 
mySet.add(5); // Set(2) {1, 5}
mySet.add(5); // Set(2) {1, 5} 这里体现了值的唯一性

Set对象操作

  1. Array转换
// ArraySet 
var mySet = new Set(["value1", "value2", "value3"]); 
// 用...操作符,将 SetArray 
var myArray = [...mySet]; 
// String 转 Set 
var mySet = new Set('hello');  // Set(4) {"h", "e", "l", "o"} 
// 注:Set 中 toString 方法是不能将 Set 转换成 String
  1. 数组去重
var mySet = new Set([1, 2, 3, 4, 4]); 
[...mySet];  // [1, 2, 3, 4]
  1. 并集
var a = new Set([1, 2, 3]); 
var b = new Set([4, 3, 2]); 
var union = new Set([...a, ...b]);   // {1, 2, 3, 4}
  1. 交集
var a = new Set([1, 2, 3]); 
var b = new Set([4, 3, 2]); 
var intersect = new Set([...a].filter(x => b.has(x)));  //{2, 3}
  1. 差集
var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var difference = new Set([...a].filter(x => !b.has(x)));  //{1}

字符串

  1. 子串的识别方法
  • includes() :返回布尔值,判断是否找到参数字符串。
  • startsWith() :返回布尔值,判断参数字符串是否在原字符串的头部。
  • endsWith() :返回布尔值,判断参数字符串是否在原字符串的尾部。
let string = "apple,banana,orange"; 
string.includes("banana"); // true 
string.startsWith("apple"); // true 
string.endsWith("apple"); // false 
string.startsWith("banana",6) // true   从第6个开始找

2.重复

  • repeat():
  • 返回新的字符串,表示将字符串重复指定次数返回。
  • 如果参数是小数,向下取整
  • 如果参数是 0 至 -1 之间的小数,会进行取整运算,0 至 -1 之间的小数取整得到 -0 ,等同于 repeat 零次
  • 如果参数是 NaN,等同于 repeat 零次
  • 如果参数是负数或者 Infinity ,会报错
  • 如果传入的参数是字符串,则会先将字符串转化为数字
console.log("Hello,".repeat(2));  // "Hello,Hello,"
console.log("Hello,".repeat(2.3)); // "Hello,Hello,"
console.log("Hello,".repeat(-0.3)); // ""
console.log("Hello,".repeat(NaN));  // "" 

console.log("Hello,".repeat(Infinity));  
// RangeError: Invalid count value

console.log("Hello,".repeat("2"));  // "Hello,Hello,"

3.字符串补全

padStart:返回新的字符串,表示用参数字符串从头部(左侧)补全原字符串。

padEnd:返回新的字符串,表示用参数字符串从尾部(右侧)补全原字符串。

  • 如果没有指定第二个参数,默认用空格填充。
  • 如果指定的长度小于或者等于原字符串的长度,则返回原字符串
  • 如果原字符串加上补全字符串长度大于指定长度,则截去超出位数的补全字符串
  • 常用于补全位数
console.log("h".padStart(5,"o"));  // "ooooh"
console.log("h".padEnd(5,"o"));    // "hoooo"
console.log("h".padStart(5));      // "    h"
console.log("hello".padStart(5,"A"));  // "hello"
console.log("hello".padEnd(10,",world!"));  // "hello,worl"
console.log("123".padStart(10,"0"));  // "0000000123"
  1. 模板字符串
let name = "Mike"; 
let age = 27; 
let info = `My Name is ${name},I am ${age+1} years old next year.` 
console.log(info); // My Name is Mike,I am 28 years old next year.

Es6数值

二进制表示法新写法: 前缀 0b 或 0B 。

console.log(0b11 === 3); // true
console.log(0B11 === 3); // true

八进制表示法新写法: 前缀 0o 或 0O 。

console.log(0o11 === 9); // true
console.log(0O11 === 9); // true

常量

Number.EPSILON   //表示 1 与大于 1 的最小浮点数之间的差。

方法

  1. 用于检查一个数值是否为有限的( finite ),即不是 Infinity
Number.isFinite()
console.log( Number.isFinite(1)); // true 
console.log( Number.isFinite(0.1)); // true
  1. NaN 不是有限的
console.log( Number.isFinite(NaN)); // false
  1. umber.isFinate 没有隐式的 Number() 类型转换,所有非数值都返回 false
console.log( Number.isFinite('15')); // false

从全局移植到 Number 对象

Number.parseInt()
  1. 不指定进制时默认为 10 进制
  2. 与全局的 parseInt() 函数是同一个函数
  3. 无法被解析成浮点数,则返回 NaN
  4. 与全局的 parseFloat() 方法是同一个方法
  5. 因此 1 与 1.0 被视为相同的值
  6. NaN 和正负 Infinity 不是整数
  7. 数值的精度超过 53 个二进制位时,由于第 54 位及后面的位被丢弃,会产生误判
Number.parseInt('12.34'); // 12
Number.parseInt('0011',2); // 3
Number.parseInt === parseInt; // true
Number.parseFloat('123.45abc') // 123.45
Number.parseFloat('abc') // NaN
Number.parseFloat === parseFloat // true
Number.isInteger(1); // true 
Number.isInteger(1.0); // true
Number.isInteger(1.0000000000000001) // true
Number.isInteger(5E-324); // false

Math 对象的扩展

  1. 计算一个数的立方根
Math.imul(1, 2); // 2
  1. 参数的平方和的平方根
Math.hypot(3, 4); // 5
  1. 返回数字的32 位无符号整数形式的前导0的个数
Math.clz32(1); // 31 
Math.clz32(0b01000000000100000000000000000000); // 1
  1. 返回数字的整数部分。
Math.trunc(12.3); // 12 
Math.trunc(12); // 12
  1. 获取数字的32位单精度浮点数形式
Math.fround(-(2**24)+1); // -16777215 
Math.fround(2 ** 24 - 1); // 16777215
  1. 判断数字的符号(正、负、0)
Math.sign(1); // 1 
Math.sign(-1); // -1
  1. 计算 e 的 x 次方
Math.expm1(1); // 1.718281828459045
Math.expm1(0); // 0
  1. 1 + x 的自然对数
Math.log1p(1); // 0.6931471805599453
  1. 以 10 为底的 x 的对数
Math.log10(1); // 0
  1. 指数运算符
let exam = 2;
exam ** = 2; // 4