前端小知识Day3

1、如何区分数组和对象？

// 方法1 ：通过 ES6 中的 Array.isArray 来识别 
console.log(Array.isArray([]))  // true 
console.log(Array.isArray({}))  // false 
// 方法2 ：通过 instanceof 来识别 
console.log([] instanceof Array)  // true 
console.log({} instanceof Array)  // false
// 方法3 ：通过调用 constructor 来识别 
console.log([].constructor)  // [Function: Array] 
console.log({}.constructor)  // [Function: Object] 
// 方法4 ：通过 Object.prototype.toString.call 方法来识别
console.log(Object.prototype.toString.call([]))  // [object Array] 
console.log(Object.prototype.toString.call({}))  // [object Object]

2、js中的undefined 和 ReferenceError: xxx is not defined 有什么区别？

ReferenceError：当尝试引用一个未定义的变量/函数时，就会抛出ReferenceError。 undefined：当一个变量声明后，没有被赋值，那么它就是undefined类型。

3、使用js生成1-10000的数组

// 方法一 
Array.from(new Array(10001).keys()).slice(1) 
// 方法二 
Array.from({length:10000},(node,i)=> i+1)

4、clientWidth/clientHeight, offsetWidth/offsetHeight 与 scrollWidth/scrollHeight 的区别？

• clientWidth/clientHeight** 返回的是元素的内部宽度，它的值只包含 content + padding，如果有滚动条，不包含滚动条。 clientTop 返回的是上边框的宽度。 clientLeft 返回的左边框的宽度。
• offsetWidth/offsetHeight** 返回的是元素的布局宽度，它的值包含 content + padding + border ，包含了滚动条。 offsetTop 返回的是当前元素相对于其 offsetParent 元素的顶部的距离。 offsetLeft 返回的是当前元素相对于其 offsetParent 元素的左部的距离。
• scrollWidth/scrollHeight** 返回值包含 content + padding + 溢出内容的尺寸。 scrollTop 属性返回的是一个元素的内容垂直滚动的像素数。 scrollLeft 属性返回的是元素滚动条到元素左边的距离。

5、将数组的length设置为0，取第一个元素会返回什么？

设置 length = 0 会清空数组，所以会返回 undefined。