引用类型(二):Array类型

一、js中的数组与其它语言中的数组的区别
1、ECMAScript数组的每一项可以保存任何类型的数据
2、ECMAScript数组的大小是可以动态调整的

二、创建数组的基本方式
1、使用Array构造函数

var colors = new Array();
var colors = new Array(20); //知道长度的情况下
var colors = new Array(‘red‘,‘blue‘,‘green‘);//知道包含的项var

*:也可以省略new

var colors = Array(3);

2、数组字面量表示法。多个数组项之间以逗号隔开

var colors = [‘red‘,‘blue‘,‘green‘]; //创建一个包含3个字符串的数组
var name = []; //创建一个空数组

三、数组的特点
1、数组的length属性很有特点-它不是只读的。因此,通过设置这个属性,可以从数组的末尾移除项或向数组中添加新项
eg1:移除项

var colors = [‘red‘,‘blue‘,‘green‘];
colors.length = 2;
console.log(colors);

eg2:增加项

var colors = [‘red‘,‘blue‘,‘green‘];
colors.length = 4;
console.log(colors);

2、数组是有限的,数组最多可以包含 4 294 967 295 个项,如果超过这个上限值,就会发生异常

四、检测数组
1、if(value instanceof Array){}
问题:它假定只有一个全局执行环境。如果网页中包含多个框架,那实际上就存在两个以上不同的全局执行环境,从而存在两个以上不同版本的Array构造函数。
如果你从一个框架向另一个框架传入一个数组,那么传入的数组与第二个框架中原生创建的数组分别具有鸽子不同的构造函数
2、if(Array.isArray(value)){}

五、转换方法

var colors = [‘red‘,‘blue‘,‘green‘];
console.log(colors.toString()); //"red,blue,green"
console.log(colors.valueof()); //[‘red‘,‘blue‘,‘green‘]
console.log(colors); //[‘red‘,‘blue‘,‘green‘]

alert(colors.toString()); //"red,blue,green"
alert(colors.valueof()); //"red,blue,green"
alert(colors); //"red,blue,green"

六、数组的栈方法
数组可以表现得就像栈一样,后者是一种可以限制插入和删除项的数据结构。栈是一种先进后出,后进先出的数据结构
push()方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组到长度。
pop()方法则从数组末尾移除最后一项,减少数组到length值,然后返回移除的项

var colors = new Array();
colors.push(‘red‘,‘green‘);
console.log(colors); //red,green
colors.pop();
console.log(colors); //red

七、数组的队列方法
队列数据结构的访问规则是先进先出,队列在列表的末端添加项,从列表的前端移除项
push()方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组到长度。
shift()方法移除数组中的第一个项并返回该项,同时将数组长度减1.

var colors = new Array();
colors.push(‘red‘,‘green‘);
console.log(colors); // red,green
colors.shift();
console.log(colors); // green

pop()方法则从数组末尾移除最后一项,减少数组到length值,然后返回移除的项
unshift()方法在前端添加项

var colors = new Array();
colors.unshift(‘red‘,‘green‘);
console.log(colors); //red,green
colors.pop();
console.log(colors); //red

八、重排序方法
reverse()方法会反转数组项的顺序。

var values = [1,2,3,4,5];
values.reverse();
console.log(values); //5,4,3,2,1

sort()方法按升序排列数组项-即最小的值位于最前面,最大的值排在最后吗。
升序

function compare(value1,value2){
    if(value1 < value2){
        return -1;
    }else if(value1>value2){
        return 1;
    }else{
        return 0;
    }
}
var values = [0,1,5,10,15];
values.sort(compare);
console.log(values); //0,1,5,10,15    

降序

function compare(value1,value2){
    if(value1 < value2){
        return 1;
    }else if(value1>value2){
        return -1;
    }else{
        return 0;
    }
}
var values = [0,1,5,10,15];
values.sort(compare);
console.log(values); //15,10,5,1,0

九、操作方法
1、concat()方法基于当前数组中的所有项创建一个新数组

var colors = [‘red‘,‘green‘,‘blue‘];
var colors2 = colors.concat(‘yellow‘,[‘black‘,‘brown‘])
console.log(colors);
console.log(colors2);

2、slice()方法能够基于当前数组中一或多个项创建一个新数组。slice()方法可以接受一或两个参数,即要返回项的起始和结束位置。
eg2:

var colors = [‘red‘,‘green‘,‘black‘,‘blue‘,‘purple‘];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);
console.log(colors2);
console.log(colors3);
var colors3 = colors.slice(1,4,‘orange‘,‘yellow‘)

十、位置方法
1、indexOf(),lastIndexOf()方法接收两个参数,要查找的项和可选的表示查找起点位置的索引

var numbers = [1,2,3,4,5,4,3,2,1];
//indexOf,从左往右,查找第一个位置
console.log(numbers.indexOf(4)); //3
//lastIndexOf()从左往右查找最后出现的位置
console.log(numbers.lastIndexOf(4)); //5

十一、迭代方法
1、every():对数组对每一项运行给定函数,如果函数对每一项都返回true,则返回true

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.every(function(item,index,array){
    return item>2
})
console.log(everyResult); //false

2、some():对数组中对每一项运行给定函数,如果函数对任何一项返回true,则返回true

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.some(function(item,index,array){
    return item>2
})
console.log(everyResult); //true

3、filter():对数组中对每一项运行给定函数,返回该函数会返回true的项组成的数组

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.filter(function(item,index,array){
    return item>2
})
console.log(everyResult); //[3,4,5,4,3]

4、map():对数组中对每一项运行给定函数,返回每次函数调用对结果组成对数组

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.map(function(item,index,array){
    return item*2
})
console.log(everyResult); //[2,4,6,8,10,8,6,4,2]

5、forEach():对数组中对每一项给定函数,这个方法没有返回值

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.forEach(function(item,index,array){
    //执行某些操作
})

十二:归并方法
1、reduce()和reduceRight()。这两个方法都会迭代数组都所有项,然后构建一个最终返回都值。reduce()方法从数组都第一项开始
逐个遍历到最后。而reduceRigth()则从数组到最后一项开始,向前遍历到第一项
eg1:

var values = [1,2,3,4,5];
var sum = values.reduce(function(prev,cur,index,array){
    return prev + cur;
})
console.log(sum); //15

eg2:

var values = [1,2,3,4,5];
var sum = values.reduceRight(function(prev,cur,index,array){
    return prev + cur;
})
console.log(sum); //15

原文地址:https://www.cnblogs.com/wzndkj/p/8468534.html

时间: 2024-08-01 23:21:36

引用类型(二):Array类型的相关文章

引用类型之Array类型

Array类型 ECMAScript数组与其它语言数组一样,都是数据的有序列表.但是ECMAScript数组的每一项可以保存任何类型的数据.而且,ECMAScript数组是可以动态调整的. 1.创建和修改数组 ·创建数组 1 var colors=new Array(20); //创建长度位20的数组 2 var colors=Array(20); //可以省略new操作符 3 var colors=Array("red","blue","green&qu

从头开始学JavaScript (十二)——Array类型

一.数组的创建 注:ECMAscript数组的每一项都可以保存任何类型的数据 1.1Array构造函数 var colors = new Array(); 如果预先知道数组要保存的项目数量,也可以给构造函数传递该数量: var colors = new Array(20); 也可以向构造函数传递数组中应该包含的项: var colors = new Array("red", "blue", "green"); 给构造函数传递一个值也可以创建数组:

浅谈JS引用类型之Array类型

最近看了一下红皮书,就整理一下,提炼一下里面的知识点! 创建方式 先从数组的创建方式说起,有两种创建方式 一种是:var arr = new Array (); 可以给构造函数传参数,如果只传一个参数,并且这个参数是数值,那么就创建该数值大小的数组,其他情况就是创建包含这些参数的数组 另一种是:var arr = []; 数组的每一项都是可以保存任何类型的数据的,var arr = [1,"hello",true,{a:1}];但是不推荐保存不同类型的值 length属性 1.它的值永

【引用类型】Array 类型

ECMAScript 数组可以保存任何类型的数据.数组最多包含 4294967295 个值 创建数组 1. 使用 Array 构造函数 1 <script> 2 //创建数组 arr1 3 var arr1 = new Array(); 4 //创建数组 arr2 , 数组length属性值为20 5 var arr2 = new Array(20); 6 //创建数组 arr3, 数组包含 3 个字符串值 7 var arr3 = new Array("red",&quo

js引用类型之Array类型

第一种是使用Array()构造函数,如下所示: var array=new Array(); 第二种是使用数组字面量表示法.由一组包含数组项的方括号表示,多个数组之间以逗号隔开.如下所示: var array =["red","blue","black"]; 在数组中length属性不只是可读的,通过设置这个属性,可以在数组末尾添加或者删除数据 var bb = ["zd","zk","zl&qu

js 引用类型之Array类型

//1.concat() 方法 不会改变原数组,会复制一个原数组的副本进行拼接 var arr = ['red', 'zhansan', 'xin']; var arr2 = arr.concat('2', ['3', '9']); console.log(arr); //[ 'red', 'zhansan', 'xin' ] console.log(arr2); //[ 'red', 'zhansan', 'xin', '2', '3', '9' ] //2.slice() 方法 不会改变原数

引用类型-Array类型~ 前端学习之路

今天开始记录每天所学的重点,为了加深印象也为了今后的复习. 今天学习的重点是引用类型中Array类型,Array类型中的栈方法,队列方法,重排序方法,操作方法,位置方法,迭代方法,归并方法.这几个方法我感觉尤为重要,因此记录下来,以便忘记了可以回顾. (一)栈方法 首先要知道的是栈是一种后进先出的数据结构,也就是最先添加的项最先移除.在JS中提供有两种方法,push()和pop()方法是实现类似于栈的行为. push()方法可以接受任意数量的参数,并且把它们放在数组的末尾,最后返回修改后数组的长

JavaScript的进阶之路(三)引用类型之Object类型和Array类型

引用类型 Object类型 function a(num){ if(num>3){ a(--num); } console.log(num); } a(5); //如何创建对象的实例 var obj1= new Object(); console.log(obj1); obj1.name="吴琼"; obj1.age=28; console.log(obj1.name+" "+obj1.age); //对象字面量语法 ,有点封装的感觉 var obj2 = {

JavaScript基础——引用类型(一)Object类型、Array类型

引用类型简介 引用类型的值(对象)是引用类型的一个实例.在ECMAScript中,引用类型是一种数据结构,用于将数据和功能组织在一起.它也常被称为类,但这种称呼并不妥当(虽然不妥当,在别人提起的时候,就是指ECMAScript中的引用类型,在一次面试的时候,有人就和面试官争论说"JS中没有'类'这个概念,结果可想而知--").尽管ECMAScript从技术上讲是一门面向对象的语言,但它不举杯传统的面向对象语言所支持的类和接口等基本结构.引用类型有时候也被称为对象定义,因为它们描述的是一

引用类型--Object类型、Array类型

引用类型的值(对象)是引用类型的一个实例.在ECMAScript中,引用类型是一种数据结构,它描述的是一类对象具有的属性和方法. 对象是某个特定引用类型的实例,新对象是使用new操作符后跟一个构造函数来创建的. Object类型 大多数引用类型值都是Object类型的实例,Object是ECMAScript中使用最多的一个类型.Object的实例不具备多少功能,但对于在应用程序中存储和传输数据而言,是非常理想的选择. 创建Object实例的方式有两种: 第一种是使用new操作符后跟Object构