新特性(中)

2 新特性(中)

2.1 请说说ES6新增了哪些对象方法?

【考点映射】

  • ES6新增Object对象方法

【频率】★★★★

【难度】☆

【参考答案】

(1)Object.is()

ES5中用 == 和 === 比较两个值是否相等,两者都有缺陷,== 会自动转换数据类型,=== NaN不等于自身,以及 +0 等于 -0。ES6 提出“Same-value equality”(同值相等)算法,即在所有环境中,只要两个值是一样的,则相等,Object.is()就是实现这个算法的新方法,用来比较两个值是否严格相等(除了两个特例,基本与 === 一致)
Object.is('foo','foo') // true 
Object.is({},{}) // false
//与===的不同之处
Object.is(+0,-0) // false 
Object.is(NaN,NaN) // true

(2)Object.assign()

用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)

常见用途:为对象添加属性、方法,克隆对象,合并多个对象,为属性指定默认值

const target ={a:1};  
const source1 ={b:2}; 
const source2 ={c:3};  
Object.assign(target, source1, source2); 
console.log(target); // {a:1, b:2, c:3}

注意:

  • Object.assign()方法是浅拷贝,而不是深拷贝,若源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用

  • Object.assign()拷贝的属性是有限制的,只拷贝源对象的自身属性,不拷贝继承属性,不拷贝不可枚举属性

  • 一旦遇到同名属性时,会直接替换,后面的属性会覆盖前面的属性

  • 若参数不是对象,则会先转成对象;由于undefined和null无法转成对象,若它们作为参数,就会报错    

(3)__proto__属性:本质上是一个内部属性,而不是一个正式的对外的 API,若一个对象本身部署了__proto__属性,该属性的值就是对象的原型,实际上是调用了Object.prototype.__proto__

(4)Object.setPrototypeOf():功能与__proto__相同,用于设置一个对象的原型对象,相较于__proto__是ES6推荐的方法

(5)Object.getPrototypeOf() :用于读取一个对象的原型对象

(6)Object.keys():遍历对象自身(不含继承的)所有可遍历属性的键名,以数组的方式返回

(7)Object.values():遍历对象自身(不含继承的)所有可遍历属性的值,以数组的方式返回

(8)Object.entries() :遍历对象自身(不含继承的)所有可遍历属性的健值对,以数组的方式返回(只输出属性名非 Symbol 值的属性)

var obj ={ foo:'bar', baz:42}
Object.keys(obj) // ["foo", "baz"]
Object.values(obj) // ["bar", 42]
Object.entries(obj) // [ ["foo", "bar"], ["baz", 42] ]

(9)Object.fromEntries():将一个键值对数组转为对象,Object.entries()逆操作

Object.fromEntries([['foo','bar'],['baz',42]]) // { foo: "bar", baz: 42 }

(10)Object.getOwnPropertyDescriptors():用来获取一个对象的所有自身属性的描述符,返回一个对象,所有原来的对象的属性名都是该对象的属性名,对应的属性值就是该属性的描述对象

const obj = {
  foo: 123,
  get bar() { return 'abc' }
};
Object.getOwnPropertyDescriptors(obj)
// { foo:
//    { value: 123,
//      writable: true,
//      enumerable: true,
//      configurable: true },
//   bar:
//    { get: [Function: bar],
//      set: undefined,
//      enumerable: true,
//      configurable: true } }


2.2 请说说ES6新增了哪些数组方法?

【考点映射】

  • ES6新增数组方法

【频率】★★★★★

【难度】☆

【参考答案】

(1)扩展运算符

扩展运算符:...,将一个数组转为用逗号分隔的参数序列,该运算符主要用于函数调用

console.log(...[1,2,3]) // 1 2 3  
console.log(1,...[2,3,4],5) // 1 2 3 4 5 

(2)Array.from()

用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)

let arrayLike ={
    '0':'a',
    '1':'b',
    '2':'c',    
    length:3
}; 
// ES5的写法 
var arr1 =[].slice.call(arrayLike); // ['a', 'b', 'c']  
// ES6的写法 
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

(3)数组实例的find()和findIndex()

Array.prototype.find():用于找出第一个符合条件的数组成员,它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,返回该成员。如没有符合条件的成员,则返回undefined

[1,4,-5,10].find((n)=> n <0) // -5

Array.prototype.findIndex():与find方法非常类似,返回第一个符合条件的数组成员的位置,如所有成员都不符合条件,则返回-1

[1,5,10,15].findIndex(function(value, index, arr){
    return value >9;
}) // 2

(4)数组实例的includes()

Array.prototype.includes():返回一个布尔值,表示某个数组是否包含给定的值,第二个参数表示搜索的起始位置,默认为0,与字符串的includes方法类似

[1,2,3].includes(2) // true 
[1,2,3].includes(3,3); // false


2.3 请问你了解Set、Map数据结构吗?

【考点映射】

  • Set、Map数据结构

【频率】

剩余60%内容,订阅专栏后可继续查看/也可单篇购买

前端岗面试求职真题解析 文章被收录于专栏

前端岗位面试求职攻略及真题解析~~

全部评论

相关推荐

冷艳的小师弟在看机会:jd测评乱点直接被挂了,哭死~
点赞 评论 收藏
分享
点赞 评论 收藏
分享
评论
点赞
收藏
分享
牛客网
牛客企业服务