每天10个前端小知识 【Day 7】

前端面试基础知识题

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

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

2. e.target 和 e.currentTarget 有什么区别？

e.target：触发事件的元素 e.currentTarget：绑定事件的元素

3. 如何获取到一个实例对象的原型对象？

从构造函数获得原型对象： 构造函数.prototype从对象实例获得父级原型对象：

方法一：对象实例.proto 【 有兼容性问题，不建议使用】

方法二：Object.getPrototypeOf( 对象实例 )

4. 浏览器的同源策略是什么？

同源策略（Same origin policy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说 Web 是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。

它的核心就在于它认为自任何站点装载的信赖内容是不安全的。当被浏览器半信半疑的脚本运行在沙箱时，它们应该只被允许访问来自同一站点的资源，而不是那些来自其它站点可能怀有恶意的资源。

所谓同源是指：域名、协议、端口相同。

另外，同源策略又分为以下两种：

DOM 同源策略：禁止对不同源页面 DOM 进行操作。这里主要场景是 iframe 跨域的情况，不同域名的 iframe 是限制互相访问的。

XMLHttpRequest 同源策略：禁止使用 XHR 对象向不同源的服务器地址发起 HTTP 请求。

5. document.write和innerHTML有什么区别

document.write是直接写入到页面的内容流，如果在写之前没有调用document.open, 浏览器会自动调用open。每次写完关闭之后重新调用该函数，会导致页面被重写。 innerHTML则是DOM页面元素的一个属性，代表该元素的html内容。你可以精确到某一个具体的元素来进行更改。如果想修改document的内容，则需要修改document.documentElement.innerElement。 innerHTML将内容写入某个DOM节点，不会导致页面全部重绘 innerHTML很多情况下都优于document.write，其原因在于其允许更精确的控制要刷新页面的那一个部分。

6. 使用原生js给一个按钮绑定两个onclick事件

//事件监听 绑定多个事件
var btn = document.getElementById("btn"); 
btn.addEventListener("click",hello1);
btn.addEventListener("click",hello2);
function hello1(){  
    alert("hello 1"); 
}
function hello2(){ 
    alert("hello 2"); 
}

7. 什么是类数组对象？

一个拥有 length 属性和若干索引属性的对象就可以被称为类数组对象，类数组对象和数组类似，但是不能调用数组的方法。常见的类数组对象有 arguments 和 DOM 方法的返回结果，还有一个函数也可以被看作是类数组对象，因为它含有 length 属性值，代表可接收的参数个数。

常见的类数组转换为数组的方法有这样几种：

（1）通过 call 调用数组的 slice 方法来实现转换

Array.prototype.slice.call(arrayLike);

（2）通过 call 调用数组的 splice 方法来实现转换

Array.prototype.splice.call(arrayLike, 0);

（3）通过 apply 调用数组的 concat 方法来实现转换

Array.prototype.concat.apply([], arrayLike);

（4）通过 Array.from 方法来实现转换

Array.from(arrayLike);

8. typeof NaN 的结果是什么？

NaN 指“不是一个数字”（not a number），NaN 是一个“警戒值”（sentinel value，有特殊用途的常规值），用于指出数字类型中的错误情况，即“执行数学运算没有成功，这是失败后返回的结果”。 typeof NaN; // “number” NaN 是一个特殊值，它和自身不相等，是唯一一个非自反（自反，reflexive，即 x === x 不成立）的值。而 NaN !== NaN 为 true。

9. JavaScript中的简单数据类型有哪些？

JS 中有六种简单数据类型：undefined、null、boolean、string、number、symbol。

10. 说说你对 new.target 的理解

new.target属性允许你检测函数或构造方法是否是通过new运算符被调用的。 在通过new运算符被初始化的函数或构造方法中，new.target返回一个指向构造方法或函数的引用。在普通的函数调用中，new.target 的值是undefined。 我们可以使用它来检测，一个函数是否是作为构造函数通过new被调用的。