前端面经面经每日一题day04

互联网大厂面试每日一题 -- 大厂面试每日一题

上面这个网址是我的题目的来源

不知不觉都已经第四天了，现在因为有了这个任务，我能够自己每天坚持去学习，然后输出。希望我分享的能够让看到的人收获，如果有什么问题可以发在评论区。

关于 `JSON`，以下代码输出什么

JSON.stringify 就是把JavaScript对象转换成JSON字符串，这个过程就是序列化。

它会忽视undefined和function(){}

对于函数get a(){|，本质是，就是变量a的get方法，如果没有return就是返回值是undefined，所以会忽视，如果有返回值，就是会赋值给变量a

补充：undefined就是初始化后未赋值，比如let a就是undefined，null就是给他赋值了null

复制代码

let obj={
    a:3,
    b:[1,2,3],
    c:{m:3},
    d:null,
    e:undefined,
    f:function(){},
    get e(){return 44},
    get g(){}
}
console.log(JSON.stringify(obj))
输出：{"a":3,"b":[1,2,3],"c":{"m":3},"d":null,"e":44}

JSON.parse 就是把JSON字符串转化为JavaScript对象。如果不是JSON字符串就会抛出异常。

如何把类数组转化为数组

类数组

特点：类数组有length属性，但是不具备数组原型链上的方法（比如push，pop）。

常见的类数组对象：arguments对象：传递给函数的所有参数。DOM方法返回的结果，document.querySelectorAll

转化为数组的方法

`Array.from`

这是一个ES6引入的静态对象，用于从类数组或可迭代对象中创建一个新数组实例。

复制代码

let obj={0:'1',1:'2',length:2}
let arobj=Array.from(obj)
console.log(arobj)

扩展运算符 ...

ES6 ，不适用于所有的类数组，但只能作用于可迭代对象iterable 比如DOM方法的结果，但是对于{length：3}就不可以，会出错。

复制代码

let all=document.querySelectorAll('li')
let allarr=[...all]
console.log(allarr)

Array API

在ES5中可以借用Array API通过，call/apply改变this来完成转化。

Array.prototype.slice.call(arrayLike) 这个调用数组原型身上的方法，slice是数组一个方法，提取数组的部分元素，这里我们就提取数组的全部元素，call里面第一个就是需要转化的类数组，第二个就是slice方法切割的开头，第三个元素就是slice方法切割的结束。

复制代码

let obj={0:'1',1:'2',length:2}
let arobj=Array.prototype.slice.call(obj)
//或者let arobj=Array.prototype.slice.apply(obj)
console.log(arobj)

以上方法都可以，但是我们现在看一下稀疏数组，就是数组中元素为空，控制台显示如下：(2) $空属性 \times 2$

那么就是说，上述的方法不一定适用于类数组，最后总结一下，比较稳妥的类数组转化为数组的方法如下

Array.from(arrayLike)

前端面经面经每日一题day04

关于 JSON，以下代码输出什么

如何把类数组转化为数组

类数组

转化为数组的方法

Array.from

扩展运算符 ...

Array API

关于 `JSON`，以下代码输出什么

`Array.from`