JS高程学习笔记:ECMAScript引用类型之Array类型…

2018-06-24 02:11:43来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

  ECMAScript数组与其他语言的数组一样都是有序列表,ECMAScript数组的每一项可以保存任何类型的数据,也就是说,每一项都可以包含不同的对象、字符串、数组等。而且,ECMAScript数组的大小可以动态地调整的,即可以随着数据添加自动增长容纳新增数据。

 

创建数组的基本方式

  第一种是使用Array构造函数:

打开谷歌浏览器 Developer Tools快捷键(ctrl + shift + J)拷贝以下代码就可以调试了

var num = new Array();//创建一个空的数组
var num = new Array(20);//创建一个length值为20的数组
var num = new Array("1","2","3");//创建一个包含三个字符的数组

 

可以通过构造函数传递一个值来创建数组,如果传递其他类型的参数,则会创建包含那个值的只有一项的数组。

var num = new Array(3); //创建一个包含3个项的数组,可省略new
var num1 = new Array("yellwo");//创建包含一项的数组,可省略new

  第二种是使用数组字面量表示法:

var num = ["1", "2", "3"];//["1", "2", "3"]
var num1 = [];//[]
var num2 = [1,2,];//[1,2,undefined]
var num3 = [,,];//[undefined,undefined,undefined]
console.log(num);

在IE中,num2与num3都会有三项值(IE8及更早的版本中),在空的数组内会创建创建一个undefined的值;而在其他浏览器中num2会有两项分别是1,2;而num3会有两个undefined,这种方法一般不推荐使用,因为IE的实现与其他浏览器不一致,会有浏览器兼容性问题。、

 

 读取与设置

在读取和设置数组的值时,要使用方括号并提供相应值的基于0开始索引:

var num = ['1', '2', '3'];//定义一个字符串数组
console.log(num[0]);//索引第一项
num[2] = "4";//修改数组中的第三项
num[3] = "5";//新值第五项
console.log(num);

 

 

 

 

 

 

 

 

 

获取数组长度

 数组的项数保存在length属性中,这个属性始终会返回0或更大的值:

var str = ["one", "two", "three"];
var num = [];

console.log(str.length);//3
console.log(num.length);//0

 

设置这个属性可以向属性添加项或在末尾移除项:

var str = ["one", "two", "three"];//创建包含3个字符串的数组
str.length = 2;
console.log(str[2]);//undefined

设置大于项数:

var str = ["one", "two", "three"];//创建包含3个字符串的数组
str.length = 4;
console.log(str[3]);//undefined

使用length属性可以向末尾添加新项

var str = ["one", "two", "three"];//创建包含3个字符串的数组
str[str,length] = "four";//添加到第四个项
str[str.length] = "five";//添加到第五个项

数组最后一项始终时length-1,所以说下一个新项的位置就是length;

var str = ["one", "two", "three"];//创建包含3个字符串的数组
str[99] = "Ninety-nine";
console.log(str.length);//100

 

 

检测数组

instanceof

在ECMAScript3做出规定以后,对于一个网页或全局作用域来说,可以使用instanceof操作符可以检测到:

var arr = [];
console.log(arr instanceof Array);//true

使用instanceof可以检测数组并返回true,如果不是数组对象则返回false,但instanceof操作符也有问题,假定只有一个全局执行环境。如果网页中包含多个框架,那实际上就存在两个以上不同的全局执行环境,从而存在两个以上不同版本的Array的构造函数。如果你从一个框架向另一个框架传入数组,那么这两个都是不同构造函数生成的数组;

Array.isArray()

  为了解决这个问题,ECMAScript5新值了Array.isArray()方法。这个方法的目的是最终确定某个值到底是不是数组,而不管它是在哪些全局执行环境创建的:

var arr = [];
console.log(Array.isArray(arr));//true

IE9以上已经实现这个方法;

 

转换方法

toString和valueOf

var str = ["one", "two", "three"];
console.log(str.toString());//one,two,three 返回字符串
console.log(str.valueOf());//["one", "two", "three"] 返回数组
console.log(str);//["one", "two", "three"] 返回数组

 toString()方法会将每个返回数组的字符串表示,每个字符串表示拼接成了一个字符串,中间用逗号分隔开来。valueOf方法会返回 Array 对象的原始值;

toLocaleString

var person1 = {
toLocaleString : function () {
return "1";
},
toString : function() {
return "2";
}
};
var person2 = {
toLocaleString : function () {
return "1";
},
toString : function() {
return "2";
}
};
var people = [person1, person2];
console.log(people); //
console.log(people.toString()); //
console.log(people.toLocaleString()); //

我们看到上述在谷歌浏览器Developer Tools中运行的结果,直接调用people返回对应的函数,而执行了toString()方法和toLocaleString()方法返回各自方法的返回值;

 join()

var arr = ["1", "2", "3"];
console.log(arr.join(","));//1,2,3
console.log(arr.join("||"));//1||2||3

使用join方法可以使用不同的分隔符来构建这个字符串,join方法接收一个参数,这个参数用来分隔字符串,然后返回包含数组所有项的字符串。

 

总结:

  1. 创建数组有两种方式一种是Array构造函数方法,一种是数组字面量表示法;
  2. length属性可以在数组中设置添加项或在末尾移除项;
  3. 使用instanceOf方法检测数组在多个全局环境传递数组会有兼容性问题;
  4. Array.isArray()方法可以决解掉这样的问题,但要IE9以上才能实现兼容;

 

 如果有错误或者不严谨的地方,请务必给予指正,十分感谢。如果您喜欢或者有所启发,欢迎添加收藏,一起加油学习啊。

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:初识gulp

下一篇:面试整理(1):原生ajax