ES2016 & ES2017复习

ES2016 - Exponentiation(**)

乘方的使用

let x=5;
let z = x**2; // z = 25

//x**y 的结果和 Math.pow(x,y) 相等

ES2016 - Exponentiation Assignment(**=)

效果和 += -= *= 一样只不过运算符号换为了乘方

let x=5;
 x **= 2 ///  x的值是25

ES2016 - Array.prototype.includes

用来判断数组中是否包含某个元素.

返回一个Boolean。包含返回true, 不包含返回false

const fruits = ["Banana","Orange","Apple","Mango"];

fruits.includes("Mango") // TRUE

ES2017 - String padding

ES2017添加了两条和String有关的方法： padStart 和 padEnd 作用是补全字符串长度。如果某个字符串不够指定长度，会在头部或者尾部补全。

padStart用于头部补全

padEnd用于尾部补全

//padStart使用例子
let str = "5";
str = str.padStart(4,0) //0005  第一个参数表述字符串的最小长度, 第二个参数用于设置补全的内容

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

//padEnd使用例子
let str = "5";
str = str.padEnd(4,0);//5000

'x'.padEnd(5,'ab') // 'xabab'
'x'.padEnd(4,'ab') // 'xaba'

如果原字符串的长度等于或者大于指定的最小长度则返回原字符串

'xxx'.padStart(2,'ab') // 'xxx'
'xxx'.padEnd(3,'abb') // 'xxx'

如果用来补全的字符串与原字符串两者的长度之和超过了指定的最小长度，则会截去超出位数的补全字符串

'abc'.padStart(10,'0123456789') // '0123456abc'
//先保留原字符串，然后在补全字符串中截取 10-3=7 位的内容  也就是0123456  然后补全在原字符串前(因为是padStart)
//padEnd同理

如果省略第二个参数 ，默认使用空格补全长度

'x'.padStart(4) // '   x'
'x'.padEnd(4) // 'x   '

常见用途

1.为数值补全指定位数。

'1'.padStart(10,'0') // '0000000001'
'12'.padStart(10,'0') // '0000000012'
'123456'.padStart(10,'0') //'0000123456'

2.用于提示字符串格式

'12'.padStart(10,'YYYY-MM-DD') // 'YYYY-MM-12'
'09-12'.padStart(10,'YYYY-MM-DD') // 'YYYY-09-12'

ES2017 - Object.entries

Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组，其排列与使用 for…in 循环遍历该对象时返回的顺序一致（区别在于 for-in 循环还会枚举原型链中的属性）

const person = {
    firstName : "John",
    lastName : "Doe",
    age: 50,
    eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.entries(person);

//
const fruits = {Bananas: 300, Oranges: 200, Apples: 500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
    text += fruit + ": " + value + "
";
}

document.getElementById("demo").innerHTML = text;

将Object转换为Map ***

new Map() 构造函数接受一个可迭代的entries。借助Object.entries可以将Object转换为Map

var oj = {foo : "bar", baz: 42};
var map = new Map(Object.entries(obj));
console.log(map);// Map {foo : "bar", baz: 42}

ES2017 - Object.values

Object.values()方法返回一个给定对象自身的所有可枚举属性值的数组，值的顺序与使用for…in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。

Object.values()返回一个数组，其元素是在对象上找到的可枚举属性值。属性的顺序与通过手动循环对象的属性值所给出的顺序相同。

var obj = {foo: 'bar', baz: 42};
console.log(Object.values(obj)); // ['bar',42]

//array like object
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.values(obj)); // ['a', 'b', 'c']

// array like object with random key ordering
// when we use numeric keys, the value returned in a numerical order according to the keys
var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.values(an_obj)); // ['b', 'c', 'a']

// getFoo is property which isn't enumerable
var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
my_obj.foo = 'bar';
console.log(Object.values(my_obj)); // ['bar']

// non-object argument will be coerced to an object
console.log(Object.values('foo')); // ['f', 'o', 'o']

如果参数不是对象，Object.values会先将其转为对象。由于数值和布尔值的包装对象，都不会为实例添加非继承的属性。所以，Object.values会返回空数组。如果参数为undefined或者null会报错。

console.log(Object.values(123))  //[]
console.log(Object.values(true)) //[]
console.log(Object.values(undefined))  //error
console.log(Object.values(null))       //error