首页 > 代码库 > 不使用循环,如何创建一个长度为100的数组

不使用循环,如何创建一个长度为100的数组

前言:

问题描述:在不使用循环的条件下,如何创建一个长度为100的数组,并且数组的每一个元素是该元素的下标?

这是一个比较经典的前端面试题,也可以当笔试题,咋一看,好像难度不大,实际上考察的知识点还不少,值得写篇文章来备忘!废话不多说,直接进入正文!

正文

为了理解这道题的意思,我们先用传统的方法来实现一下:

使用for方法:

  var arr = new Array(100);
    for(var i=0;i<arr.length;i++){
        arr[i] = i;
    }
    console.log(arr);

 

 或者是:

  var arr = new Array();
    for(var i=0;i<100;i++){
        arr.push(i);
    }
    console.log(arr);

 

可以得到一个0-99的数组,使用while,do while也可以实现,这里就不写了,那不用循环,怎么得到呢?

第一种:Object.keys()

  var arr = Object.keys(Array.apply(null, {length:100}))
  console.log(arr);

 

这里通过Array.apply(null, {length:100})创建一个长度为100的数组,尽管里面的值为undefined,然后我们使用Object.keys()方法获取数组的key值,那这里就可以get到Object.keys()方法的新技能了,你还不知道,去查查吧!

但是这里得到的数组是一个字符串数组,不是数字,所以我们需要再加工一下,字符串转数字的方法就很多了,这里用map()方法:

  var arr = Object.keys(Array.apply(null, {length:100})).map(function(item){
        return +item;
    });
    console.log(arr);

 

+号是一个转换格式的小技巧,你也可以使用parseInt

第二种:Array.from()

  var arr = Array.from({length:100}, (v,k) => k);
    console.log(arr);

 

这里使用的Array.from()方法,从类数组或可迭代的对象创建一个新数组,你不懂用法,去查查吧!

第三种:Array.keys()

  var arr = new Array(100).keys();
   console.log(Array.from(arr));

 

这里主要使用Array.keys()方法,获取数组的key值

第四种:Object.keys() 与 Array.from()

  var arr = Object.keys(Array.from({length:100}));
   console.log(arr);

这种方式创建的也是一个字符串数组,所以需要转一下,方式跟第一种一样

  var arr = Object.keys(Array.from({length:100})).map(function(item){
        return +item;
    });
    console.log(arr);

 

实现原理大致说一下,先用Array.from得到一个100值为undefined的数组,然后获取数组的key值,最终返回一个数组,不明白的可以仔细领会一下第二种和第三种

第5种:使用...扩展运算符

var arr = [...Array(100).keys()];
console.log(arr);

 

或者可以改写成:

var arr = [...Array.from({length:100}).keys()];
console.log(arr);

 

不熟悉扩展运算符的可以去es6教程里面看一下,这里就不介绍了

第6种:使用String()方法,比较特别

var arr = Object.keys(String(Array(101)));
console.log(arr);

 

这里需要用101位,为什么?因为在创建一个100个值的数组的时候,因为是空值数组,在将数组转成字符串的时候,实际上是存的空值之间的逗号(,),2个值才有一个逗号,3个值有2个逗号,以此类推,100个值需要101位,然后用Object.keys()

方法转成数组,弄懂前面的方法的应该知道,此时的数组是一个字符串数组,所以还需要安装方法一处理一下:

var arr = Object.keys(String(Array(100))).map(function(item){
    return +item;
});
console.log(arr);

 

第7种:使用Int8Array(),比较偏门

var arr = Object.keys(new Int8Array(100)).map(function(item){
    return +item;
});
console.log(arr);

 

需要了解原理的同学,建议看一下Int8Array()的api

第8种:setInterval方法,感觉更偏门了

  var arr = [];
    var i = 0;
    var timer = setInterval(function(){
        arr[i] = i++;
        if(i>=100){
            clearInterval(timer);
            console.log(arr);
        }
    },1);

 

通过定时器的思路,给数组赋值,确实很妙

第9种:受定时器启发,可以用递归调用

  var arr = [];
    var i = 0;
    function MakeArray(num){
        if(i<num){
            arr[i] = i++;
            MakeArray(num);
        }
        return arr;
    }
    console.log(MakeArray(100));

 

第10种:可以使用第七种的变种,请看:

  var arr = new Array(100).toString().split(‘,‘).map(function(item,index){
        return index;
    });
    console.log(arr);

 

我觉得这个知识点给出10种方法,应该差不多了,但是方法远远不止这10种,比如说截取网页中的100个字符,然后获取索引,比如说用二进制等等,奇淫巧技数不胜数,这里就不一一赘述了!

我觉得一个话题或者说一个命题,能够牵扯出别的知识点,学习到更多的技巧,那这个命题就是有价值的,也是有意义的,不想多说了,一张图结束今天的话题!

技术分享

如果你觉得你那里有什么好的实现方式,也可以在评论中发出来给大家参考一下!

原创不易,欢迎转载,转载时请注明出处,谢谢!

 

不使用循环,如何创建一个长度为100的数组