【JS】Array.of() 创建数组

JavaScript014

【JS】Array.of() 创建数组,第1张

Array.of() 的作用是 创建数组

创建数组本来已经有 字面量 Array构造函数 等方法,但由于 Array构造函数 创建数组时有一些怪异的行为,所以 ES6 添加了 Array.of() 来弥补 Array构造函数 的不足。

以上是 Array构造函数 的用法,也是 Array构造函数 的怪异行为。

new Array() 当只传入一个参数时,不能传入负数,也不能传入浮点数。

在使用 new Array 时,一不小心就会创建出稀疏数组。这个动作会产生一些诡异的“空槽”行为,这也是JS数组广为人所诟病的一点。

Array.of() 取代了 Array() 成为数组的推荐函数形式构造器,因为 Array.of() 并没有这个特殊的单一数值型参数值的问题。

Array.of() 总是返回参数值组成的数组。如果没有参数就返回一个空数组。

所以说,Array.of() 的行为比 Array() 更统一。

如果有一个回调函数需要传入的参数封装为数组,而且不能保证传入的值一定不是0或正整数,Array.of()可以完美解决这个问题。

如果需要构建 Array 的子类,并且想要在子类实例中创建和初始化元素。

这里用了reduce方法,这个方法是Array的,这里用 this.reduce 是因为 Calculator 继承了 Array。

Array.reduce的使用方法可以看下面的链接

【JS】遍历数组的常用方法(举例版)

js动态添加数组可以按下面的步骤:

1、在数组的开头添加新元素 - unshift()

源代码:

<!DOCTYPE html>

<html>

<body>

<p id="demo">Click the button to add elements to the array.</p>

<button onclick="myFunction()">Try it</button>

<script>

function myFunction()

{

var fruits = ["Banana", "Orange", "Apple", "Mango"]

fruits.unshift("Lemon","Pineapple")

var x=document.getElementById("demo")

x.innerHTML=fruits

}

</script>

<p><b>Note:</b>The unshift() method does not work properly in Internet Explorer 8 and earlier, the values will be inserted, but the return value will be <em>undefined</em>.</p>

</body>

</html>

测试结果:

Lemon,Pineapple,Banana,Orange,Apple,Mango

2、在数组的第2位置添加一个元素 - splice()

源代码:

<!DOCTYPE html>

<html>

<body>

<p id="demo">Click the button to add elements to the array.</p>

<button onclick="myFunction()">Try it</button>

<script>

function myFunction()

{

var fruits = ["Banana", "Orange", "Apple", "Mango"]

fruits.splice(2,0,"Lemon","Kiwi")

var x=document.getElementById("demo")

x.innerHTML=fruits

}

</script>

</body>

</html> 

测试结果:

Banana,Orange,Lemon,Kiwi,Apple,Mango

3、数组的末尾添加新的元素 - push()

源代码:

<!DOCTYPE html>

<html>

<body>

<p id="demo">Click the button to add a new element to the array.</p>

<button onclick="myFunction()">Try it</button>

<script>

var fruits = ["Banana", "Orange", "Apple", "Mango"]

function myFunction()

{

fruits.push("Kiwi")

var x=document.getElementById("demo")

x.innerHTML=fruits

}

</script>

</body>

</html>

测试结果:

Banana,Orange,Apple,Mango,Kiwi