ES6--内置对象的扩展

1. 数组的扩展

1) Array.from() //把类数组对象转换成真正的数组
在页面中写一些li

var lis = document.querySelectorAll('li');
console.log(Array.isArray(lis));//false说明不是数组
var lis2 = Array.from(lis);
console.log(lis2);
console.log(Array.isArray(lis2));//true

2) Array.of()//用来创建一个数组

const arr = Array.of(1);
console.log(arr);//[1]

3) find() 选出符合条件的元素
findIndex() 选出符合条件元素的下标

const arr = [1, 2, 3, 4];
let res = arr.find(function (a){
  return a < 2;
});
console.log(res);//1

let res = arr.findIndex(function (a){
  return a < -200;
});
console.log(res);//-1 没有找到

4) fill() 替换

const arr = [1, 2, 3, 4];
arr.fill('abc');//['abc','abc','abc','abc']
arr.fill('abc', 1, 3);
console.log(arr);//[1,'abc','abc',4]

2. 字符串的扩展

1) 模板字符串，把字符串用“包起来。可以使用${”}进行字符串拼接。

let flag = true;
let html = `<ul>
              <li>
                <span>${'首页'}</span>
                 <span></span>
                 <span></span>
                <span class="${flag ? 'show' : 'hide'}"></span>
                <span></span>
               </li>
             </ul>`;          
 console.log(html);

2) 常见的方法
* repeat 重复添加

let str1 = 'a';
let str2 = str1.repeat(3);
console.log(str2);//aaa

• includes()是否包含
• startsWith()开头是否包含
• endsWith()结尾是否包含

let str = 'miaov';
console.log(str.includes('ao'));  // true
console.log(str.includes('asd'));  // false 

console.log(str.startsWith('m')); // true
console.log(str.startsWith('o')); // false

console.log(str.endsWith('ov')); // true
console.log(str.endsWith('m')); // true

3. 对象的扩展

1) 对象的简洁表示法
在ES5中如果键和值相同，用下面这种方式

let a = 1;
const obj = {
  a: a
};
console.log(obj);//a:1

在ES6中可以这样表示

let a = 1;
const obj = {a}
console.log(obj);

对象的方法也可以简写，下面fn可以简写成fn2

const obj = {
  fn: function (){
    console.log(1);
  },
  fn2(){
    console.log(2);
  }
}
obj.fn();//1
obj.fn2();//2

2) Object.is()判断是否长的一样

console.log(Object.is(NaN, NaN));//true
console.log(Object.is(+0, -0));  //false

3) Object.assign()
用于对象的合并，将源对象的所有可枚举属性，复制到目标对象。

let obj1 = {a: 1};
let obj2 = {a: 2, b: 3};
let obj3 = {c: ‘abc’};
Object.assign(obj1, obj2, obj3);//obj1是目标对象
console.log(obj1);//{a:2,b:3,c:’abc’}