2018前端必考面试题总结8

2018前端必考面试题总结8

• 
  
• 闭包是什么？有什么特性？对页面有什么影响？
  

“官方”解释：所谓“闭包”，指的是一个拥有许多变量和绑定了这些变量的环境的表达式（通常是一个函数），因而这些变量也是该表达式的一部分。
通俗来讲：就是函数a的内部函数b，被函数a外部的一个变量引用的时候，就创建了一个闭包。

function a(){
            var i=0;
            function b(){
                alert(++i);
            }
            return b;
        }
        var c=a();//变量c实际上是指向了函数b
        c();//弹出一个窗口显示i的值（第一次为1），这段代码其实就创建了一个闭包，因为函数a外的变量c引用了函数a内的函数b

闭包的特性：
（1）封闭性：外界无法访问闭包内部的数据，如果在闭包内声明变量，外界是无法访问的，除非闭包主动向外界提供访问接口；
（2）持久性：一般的函数，调用完毕之后，系统自动自动注销函数，而对于闭包来说，在外部函数被调用之后，闭包结构依然保存在系统之中，闭包中的数据依然存在，从而实现对数据的持久使用。
优点：
（1）减少全局变量；
（2）减少传递函数的参数量；
（3）封装。
缺点：使用闭包会占用内存资源，过多的使用闭包会导致内存溢出等。
对页面的影响：闭包的实质是一个函数，是一个用于返回局部变量值的函数，因为在全局中，受JavaScript链式作用域结构的影响，父级变量中无法访问到子集的变量值，为了解决这个问题，才使用闭包这个概念。使用闭包时，变量的值都保存到内存中，会导致页面加载时内存消耗很大，IE会导致内在泄漏，因此尽量少用或用时要及时删除变量。

• 如何阻止事件冒泡和默认事件？

        //当需要停止冒泡行为时，可以使用
        function stopBubble(e){
            //如果提供了事件对象，则这是一个非IE浏览器
            if(e && e.stopPropagation){
                //因此它支持W3C的stopPropagation()方法
                e.stopPropagation();
            }else{
                //否则，我们需要使用IE的方式来取消事件冒泡
                window.event.cancelBubble=true;
            }
        }

        //当需要阻止默认行为时，可以使用
        function stopDefault(e){
            if(e && e.preventDefault){
                //阻止默认浏览器动作（W3C）
                e.preventDefault();
            }else{
                //IE中阻止函数默认动作的方式
                window.event.returnValue=false;
            }
            return false;
        }

• 添加、删除、替换、插入到某个节点的方法

        var wrap=document.getElementById("wrap");
        var p1=document.createElement("p");//创建p标签
        var div1=document.createElement("div");//创建div标签
        var span1=document.createElement("span");//创建一个span标签
        wrap.appendChild(p1);//添加节点,p1插入wrap节点使其成为wrap节点的最后一个子节点
        wrap.insertBefore(div1,p1);//插入节点,在p1元素前插入一个新元素div1
        wrap.removeChild(p1);//删除节点，删除p1节点
        wrap.replaceChild(span1,div1);//替换节点，用span1节点替换div1节点

• 解释jsonp的原理，以及为什么不是真正的ajax？

  jsonp的原理：动态添加一个script标签，而script标签的src属性是没有跨域的限制的。这样说来，这种跨域方式其实与ajax XmlHttpRequest协议无关了。
  为什么不是真正的ajax呢？
  ajax的核心是通过XmlHttpRequest获取非本页内容。ajax支持get和post请求。
  jsonp的核心是动态添加script标签来调用服务器提供的js脚本。而jsonp只支持get请求。
  ajax和jsonp的调用方式很像，目的一样，都是请求url，然后把服务器返回的数据进行处理，因此jquery和ext等框架都把jsonp作为ajax的一种形式进行了封装

• JavaScript的本地对象，内置对象和宿主对象

  本地对象就是JavaScript中定义好的对象，如String，Date等，内置对象是本地对象中比较特殊的一种，它不用实例化，包括Global和Math，宿主对象就是BOM,DOM和自己定义的对象。