web前端面试题

一.什么是数组扁平化

数组扁平化就是将一个多维数组转化为一个一维数组
1.对数组的每一项进行遍历
2.判断该项是否是数组
3.如果该项不是数组则直接放进新数组中
4.是数组则回到1，继续迭代
5.当数组遍历完成，返回这个新数组

采用递归方式处理

Array.prototype.flatten = function () {
  var resultArr = [];
  var len = this.length;
  for (var i = 0; i < len; i ++) {
    if (Array.isArray(this[i])) {
        resultArr = resultArr.concat(this[i].flatten());
    } else {
      resultArr.push(this[i]);
    }
  }
  return resultArr;
}
var arr=[1,2,3,[4,5,'whdlove',['fendou',88,1314]]]
console.log(arr.flatten())//[1, 2, 3, 4, 5, "whdlove", "fendou", 88, 1314]

二.面象对象

对象：
属性和方法的集合叫做对象（万物皆对象）。
面向对象：
首先就是找对象，如果该对象不具备所需要的方法或属性，那就给它添加。面向对象是一种编程思维的改变。通过原型的方式来实现面向对象编程。
创建对象的方式(4种)：
new Object、字面量、构造函数、原型。
面象对象特点：
1.封装: 低耦合高内聚
2.多态: 重载和重写
3.继承: 子类继承父类方法和属性
VUE/REACT/JQ 基于面向对象构建出来的. new Vue
* 平时都是通过new一个对象的实例来进行操作的.
*
* 通过研究一些实例的属性和方法, 来确定一些问题的分类 根据类的不同 而产生同类问题的解决方案 ===> 面向对象
*
* 我们自己创建的一些组件的封装(轮播图/选项卡/ajax ),方法的封装还有插件, 这些也都是基于面向对象开发的, 通过创造不同的实例, 来管理私有和共有的方法;
*

三. 垃圾回收机制

什么是垃圾：
一般来说没有被引用的对象就是垃圾，就是要被清除， 有个例外如果几个对象引用形成一个环，互相引用，但根访问不到它们，这几个对象也是垃圾，也要被清除。

方法：
①JS具有垃圾自动回收的机制：
周期性执行，找出那些不在继续使用的变量，然后释放其内存。

②标记清除(常见)：
当变量进入环境时，将这个变量标记为“进入环境”。当变量离开环境时，则将其标记为“离开环境”。标记“离开环境”的就回收内存。垃圾回收器完成内存清除工作，销毁那些带标记的值并回收他们所占用的内存空间。

四. iframe的优缺点有哪些？

优点：

• iframe 能够原封不动的把嵌入的网页展现出来。
• 如果有多个网页引用 iframe，那么你只需要修改 iframe 的内容，就可以实现调用的每一个页面内容的更改，方便快捷。
• 网页如果为了统一风格，头部和版本都是一样的，就可以写成一个页面，用 iframe 来嵌套，可以增加代码的可重用。
• 如果遇到加载缓慢的第三方内容如图标和广告，这些问题可以由 iframe 来解决。

缺点：

• 框架结构中出现各种滚动条
• iframe 会阻塞主页面的 Onload 事件
• 搜索引擎的检索程序无法解读这种页面，不利于 SEO
• iframe 和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。

五.函数柯里化（卡瑞化、加里化）？

柯里化(Currying)指的是将原来接受两个参数的函数变成新的接受一个参数的函数的过程。新的函数返回一个以原有第二个参数为参数的函数。
作用：
能进行部分传值，而传统函数调用则需要预先确定所有实参。如果你在代码某一处只获取了部分实参，然后在另一处确定另一部分实参，这个时候柯里化和偏应用就能派上用场。

用途：
我认为函数柯里化是对闭包的一种应用形式，延迟计算、参数复用、动态生成函数(都是闭包的用途)。

function add(x,y){  //普通函数
    console.log(x+y);
}
function curryingAdd(x){  //柯里化函数(闭包)
    return function(y){
        console.log(x+y);
    }
}
add(1,2)  //3
curryingAdd(1)(2)   //3  

六.window的onload事件和domcontentloaded

window.onload：
当一个资源及其依赖资源已完成加载时，将触发onload事件。

document.onDOMContentLoaded：
当初始的HTML文档被完全加载和解析完成之后，DOMContentLoaded事件被触发，而无需等待样式表、图像和子框架的完成加载。

区别：
①onload事件是DOM事件，onDOMContentLoaded是HTML5事件。
②onload事件会被样式表、图像和子框架阻塞，而onDOMContentLoaded不会。
③当加载的脚本内容并不包含立即执行DOM操作时，使用onDOMContentLoaded事件是个更好的选择，会比onload事件执行时间更早。