Filling an array by 1~100 without loop in javascript

Question

I am investigating a question raised in interview. The interviewer ask for a piece of code which could fill the array by 1~100 without a traditional loop. Of course, we couldn't tell him that you just need type 1~100 in your code like "[1,2,3,4...100]".

I have thought about several solutions, only one of them successes. I am using Mozilla FireFox 46.0.1 & Firebug.

Solution 1(failed)

var filled = new Array(100);
filled.map(function(val, index){
  return index+1;
});

// I will get an array whose size is 100 and filled by undefined not int
console.info(filled);

Solution 2(failed)

var filled = new Array(100);
// It seems can't go into this callback function
filled.forEach(function(val, index){
  val = index+1;
});

// It's same as solution 1
console.info(filled);

Solution 3(failed)

var filled = [];
// I guess the root cause is the array doesn't get initialized.
// If I insert a value into index 99, the previous 99 values will be automatically filled by undefined.
filled[99] = 100;
filled.map(function(val, index){
  // only 100:99 can be printed
  console.info(val + ":" + index);
  return index+1;
});
// An array be full with undefined besides the last value.
console.info(filled);

Solution 4(Successed) I search Stackoverflow and find a good solution.

var filled = Array.apply(null, Array(100))
  .map(function(val, index) { 
    return index+1;
  });

console.info(filled);

Investigation of Solution 4 I try to change something in solution 4 and find the truth.

// I just break the chain and it doesn't work. It's so strange.
var filled = Array.apply(null, new Array(100));
filled.map(function(val, index) { 
    return index+1;
  });

console.info(filled);

// In my opinion, Array.apply(null, Array(100)) = this.Array(undefined, undefined,...,undefined);
// So, I start my test

// It works
var filled = this.Array(undefined, undefined, undefined).map(function(val, index) { 
    return index+1;
  });
console.info(filled);

// It doesn't work
var filled = this.Array(undefined, undefined, undefined);
filled.map(function(val, index) { 
    return index+1;
  });
console.info(filled);

According to the above investigation, I firmly trust that the chain coding is the key point. So, I do the following code but it still failed.

var filled = new Array(100).map(function(val, index) { 
    return index+1;
  });
console.info(filled);

I am so confused with the situation, could you please explain it? Thank you very much for your help.

Answer 1

You can make a new array with a defined length and apply some Array#map to it.

The map() method creates a new array with the results of calling a provided function on every element in this array. [Emphasis by NS]

Most of your tries, you mainly forgot to assign the map result.

var filled = Array.apply(null, { length: 100 }).map(function (_, i) {
    return i + 1;
});

document.write('<pre>' + JSON.stringify(filled, 0, 4) + '</pre>');

A newer approach using Array.from.

const
    filled = Array.from({ length: 100 }, (_, i) => i + 1);

console.log(filled);

.as-console-wrapper { max-height: 100% !important; top: 0; }