js经典试题1

性能优化：

        懒加载、冻结的对象freeze、数据流的事情、chorme中优化瀑布流，重绘回流了，motterfor
web安全：sql注入，input框转译 xss攻击
组织架构： 高耦合的项目解耦，数据层面的管理、二次封装、数据流的管理，架构分的越细越好。越好维护越好

webpack的插件机制，
mvvm：
mvc：model、controller、view
m-v-vm：Model-View-ViewModel：即模型-视图-视图模型。【模型】指的是后端传递的数据。【视图】指的是所看到的页面。【视图模型】mvvm模式的核心，它是连接view和model的桥梁。它有两个方向：一是将【模型】转化成【视图】，即将后端传递的数据转化成所看到的页面。实现的方式是：数据绑定。二是将【视图】转化成【模型】，即将所看到的页面转化成后端的数据。实现的方式是：DOM 事件监听。这两个方向都实现的，我们称之为数据的双向绑定。总结：在MVVM的框架下视图和模型是不能直接通信的。它们通过ViewModel来通信，ViewModel通常要实现一个observer观察者，当数据发生变化，ViewModel能够监听到数据的这种变化，然后通知到对应的视图做自动更新，而当用户操作视图，ViewModel也能监听到视图的变化，然后通知数据做改动，这实际上就实现了数据的双向绑定。并且MVVM中的View 和 ViewModel可以互相通信。

1、数组的扁平化  flat(Infinity);
   flat、正则、reduce、函数递归
2、数组去重 
   Array.from(new Set(arr));
   两层for循环加splice
   indexOf
   include
   filter
    
3、类数组转化为数组
   Array.from
   Array.prototype.slice.call()
   [...{new Set()}]

4、concat
  Array.prototype.concat.apply([],new Set())

5、Array.prototype.filter()

6、Array.prototype.map()

7、Array.prototype.forEach();

8、Array.prototype.reduce();

9、Function.prototype.apply();

10、Function.prototype.call();

// Function.prototype.apply()
// 第一个参数是绑定的this，默认为window，第二个参数是数组或者类数组
Function.prototype.apply=function(context=window,args){
    if(typeof this !=='function'){
        throw new TypeError('Type Error');
    }
    const fn=Symbol('fn');
    context[fn]=this;
    const res=context(fn)(...args);
    delete context[fn];
    return res;

}


// 与call唯一不同的是，call()方法接受的是一个参数列表

Function.prototype.call=function(context=window,...args){

    if(typeof this !=='function'){
        throw new TypeError('Type Error');
    }
    const fn=Symbol('fn');
    context[fn]=this;
    const res=context(fn)(...args);
    delete context[fn];
    return res;

}



// Function.prototype.bind

Function.prototype.bind=function(context=window,...args){

    if(typeof this !=='function'){
        throw new TypeError('Type Error');
    }

    // 保存this的值
    var self=this;
    return function F(){
        // 考虑new的情况
        if(this instanceof F){
            return new self(...args,...arguments);
        }
        return self.apply(context,[...args,...arguments]);
    }

}