• JavaScript面试题6



    遍历数组的方式有哪些?

    for

    var arr = [1,2,3,4,5]
    for(var i=0;i<arr.length;i++){
      console.log(arr[i])
    }
    
    • 1
    • 2
    • 3
    • 4

    forEach
    对数组中的每一元素运行给定的函数,没有返回值,常用来遍历元素

    var arr5 = [10,20,30]
    var result5 = arr5.forEach((item,index,arr)=>{
        console.log(item)
    })
    console.log(result5)
    /*
    10
    20
    30
    undefined   该方法没有返回值
    */
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11

    数组自带的foreach循环,使用频率较高,实际上性能比普通for循环弱
    由于foreach是Array型自带的,对于一些非这种类型的,无法直接使用(如NodeList),所以才有了这个变种,使用这个变种可以让类似的数组拥有foreach功能。

    const nodes = document.querySelectorAll('div')
    Array.prototype.forEach.call(nodes,(item,index,arr)=>{
      console.log(item)
    })
    
    • 1
    • 2
    • 3
    • 4

    for…in
    任意顺序遍历一个对象的除Symbol以外的可枚举属性,包括继承的可枚举属性。
    一般常用来遍历对象,包括非整数类型的名称和继承的那些原型链上面的属性也能被遍历。像 Array和 Object使用内置构造函数所创建的对象都会继承自Object.prototype和String.prototype的不可枚举属性就不能遍历了.

    var arr = [1,2,3,4,5]
    for(var i in arr){
      console.log(i,arr[i])
    }  //这里的i是对象属性,也就是数组的下标
    /**
    0 1
    1 2
    2 3
    3 4
    4 5 **/
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    for…of(不能遍历对象)
    在可迭代对象(具有 iterator 接口)(Array,Map,Set,String,arguments)上创建一个迭代循环,调用自定义迭代钩子,并为每个不同属性的值执行语句,不能遍历对象

    let arr=["11","22","33"];
    for (let item of arr){
        console.log(item)
    }
    
    //遍历对象
    let person={name:"aa",age:18,city:"上海"}
    for(let item of Object.keys(person)){
        console.log(person[item])
    }
    // aa 18 上海
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11

    map
    map: 只能遍历数组,不能中断,返回值是修改后的数组

    let arr=[1,2,3];
    const res = arr.map(item=>{
      return item+1
    })
    console.log(res) //[2,3,4]
    console.log(arr) // [1,2,3]
    
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    every
    对数组中的每一运行给定的函数,如果该函数对每一项都返回true,则该函数返回true

    var arr = [10,30,25,64,18,3,9]
    var result = arr.every((item,index,arr)=>{
          return item>3
    })
    console.log(result)  //false
    
    • 1
    • 2
    • 3
    • 4
    • 5

    some
    对数组中的每一运行给定的函数,如果该函数有一项返回true,就返回true,所有项返回false才返回false

    var arr2 = [10,20,32,45,36,94,75]
    var result2 = arr2.some((item,index,arr)=>{
        return item<10
    })
    console.log(result2)  //false
    
    • 1
    • 2
    • 3
    • 4
    • 5

    reduce
    reduce()方法对数组中的每个元素执行一个由你提供的reducer函数(升序执行),将其结果汇总为单个返回值

    const array = [1,2,3,4]
    const reducer = (accumulator, currentValue) => accumulator + currentValue;
    
    // 1 + 2 + 3 + 4
    console.log(array1.reduce(reducer));
    
    • 1
    • 2
    • 3
    • 4
    • 5

    filter
    对数组中的每一运行给定的函数,会返回满足该函数的项组成的数组

    // filter  返回满足要求的数组项组成的新数组
    var arr3 = [3,6,7,12,20,64,35]
    var result3 = arr3.filter((item,index,arr)=>{
        return item > 3
    })
    console.log(result3)  //[6,7,12,20,64,35]
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6

    连续bind()多次,输出的值是什么?

    var bar = function(){
        console.log(this.x);
    }
    var foo = {
        x:3
    }
    var sed = {
        x:4
    }
    var func = bar.bind(foo).bind(sed);
    func(); //?
    
    var fiv = {
        x:5
    }
    var func = bar.bind(foo).bind(sed).bind(fiv);
    func(); //?
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17

    两次都输出 3。
    在Javascript中,多次 bind() 是无效的。
    更深层次的原因, bind() 的实现,相当于使用函数在内部包了一个 call / apply ,第二次 bind() 相当于再包住第一次 bind() ,故第二次以后的 bind 是无法生效的

    new fn与new fn()有什么区别吗?

    用 new 创建构造函数的实例时,通常情况下 new 的构造函数后面需要带括号(譬如:new Parent())。
    有些情况下new的构造函数后带括号和不带括号的情况一致,譬如:

    function Parent(){
      this.num = 1;
    }
    console.log(new Parent());//输出Parent对象:{num:1}
    console.log(new Parent);//输出Parent对象:{num:1}
    
    • 1
    • 2
    • 3
    • 4
    • 5

    但有些情况下new的构造函数后带括号和不带括号的情况并不一致,譬如:

    function Parent(){
      this.num = 1;
    }
    console.log(new Parent().num);//1
    console.log(new Parent.num);//报错
    
    • 1
    • 2
    • 3
    • 4
    • 5

    从报错信息来看,new Parent.num执行顺序是这样的:先执行Parent.num,此时返回结果为undefined;后执行new,因new后面必须跟构造函数,所以new undefined会报错。
    new Parent().num相当于(new Parent()).num,所以结果返回1。
    从结果来看,new Parent.num代码相当于new (Parent.num);,new Parent().num相当于(new Parent()).num。由此看来 new 的构造函数后跟括号优先级会提升。

  • 相关阅读:
    Github已经54k个star的Docker,到底是什么?
    jwt(json web token)
    python学习之【with语句】
    【系统分析师之路】第五章 复盘软件工程(敏捷开发)
    猿创征文|Redis删除策略
    FCN的代码解读
    【优雅至极】利用VSCode进行远程Linux服务器、容器开发,达到ide开发项目的效果
    OpenAI开发者大会:定义未来AI的新功能、愿景和商业版图
    Nginx防盗链
    [Python]跟着代码去学习---二维码1:文字生成二维码
  • 原文地址:https://blog.csdn.net/xiaolu567/article/details/126081605