前端面试题总结——JS(持续更新中)

作者: 560b7bb7b879 | 来源:发表于2019-06-29 14:14 被阅读3次

    前端面试题总结——JS(持续更新中)

    1.javascript的typeof返回哪些数据类型

    Object number function boolean underfind string

    2.例举3种强制类型转换和2种隐式类型转换?

    强制(parseInt,parseFloat,number)
    隐式(== - ===)

    3.split() join() 的区别

    前者是切割成数组的形式,后者是将数组转换成字符串

    4.数组方法pop() push() unshift() shift()

    Unshift()头部添加 shift()头部删除
    Push()尾部添加 pop()尾部删除

    5.IE和DOM事件流的区别

    1.执行顺序不一样、
    2.参数不一样
    3.事件加不加on
    4.this指向问题

    6.IE和标准下有哪些兼容性的写法

    Var ev = ev || window.event
    document.documentElement.clientWidth || document.body.clientWidth
    Var target = ev.srcElement||ev.target

    7.ajax请求的时候get 和post方式的区别

    1.一个在url后面 一个放在虚拟载体里面
    2.有大小限制
    3.安全问题
    4.应用不同 一个是论坛等只需要请求的,一个是类似修改密码的

    8.call和apply的区别

    Object.call(this,obj1,obj2,obj3)
    Object.apply(this,arguments)

    9.ajax请求时,如何解析json数据

    使用eval parse 鉴于安全性考虑 使用parse更靠谱

    10.写一个获取非行间样式的函数

    function getStyle(obj, attr, value) {
    if(!value) {
    if(obj.currentStyle) {
    return obj.currentStyle(attr)
    }
    else {
    obj.getComputedStyle(attr, false)
    }
    }
    else {
    obj.style[attr]=value
    }
    }
    

    11.事件委托(代理)是什么

    让利用事件冒泡的原理,让自己的所触发的事件,让他的父元素代替执行!

    12.闭包是什么,有什么特性,对页面有什么影响

    闭包就是能够读取其他函数内部变量的函数。
    http://blog.csdn.net/gaoshanw... (问这个问题的不是一个公司)
    也可以直接点击此处查看之前更的关于闭包的文章

    13.如何阻止事件冒泡和默认事件

    stoppropagation / preventdefault

    14.添加 插入 替换 删除到某个接点的方法

    obj.appendChidl()
    obj.innersetBefore
    obj.replaceChild
    obj.removeChild

    15.解释jsonp的原理,以及为什么不是真正的ajax

    动态创建script标签,回调函数
    Ajax是页面无刷新请求数据操作

    16.javascript的本地对象,内置对象和宿主对象

    本地对象为array obj regexp等可以new实例化
    内置对象为gload Math 等不可以实例化的
    宿主为浏览器自带的document,window 等

    17.document load 和document ready的区别

    页面加载完成有两种事件:
    一.是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件)。
    二.是onload,指示页面包含图片等文件在内的所有元素都加载完成。

    18.”==”和“===”的不同

    前者会自动转换类型
    后者不会

    19.javascript的同源策略

    同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义,
    一段脚本只能读取来自于同一来源的窗口和文档的属性,这里的同一来源指的是协议、域名和端口号的组合

    20.最快捷的数组求最大值

    var arr = [ 1,5,1,7,5,9];
    Math.max(...arr)  // 9 
    
    

    21.更短的数组去重写法

    [...new Set([2,"12",2,12,1,2,1,6,12,13,6])]
    
    // [2, "12", 12, 1, 6, 13]
    
    

    22.排序算法

    升序:

    var numberArray = [3,6,2,4,1,5];
    numberArray.sort(function(a,b){  
       return a-b;
    })
    console.log(numberArray);
    
    

    23.冒泡排序

    var examplearr=[8,94,15,88,55,76,21,39];
    function sortarr(arr){
        for(i=0;i<arr.length-1;i++){
            for(j=0;j<arr.length-1-i;j++){
                if(arr[j]>arr[j+1]){
                    var temp=arr[j];
                    arr[j]=arr[j+1];
                    arr[j+1]=temp;
                }
            }
        }
        return arr;
    }
    sortarr(examplearr);
    console.log(examplearr);
    
    

    24.null和undefined的区别:

    null:表示无值;undefined:表示一个未声明的变量,或已声明但没有赋值的变量,
    或一个并不存在的对象属性。

    25.使用闭包的注意点:

    1.由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。

    2.闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),把内部变量当作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值。
    (关于闭包,详细了解请看JavaScript之作用域与闭包详解)

    26.请解释JSONP的工作原理,以及它为什么不是真正的AJAX。

    JSONP (JSON with Padding)是一个简单高效的跨域方式,HTML中的script标签可以加载并执行其他域的javascript,于是我们可以通过script标记来动态加载其他域的资源。例如我要从域A的页面pageA加载域B的数据,那么在域B的页面pageB中我以JavaScript的形式声明pageA需要的数据,然后在 pageA中用script标签把pageB加载进来,那么pageB中的脚本就会得以执行。JSONP在此基础上加入了回调函数,pageB加载完之后会执行pageA中定义的函数,所需要的数据会以参数的形式传递给该函数。JSONP易于实现,但是也会存在一些安全隐患,如果第三方的脚本随意地执行,那么它就可以篡改页面内容,截获敏感数据。但是在受信任的双方传递数据,JSONP是非常合适的选择。

    AJAX是不跨域的,而JSONP是一个是跨域的,还有就是二者接收参数形式不一样!

    27.请解释变量声明提升。

    在函数执行时,把变量的声明提升到了函数顶部,而其值定义依然在原来位置。

    28.如何从浏览器的URL中获取查询字符串参数。

    以下函数把获取一个key的参数。

      function parseQueryString ( name ){
          name = name.replace(/[\[]/,"\\\[");
          var regexS = "[\\?&]"+name+"=([^&#]*)";
          var regex = new RegExp( regexS );
          var results = regex.exec( window.location.href );
    
          if(results == null) {
              return "";
          } else {
         return results[1];
         }
     }
    

    29.arguments是什么?

    arguments虽然有一些数组的性质,但其并非真正的数组,只是一个类数组对象。
    其并没有数组的很多方法,不能像真正的数组那样调用.jion(),.concat(),.pop()等方法。

    30.什么是”use strict”;?使用它的好处和坏处分别是什么?

    在代码中出现表达式-“use strict”; 意味着代码按照严格模式解析,这种模式使得Javascript在更严格的条件下运行。

    好处:
    1.消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;
    2.消除代码运行的一些不安全之处,保证代码运行的安全;
    3.提高编译器效率,增加运行速度;

    坏处:
    1.同样的代码,在”严格模式”中,可能会有不一样的运行结果;一些在”正常模式”下可以运行的语句,在”严格模式”下将不能运行。

    31.什么是回调函数?

    1.就是一个函数的调用过程。那么就从理解这个调用过程开始吧。
    函数a有一个参数,这个参数是个函数b,当函数a执行完以后执行函数b。那么这个过程就叫回调。

    2.另外种解释:开发网站的过程中,我们经常遇到某些耗时很长的javascript操作。其中,既有异步的操作(比如ajax读取服务器数据),也有同步的操作(比如遍历一个大型数组),它们都不是立即能得到结果的。
    通常的做法是,为它们指定回调函数(callback)。即事先规定,一旦它们运行结束,应该调用哪些函数。

    32.使用 typeof bar === “object” 判断 bar 是不是一个对象有神马潜在的弊端?如何避免这种弊端?

    let obj = {};
    let arr = [];
    
    console.log(typeof obj === 'object');  //true
    console.log(typeof arr === 'object');  //true
    

    从上面的输出结果可知,typeof bar === “object” 并不能准确判断 bar 就是一个 Object。可以通过 Object.prototype.toString.call(bar) === “[object Object]” 来避免这种弊端:

    let obj = {};
    let arr = [];
    
    console.log(Object.prototype.toString.call(obj));  //[object Object]
    console.log(Object.prototype.toString.call(arr));  //[object Array]
    

    33.下面的代码会输出什么?为什么?

    
        console.log(1 +  "2" + "2"); //122
        console.log(1 +  +"2" + "2"); //32
        console.log(1 +  -"1" + "2"); //02
        console.log(+"1" +  "1" + "2"); //112
        console.log( "A" - "B" + "2"); //NaN2
        console.log( "A" - "B" + 2); //NaN
        console.log('3' + 2 + 1);//321
        console.log(typeof +'3');  //number
        console.log(typeof (''+3));  //string
        console.log('a' * 'sd');   //NaN
    
    

    34.逻辑运算

    或逻辑时:当0在前面时console.log((0|| 2));则输出为后面的数,为2;

    当除0以为的数在前面时console.log((2|| 0));则输出为2;
    

    与逻辑时:当只要有0时console.log(0&&2 );则输出都为0;

         当不存在0时,console.log(1&&2 );则输出都为后面的一个,为2;
                     console.log(2&&1 );则输出为1;
    
    

    35.在 JavaScript,常见的 false 值:

    0, '0', +0, -0, false, '',null,undefined,null,NaN

    要注意空数组([])和空对象({}):

    
        console.log([] == false) //true
        console.log({} == false) //false
        console.log(Boolean([])) //true          
    
    

    36.解释下面代码的输出

     var a={},
            b={key:'b'},
            c={key:'c'};
    
        a[b]=123;
        a[c]=456;
    
        console.log(a[b]);
    
    

    因为在设置对象属性时,JS将隐式地stringify参数值。
    在本例中,由于b和c都是对象,它们都将被转换为“[object object]”。
    因此,a[b]和[c]都等价于[[object object]],并且可以互换使用。
    所以,设置或引用[c]与设置或引用a[b]完全相同。`

    37.解释下面代码的输出

    (function(x) {
        return (function(y) {
            console.log(x);
        })(2)
    })(1);
    
    

    输出1,闭包能够访问外部作用域的变量或参数。

    38.请写出以下输出结果:

    function Foo() {
        getName = function () { alert (1); };
        return this;
    }
    Foo.getName = function () { alert (2);};
    Foo.prototype.getName = function () { alert (3);};
    var getName = function () { alert (4);};
    function getName() { alert (5);}
    
    Foo.getName(); //2
    getName(); //4
    Foo().getName(); //1
    getName(); //1
    new Foo.getName(); //2
    new Foo().getName(); //3
    new new Foo().getName(); //3
    
    

    39.谈谈你对Ajax的理解?(概念、特点、作用)

    AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML)是指一种创建交互式网页应用的开发技术、改善用户体验,实现无刷新效果。

    优点

    a、不需要插件支持
    b、优秀的用户体验
    c、提高Web程序的性能
    d、减轻服务器和带宽的负担

    缺点

    a、破坏浏览器“前进”、“后退”按钮的正常功能,可以通过简单的插件弥补
    b、对搜索引擎的支持不足

    40.说说你对延迟对象deferred的理解?

    a、什么是deferred对象

    在回调函数方面,jQuery的功能非常弱。为了改变这一点,jQuery开发团队就设计了deferred对象。
    简单说,deferred对象就是jQuery的回调函数解决方案。在英语中,defer的意思是”延迟”,所以deferred对象的含义就是”延迟”到未来某个点再执行。
    它解决了如何处理耗时操作的问题,对那些操作提供了更好的控制,以及统一的编程接口。

    b、它的主要功能,可以归结为四点:

    (1)、实现链式操作
    (2)、指定同一操作的多个回调函数
    (3)、为多个操作指定回调函数
    (4)、普通操作的回调函数接口

    41.什么是跨域,如何实现跨域访问?

    跨域是指不同域名之间相互访问。
    JavaScript同源策略的限制,A域名下的JavaScript无法操作B或是C域名下的对象

    实现:

    (1)、JSONP跨域:利用script脚本允许引用不同域下的js实现的,将回调方法带入服务器,返回结果时回调。
    1 通过jsonp跨域

        1.原生实现:
    
    <script>
                var script = document.createElement('script');
                script.type = 'text/javascript';
    
                // 传参并指定回调执行函数为onBack
                script.src = 'http://www.....:8080/login?user=admin&callback=onBack';
                document.head.appendChild(script);
    
                // 回调执行函数
                function onBack(res) {
                    alert(JSON.stringify(res));
                }
             </script>
    
    2.document.domain + iframe跨域  
        此方案仅限主域相同,子域不同的跨域应用场景。
        1.父窗口:(http://www.domain.com/a.html)
    
      <iframe id="iframe" src="http://child.domain.com/b.html"></iframe>
            <script>
                document.domain = 'domain.com';
                var user = 'admin';
            </script>
                2.子窗口:(http://child.domain.com/b.html)
    
      <script>
                document.domain = 'domain.com';
                // 获取父窗口中变量
                alert('get js data from parent ---> ' + window.parent.user);
            </script>
    弊端:请看下面渲染加载优化
    
    1、 nginx代理跨域
    2、 nodejs中间件代理跨域
    3、 后端在头部信息里面设置安全域名
    
    

    (3)、跨域资源共享(CORS)
    跨域资源共享(CORS)是一种网络浏览器的技术规范,它为Web服务器定义了一种方式,允许网页从不同的域访问其资源。

    CORS与JSONP相比:

    a、JSONP只能实现GET请求,而CORS支持所有类型的HTTP请求。
    b、使用CORS,开发者可以使用普通的XMLHttpRequest发起请求和获得数据,比起JSONP有更好的错误处理。
    c、JSONP主要被老的浏览器支持,它们往往不支持CORS,而绝大多数现代浏览器都已经支持了CORS。
    更多跨域的具体内容请看 https://segmentfault.com/a/11...

    42.为什么要使用模板引擎?

    a.模板引擎(这里特指用于Web开发的模板引擎)是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,用于网站的模板引擎就会生成一个标准的HTML文档。
    b.在一些示例中javascript有大量的html字符串,html中有一些像onclick样的javascript,这样javascript中有html,html中有javascript,代码的偶合度很高,不便于修改与维护,使用模板引擎可以解决问题。

    43.根据你的理解,请简述JavaScript脚本的执行原理?

    JavaScript是一种动态、弱类型、基于原型的语言,通过浏览器可以直接执行。
    当浏览器遇到<script> 标记的时候,浏览器会执行之间的javascript代码。嵌入的js代码是顺序执行的,每个脚本定义的全局变量和函数,都可以被后面执行的脚本所调用。 变量的调用,必须是前面已经声明,否则获取的变量值是undefined。

    44.JavaScript的数据类型有哪些?

    基本数据类型:字符串 String、数字 Number、布尔Boolean
    复合数据类型:数组 Array、对象 Object
    特殊数据类型:Null 空对象、Undefined 未定义

    45.ionic和angularjs的区别?

    a、ionic是一个用来开发混合手机应用的,开源的,免费的代码库。可以优化html、css和js的性能,构建高效的应用程序,而且还可以用于构建Sass和AngularJS的优化。
    b、AngularJS通过新的属性和表达式扩展了HTML。AngularJS可以构建一个单一页面应用程序(SPAs:Single Page Applications)。
    c、Ionic是一个混合APP开发工具,它以AngularJS为中间脚本工具(称为库,似乎又不恰当),所以,你如果要使用Ionic开发APP,就必须了解AngularJS。

    46.谈谈你对闭包的理解?

    (1)、使用闭包主要是为了设计私有的方法和变量。闭包的优点是可以避免全局变量的污染,
    缺点是闭包会常驻内存,会增大内存使用量,使用不当很容易造成内存泄露。

    (2)、闭包有三个特性:
    a、函数嵌套函数
    b、函数内部可以引用外部的参数和变量
    c、参数和变量不会被垃圾回收机制回收

    47.谈谈你This对象的理解?

    回答一:

    (1)、js的this指向是不确定的,也就是说是可以动态改变的。call/apply 就是用于改变this指向的函数,这样设计可以让代码更加灵活,复用性更高
    (2)、this 一般情况下,都是指向函数的拥有者。
    (3)、在函数自执行里,this 指向的是 window 对象。

    扩展:关于this,还有一个地方比较让人模糊的是在dom事件里,通常有如下3种情况:
    a、使用标签属性注册事件,此时this指向的是window对象。
    b、对与a,要让this指向input,可以将this作为参数传递。
    c、使用addEventListener等注册事件。此时this也是指向 input。

    回答二:

    (1)、处于全局作用域下的this:

    this;/*window*/
    var a = {name: this}/*window*/
    var b = [this];/*window*/
    
    

    在全局作用域下,this默认指向window对象。

    (2)、处在函数中的this,又分为以下几种情况:
    a、一般定义的函数,然后一般的执行:

    var a = function(){
    console.log(this);
    }
    a();/*window*/
    
    

    this还是默认指向window。

    b、一般定义,用new调用执行:

    var a = function(){
    console.log(this);
    }
    new a();/*新建的空对象*/
    
    

    这时候让this指向新建的空对象,我们才可以给空对象初始化自有变量
    c、作为对象属性的函数,调用时:

    var a = {
    f:function(){
    console.log(this)
    }
    }
    a.f();/*a对象*/
    
    

    这时候this指向调用f函数的a对象。
    (3)、通过call()和apply()来改变this的默认引用:

    var b = {id: 'b'};
    var a = {
    f:function(){
    console.log(this)
     }
    }
    a.f.call(b);/*window*/
    
    

    所有函数对象都有的call方法和apply方法,它们的用法大体相似,f.call(b);的意思 是,执行f函数,并将f函数执行期活动对象里的this指向b对象,这样标示符解析时,this就会是b对象了。不过调用函数是要传参的。所以,f.call(b, x, y); f.apply(b, [x, y]);好吧,以上就是用call方法执行f函数,与用apply方法执行f函数时传参方式,它们之间的差异,大家一目了然:apply通过数组的方式传递参数,call通过一个个的形参传递参数。
    (4)、一些函数特殊执行情况this的指向问题:

    a、setTimeout()和setInverval():
    
    var a = function(){
    console.log(this);
    }
    setTimeout(a,0);/*window*/
    setInterval()类似。 
    
    

    b、dom模型中触发事件的回调方法执行中活动对象里的this指向该dom对象。

    48.JavaScript对象的几种创建方式?

    (1) 工厂模式

    function Parent(){
    var Child = new Object();
    Child.name="欲泪成雪";
    Child.age="20";
    return Child;
    };
    var x = Parent();
    
    

    引用该对象的时候,这里使用的是 var x = Parent()而不是 var x = new Parent();因为后者会可能出现很多问题(前者也成为工厂经典方式,后者称之为混合工厂方式),不推荐使用new的方式使用该对象

    (2)构造函数方式

    function Parent(){
      this.name="欲泪成雪";
      this.age="20";
    };
    var x =new Parent();
    
    

    (3) 原型模式

    function Parent(){
    };
    Parent.prototype.name="欲泪成雪";
    Parent.prototype.age="20";
    var x =new Parent();
    
    

    (4)混合的构造函数,原型方式(推荐)

    function Parent(){
      this.name="欲泪成雪";
      this.age=22;
    };
    Parent.prototype.lev=function(){
      return this.name;
    };
    var x =new Parent();
    
    

    (5)动态原型方式

    function Parent(){
      this.name="欲泪成雪";
      this.age=22;
    ;
    if(typeof Parent._lev=="undefined"){
    Parent.prototype.lev=function(){
      return this.name;
    }
    Parent._lev=true;
    }
    };
    var x =new Parent();
    
    

    49.请写出js内存泄漏的问题?

    回答一:

    (1)、IE7/8 DOM循环引用导致内存泄漏
    a、多个对象循环引用
    b、循环引用自己

    (2)、基础的DOM泄漏
    当原有的DOM被移除时,子结点引用没有被移除则无法回收。

    (3)、timer定时器泄漏
    这个时候你无法回收buggyObject,解决办法,先停止timer然后再回收

    回答二:

    内存泄漏指任何对象在您不再拥有或需要它之后仍然存在。
    垃圾回收器定期扫描对象,并计算引用了每个对象的其他对象的数量。如果一个对象的引用数量为 0(没有其他对象引用过该对象),或对该对象的惟一引用是循环的,那么该对象的内存即可回收。

    setTimeout 的第一个参数使用字符串而非函数的话,会引发内存泄漏。
    闭包、控制台日志、循环(在两个对象彼此引用且彼此保留时,就会产生一个循环)也会引发内存泄漏问题。

    50.JS应该放在什么位置?

    (1)、放在底部,虽然放在底部照样会阻塞所有呈现,但不会阻塞资源下载。
    (2)、如果嵌入JS放在head中,请把嵌入JS放在CSS头部。
    (3)、使用defer(只支持IE)
    (4)、不要在嵌入的JS中调用运行时间较长的函数,如果一定要用,可以用setTimeout来调用

    51.请你解释一下事件冒泡机制

    a、在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层次的最顶层,即document对象(有些浏览器是window)。

    b、冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发

    c、js冒泡机制是指如果某元素定义了事件A,如click事件,如果触发了事件之后,没有阻止冒泡事件,那么事件将向父级元素传播,触发父类的click函数。

    //阻止冒泡时间方法,兼容ie(e.cancleBubble)和ff(e.stopProgation)

    function stopBubble(e){
    var evt = e||window.event;
    evt.stopPropagation?evt.stopPropagation():(evt.cancelBubble=true);//阻止冒泡
    evt.preventDefault
    
    

    51.说说你对Promise的理解?

    ES6 原生提供了 Promise 对象。
    所谓 Promise,就是一个对象,用来传递异步操作的消息。它代表了某个未来才会知道结果的事件(通常是一个异步操作),并且这个事件提供统一的 API,可供进一步处理。

    Promise 对象有以下两个特点:

    (1)、对象的状态不受外界影响。Promise 对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是 Promise 这个名字的由来,它的英语意思就是「承诺」,表示其他手段无法改变。

    (2)、一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise 对象的状态改变,只有两种可能:从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果。就算改变已经发生了,你再对 Promise 对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

    有了 Promise 对象,就可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise 对象提供统一的接口,使得控制异步操作更加容易。

    Promise 也有一些缺点。首先,无法取消 Promise,一旦新建它就会立即执行,无法中途取消。其次,如果不设置回调函数,Promise 内部抛出的错误,不会反应到外部。第三,当处于 Pending 状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。

    52.说说你对原型(prototype)理解?

    JavaScript是一种通过原型实现继承的语言与别的高级语言是有区别的,像java,C#是通过类型决定继承关系的,JavaScript是的动态的弱类型语言,总之可以认为JavaScript中所有都是对象,在JavaScript中,原型也是一个对象,通过原型可以实现对象的属性继承,JavaScript的对象中都包含了一个” prototype”内部属性,这个属性所对应的就是该对象的原型。

    “prototype”作为对象的内部属性,是不能被直接访问的。所以为了方便查看一个对象的原型,Firefox和Chrome内核的JavaScript引擎中提供了”proto“这个非标准的访问器(ECMA新标准中引入了标准对象原型访问器”Object.getPrototype(object)”)。

    原型的主要作用就是为了实现继承与扩展对象。

    53.在 JavaScript 中,instanceof用于判断某个对象是否被另一个函数构造。

    使用 typeof 运算符时采用引用类型存储值会出现一个问题,无论引用的是什么类型的对象,它都返回 “object”。ECMAScript 引入了另一个 Java 运算符 instanceof 来解决这个问题。instanceof 运算符与 typeof 运算符相似,用于识别正在处理的对象的类型。与 typeof 方法不同的是,instanceof 方法要求开发者明确地确认对象为某特定类型。

    54.纯数组排序

    常见有冒泡和选择,这里利用sort排序

     export const orderArr=(arr)=>{
            arr.sort((a,b)=>{
                return a-b //将arr升序排列,如果是倒序return -(a-b)
            })
        }
    
    

    55.数组对象排序

    export const orderArr=(arr)=>{
            arr.sort((a,b)=>{
                let value1 = a[property];
                let value2 = b[property];
                return value1 - value2;//sort方法接收一个函数作为参数,这里嵌套一层函数用
                //来接收对象属性名,其他部分代码与正常使用sort方法相同
            })
        }      
    
    
    1. 对象遍历

    export const traverseObj=(obj)=>{
            for(let variable in obj){
            //For…in遍历对象包括所有继承的属性,所以如果
             //只是想使用对象本身的属性需要做一个判断
            if(obj.hasOwnProperty(variable)){
                console.log(variable,obj[variable])
            }
            }
        }
    
    

    57.promise

    promise是一种封装未来值的易于复用的异步任务管理机制,主要解决地狱回调和控制异步的顺序

    1.应用方法一

    export const promiseDemo=()=>{
    new Promise((resolve,reject)=>{
        resolve(()=>{
            let a=1;
            return ++a;
        }).then((data)=>{
            console.log(data)//data值为++a的值
        }).catch(()=>{//错误执行这个
    
        })
    })
    }
    
    

    2.应用方法二

    export const promiseDemo=()=>{
    Promise.resolve([1,2,3]).then((data)=>{//直接初始化一个Promise并执行resolve方法
        console.log(data)//data值为[1,2,3]
    })
    }
    
    

    58.如何禁用网页菜单右键?

    <script>
    function Click(){
    window.event.returnValue=false;
    }
    document.oncontextmenu=Click;
    </script>
    恢复方法:javascript:alert(document.oncontextmenu='')
    
    

    如果有想一起学习web前端,想制作酷炫的网页,可以来一下我的前端群:731771211,从最基础的HTML+CSS+JavaScript【炫酷特效,游戏,插件封装,设计模式】到移动端HTML5的项目实战的学习资料都有整理好友都会在里面交流,分享一些学习的方法和需要注意的小细节,每天也会准时的讲一些前端的项目实战,及免费前端直播课程学习

    相关文章

      网友评论

        本文标题:前端面试题总结——JS(持续更新中)

        本文链接:https://www.haomeiwen.com/subject/dzkfqctx.html