JavaScript数组的一些奇葩行为

Posted 2020-06-08

今天，复习了一下javascript的数组，然后，把他的一些奇葩行为总结了一下，在这里和大家share一下，如果有不对的地方，欢迎指出！

奇葩1：Array()构造器函数可以不使用new关键字进行调用：

Array()构造器使用传递给他的参数作为数组的元素，从而创建数组，一般的，我们是如下调用的：

var a = new Array(1, 2, "bom!");
a.length; //3
console.log(a); //[1, 2, "bom!"]

 

但是，省略掉new也是可以的，如下：

var a = Array(1, 2, "bom!");
a.length; //3
console.log(a); //[1, 2, "bom!"]

虽然，我不知道他的内部实现机制是什么，但是，猜想他的构造器函数可能是如下定义的：

function Array(args) {
    //如果，this不是Array的实例的话，
    //说明不是通过new调用的，则在这里再重新调用
    if( !this instanceof Array) {
        return new Array(args);
    }

    //后面是正常调用时的实现代码
    //...
}

 

奇葩2：当只传一个参数给构造函数时，行为莫测

如果只传一个参数，并且这个参数是一个整数，将会得到一个数组，并且length等于这个参数

var a = new Array(12);
console.log(a.length); //12
console.log(a); //[]

 

如果只传一个浮点数，就会报错：

var a = new Array(1.1); //Uncaught RangeError: Invalid array length(…)




传递一个字符串就会正常工作，并且该字符串作为数组的第一个元素：

var a = new Array("1.1");
console.log(a.length); //
console.log(a); //["1.1"]

 

但是为了避免二义性，我建议最好是是直接使用字面量的形式创建数组：

var a = []; //空数组
var a = [1, 1, "bom"]; //三个元素
var a = [12]; //一个元素，并且元素是12

 

 奇葩3：数组的length属性可以被修改（可写）


如下，我们直接把本来是2的length改成了100，而且还修改成功了！！！

var a = [1, 2, 3, 4];
console.log(a.length); //4
a.length = 100; 
console.log(a.length); //100

虽然length等于100，但是，元素a[4]-a[99]是不存在的，并且如果你请求他们的值的话，例如，从0到a.length做一个循环中做的话，那么会得到undefined。

接下来再看：

var a = [1, 2, 3, 4];
a.length = 100;
console.log(a[10]); //undefined
console.log(99 in a); //false

与下面的例子有点相似：

var a = [1, 2, 3, 4];
a[99] = undefined;
console.log(a.length); //100

不同之处在于，这里的a[99]存在了，因为我们创建了它，即使他拥有的是undefined的值。但是从a[4]到a[98]的所有元素则是不存在的，如下：

var a = [1, 2, 3, 4];
a[99] = undefined;
console.log(99 in a); //true;
console.log(98 in a); //false
console.log(a.length); //100