ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

js----数组Array

2021-09-22 20:30:34  阅读:90  来源: 互联网

标签:arr console 元素 js ---- result 数组 var Array


js中的数组也是一个对象。和普通的对象一样,也是来存储一些值

区别在于,普通对象是用字符串作为属性名。而数组是使用索引(index)来操作元素

索引:从0开始的整数就是索引

特点:数组的存储性能比普通函数的要好,在开发中用来存储一些数据

创建一个数组对象

//使用构造函数创建数组
var arr1 = new Array();
//使用字面量创建数组
var arr2 = [];

向数组中添加元素

数组【索引】 = 值

arr[0] = 10 ;
arr[1] = 11 ; 
arr[2] = 12 ;

如果读取不存在的索引,不会报错,而是返回undefined

获取数组的长度

console.log(arr.length); //获取数组长度

对于非连续数组,使用length会获取到最大的索引加1

arr[0] = 0;
arr[1] = 1;
arr[2] = 2;
arr[3] = 3;
arr[4] = 4;
arr[5] = 5;
arr[10] = 10;
arr.length();//11 
//中间的6~9都被默认值为空
//尽量不要创建非连续数组

向数组的最后一个位置添加元素

arr[arr.length] = 70 ;
arr[arr.length] = 80 ; 

在创建数组的时候,可以直接在创建的时候赋值

var arr1 = [1,2,3,4,5,6] ;
var arr2 = new Array(10,20,30);

//注意数组的下标是从0开始的

但是,注意,当字面量数组和构造函数创建数组,都只赋值一个数的时候,其意思是不一样的

var arr1 = [10];//这个数组只有一个数,其值为10
var arr2 = new Array(10); //这个数组的长度为10 有10个数,每个数都默认为空

数组中的元素可以是任意的数据类型

var arr1 = [1,2,"hello",true,undefined,null]

也可以是对象

obj = {
name:"liu",
age:18,
gender:"女"
}
arr[arr.lenth] = obj;

arr1 = [{name:"小明"},{name:"小红"},{name:"小美"}]

也可以是一个函数

var arr =[function(){....},function(){......}]

数组里面也可以是一个数组

var arr = [[1,2,3],[4,5,6],[7,8,9]];
//这种我们称为二维数组

数组的方法

push() 向数组的末尾添加一个或多个元素,并返回数组新的长度。

var arr = [1,2,3,4,5];
var result = arr.push(6,7,8);//向数组末尾添加元素6,7,8 
console.log(result);//8  该变量返回数组的长度

pop()删除并返回数组的最后一个元素

var arr =[1,2,3,4,5,6,7];
var result = arr.pop();//删除掉最后一个元素7
console.log(result);//结果返回7

unshift()向数组的开头添加一个或者多个元素,并返回新的数组长度

var arr = [4,5,6,7,8];
var result = unshift(1,2,3);//向数组的头部添加1,2,3
console.log(result);//8

//向前边插入元素以后,其他元素的索引都会自动调整

shift()向数组的开头删除一个或者多个元素,并返回第一个元素

var arr =[1,2,3,4,5,6,7,8];
var result = arr.shift();//删除了数组的元素1
console.log(result);//1

数组的遍历

遍历数组,就是把数组中的所有元素都取出来。

for循环

var arr = [1,2,3,4,5,6,7,8,9]
for(var i = 0 ;i < arr.length; i++){
     console.log(arr[i]); 

js提供了另外一个方法用来遍历数组 

forEach()方法

forEach方法这个方法只支持IE8以上的浏览器。

forEach方法需要一个函数作为参数

var arr = [1,2,3,4,5]
arr.forEach(function(value,index,arr){
    console(value);
    console(index);
    console(arr);
    
});
//像这种函数,由我们创建但是不由我们调用的,我们称为回调函数
//数组中有几个元素函数就会执行几次
//浏览器会将遍历到的元素以实参的形式传递过去,我们可以定义形参来读取这些内容

在这里传递的第一个参数是value,则是数组的值

传递的第二个参数是index,是数组下标索引

传递的第三个值是对象,也就是arr这个数组本身


slice和splice

slice()可以用来从数组中提取指定元素

var arr = ["liu","li","wang","zhao","chen","huang"];

arr.slice(0,2); //liu li

//第一个是截取开始的位置的索引  包括开始索引
//第二个是截取结束的位置的索引  不包括结束索引
//该方法不会改变原数组,而是将截取到的元素封装到一个新数组中返回

arr.slice(1);
//当第二个数省略不写的时候,则说明截取从索引为1开始到数组最后的元素

arr.slice(1,-2);//"li","wang","zhao"
//如果传递负值,说明是从数组从头到尾来算

splice()可以用于删除数组中的指定元素

var arr = ["liu","li","wang","zhao","chen","huang"];
arr.splice(0,2);//liu li
arr.splice(1,3);//li wang zhao
//使用splice会影响原数组,会将指定的元素从原数组中删除。
//并将删除的元素作为返回值返回

//第一个表示开始位置的索引
//第二个表示截取的数量

//可以在删除的位置里添加新元素
arr.splice(1,3,"gao","song");
console.log(arr);//"liu","gao","song","chen","huang"

concat()可以连接两个或多个数组,并将新的数组返回。

var  arr1 = [1,2,3,4,5];
var  arr2 = [6,7,8,9,10];
var  arr3 = [11,12,13,14,15];

var result = arr1.concat(arr2);
console.log(result);//1,2,3,4,5,6,7,8,9,10
//该方法不会对原数组产生影响

//也可以添加多个数组
var result = arr1.concat(arr2,arr3);
//也可以直接添加元素
var result = arr1.concat(arr2,arr3,16,17,18,"hello");

join()该方法可以把数组转化成一个字符串

该方法不会对原数组产生影响

var arr = [1,2,3,4,5];
var result = arr.join();
console.log(typeof result);//结果转化成字符串 

在join()里面,如果括号里面没有填其他东西,则系统默认用,连接。

如果想用其他符号连接字符串与字符串之间,可以在括号里填写

var arr = [1,2,3,4,5];
var result = arr.join("-");
console.log(result);// 1-2-3-4-5

reverse()用来反转数组(前边的去后边,后边的去前边)

该方法会直接修改原数组

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

sort()对数组元素进行排序

会影响原数组,但是是按照unicode编码进行排序

var arr = ["a","f","u","w","l","d"];
arr.sort();
console.log(arr);// a d f l u w

对纯数字的数组,使用sort排序,也会按照unicode编码来排序,所以对数字进行排序时,有可能会得到错误的结果。

这种情况下,我们可以自己在sort里面写回调函数。

可以自己指定排序规则。

可以在sort中添加回调函数来指定排序规则

浏览器会根据获取到的数组中的元素作为实参去调用回调函数

arr.sort(function(a,b){
    //这里对数组中的每一个相邻的两个数进行比较
    if(a>b){
        return 1;
    }else if{
        retun -1;
    }else{
        return 0;
    }
});

以上代码可以化简为

arr.sort(function(){
    return a - b;
});

//如果a-b是负数,则说明a小,则不交换位置,return 负数 。如果a-b是正数,则a大,则return 正数 。
//如果a和b相等,return 0; 

标签:arr,console,元素,js,----,result,数组,var,Array
来源: https://blog.csdn.net/qq_39933416/article/details/120390784

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有