JavaScript——Array

news/2024/7/19 14:05:46 标签: js, Array

java的数组和JavaScript的数组的区别?

javascript的数组在定义数组长度时,只是为了开辟存储空间,但你存入的内容大于一开始开辟的空间时,javascript会自动增加存储空间,不会报错。

java在一开始定义了长度之后,如果存入的内容超过了一开始的存储空间之后,就会溢出.,是会报错的。

1、数组定义

JavaScript中的数组为Array对象,Array为JavaScript语言内置对象

创建方式:

方式一:

let a1 = [1,2,3];
let a2 = ['aaa','bbb','ccc'];

方式二:

let a3 = new Array('aaa','bbb','ccc');

两种方式基本等效,除以下情况外:

let a4 = [5];   // 创建一个只有一个元素的数组,元素为数值5
let a5 = new Array(5);//创建一个有5个元素的数组,每个元素均为undefined

常用属性:

length属性: 可读写,读返回数组中元素的个数,写可增加或减少元素的个数

let a2 = ['软件工程', '计算机科学与技术', '网络工程'];
console.log(a2.length);   // 3
a.length = 5;
console.log(a2);  
// (5) ["软件工程", "计算机科学与技术", "网络工程", empty × 2]
a2.length = 2;
console.log(a2);  // (2) ["软件工程", "计算机科学与技术"]

数组的常用方法:

1、push(e1, …, en):将参数指定的元素依次添加到数组的末尾,并返回新数组的长度

let a = ['软件181', '软件182', '软件183'];
console.log(a.push('软测181', '软测182'));  // 5
console.log(a); 
// (5) ['软件181', '软件182', '软件183', '软测181', '软测182']

2、pop():弹出(返回,并在数组中删除)数组最末一个元素

let c = a.pop();
console.log(c); // 软测182
console.log(a); 
// (4) ["软件181", "软件182", "软件183", "软测181"]

3、unshift(e1, …, en): 将参数e1, …, en依次添加到数组的开头,并返回新数组的长度。

let b = ['软件181', '软件182', '软件183'];
console.log(b.unshift('软测181', '软测182')); // 5
console.log(b); 
// (5) ["软测181", "软测182", "软件181", "软件182", "软件183"]

4、shift(): 删除数组的第一个元素,并返回该元素。

let c2 = b.shift();
console.log(c2);  // 软测181
console.log(b);   
// (4) ["软测182", "软件181", "软件182", "软件183"]

5、splice(index, count[, e1, …, en): 在数组中删除、替换或添加元素

①、删除元素:只提供index和count两个参数,删除从index位置开始的count个元素,并返回删除的元素数组

let a = [1, 2, 3, 4, 5];
let e = a.splice(2, 1); // 从索引为2的位置开始,删除1个元素
console.log(e); // (1) [3],被删除元素组成的数组
console.log(a); // (4) [1, 2, 4, 5],改变后的数组

②、替换元素:提供三个以上参数,前两个参数的作用与1相同,在1删除的基础上,第三个及之后的参数被插入到index位置,返回值与1相同

let a2 = [1, 2, 3, 4, 5];
// 从索引为2的位置开始,删除2个元素,并将元素10播放到索引为2的位置
let e2 = a2.splice(2, 2, 10); 
console.log(e2);  // (2) [3, 4]
console.log(a2);  // (4) [1, 2, 10, 5]
a2.splice(1, 1, 6);	// a2[1] = 6
console.log(a2); // (4) [1, 6, 10, 5 

③、添加元素:提供三个以上参数,第二个count参数值为0,此时不删除元素,只在index位置插入第三个及之后的参数,返回值为空数组

let a3 = [1, 2, 3, 4, 5];
// 从索引为2的位置开始,删除0个元素,并将元素10播放到索引为2的位置
let e3 = a3.splice(2, 0, 10); 
console.log(e3);  // []
console.log(a3);  // (6) [1, 2, 10, 3, 4, 5]

6、sort()或sort(compareFunction):对数组元素排序

不提供参数时,按字典顺序(Unicode从小到大)排序
提供compareFunction时,如compareFunction返回正值则交换元素

let a = [50, 6, 200, 3, 7, 80];
// 按字典排序
console.log(a.sort());  // (6) [200, 3, 50, 6, 7, 80]
// 当v1 - v2为正值时交换元素
console.log(a.sort((v1, v2) => v1 - v2)); // (6) [3, 6, 7, 50, 80, 200]
console.log(a.sort((v1, v2) => v2 - v1)); // (6) [200, 80, 50, 7, 6, 3]

7、forEach(function(currentValue[, index[, array]])[, thisArg]): 对数组中的每个元素执行一次回调函数

let a = ["软测181", "软测182", "软件181", "软件182", "软件183"];
let eUl = document.createElement('ul');
a.forEach((c) => {
  let eLi = document.createElement('li')
  eLi.textContent = c;
  eUl.appendChild(eLi);
  console.log(this);   // window
});
document.body.appendChild(eUl);

在这里插入图片描述

8、filter(function(currentValue[, index[, array]])[, thisArg]): 对所有元素依次应用回调函数,返回一个新数组,包含所有回调函数返回true的元素

let a = ['软件181', '软件182', '软件183', '软测181', '软测181'];
// 包含所有“软件”开始的元素,输出 (3) ["软件181", "软件182", "软件183"]
console.log(a.filter(item => item.startsWith('软件'))); 

9、map生成一个新的数组,其中的元素为指定数组中的元素应用回调函数返回值

let a = ["软测181", "软测182", "软件181", "软件182", "软件183"];
// 生成一个新数组,元素为li元素
let aLi = a.map(item => {
  let eLi = document.createElement('li');
  eLi.textContent = item;
  return eLi;
});
let eUl = document.createElement('ul');
aLi.forEach(item => eUl.appendChild(item));
document.body.appendChild(eUl);

10、reduce(function(previousResult, currentValue[, index[, array]])[, initialValue]):使用回调函数对数组中的每个元素进行处理,并将处理结果汇总返回,其中:

previousResult: 必须提供,上一次执行的结果,第一次执行时,如提供initialValue参数,则previousResult的值为initialValue,否则previousResult的值为数组中的第一个元素, 且currentValue为数组中的第二个元素
currentValue:必须提供,当前正在处理的元素

function sum(...numbers) {
  return numbers.reduce((prev, curr) => prev + curr, 0)
}
console.log(sum(1, 2, 3));  // 6
console.log(sum(10, 5, 100, 20)); // 135

注:函数sum形参中三个点为ES6新增语法,表示形参numbers可接受任意数量的实数,在函数体中,numbers的类型为数组,存放传入的实参


http://www.niftyadmin.cn/n/1095832.html

相关文章

body全部调成灰色

今天打开腾讯网页body的全部(图片和文字)内容都是灰色的 原来今天是“东方之星”沉船遇悲痛事件的第七天,愿逝者安息生者坚强。。 然后我们来看下body全部内容为灰色的效果是怎样实现的 查了下资料原来是filter:grayscale(100%);/*火狐*/ filter:gray;/*…

Fusioncharts的数字格式化

1. 小数点位数格式化 <chart ... decimals2 > Eg.数值12.432, 13.4 and 13&#xff0c;使用<chart ... decimals2 >后数值将转换成12.43, 13.4 and 13&#xff1b;12.432将被截取2位&#xff0c;但是13.4并不会自动补零。 2.K、M格式化 Fusioncharts自动将数值…

Errors和Exceptions区别

根据上图&#xff0c;我们可知&#xff0c;在Java中&#xff0c;所有的异常&#xff08;包括错误&#xff09;都有一个共同的祖先Throwable类。其下有两个重要的子类Exceptions和Errors Exceptions: 程序自身可以处理的异常&#xff0c;可以通过catch的方式捕捉&#xff0c;通…

超越算法来看待个性化推荐

一提到个性化推荐&#xff0c;大家一般会想到协同过滤、文本相似等推荐算法&#xff0c;或是更高阶的模型推荐算法&#xff0c;百度的张栋说过&#xff0c;推荐40%取决于UI、30%取决于数据、20%取决于背景知识&#xff0c;虽然本人不是很认同这种比例&#xff0c;但推荐系统中&…

jsp想js,action传值

1、struts2 action如何向JSP的JS函数传值 action中定义变量 public class TestAction extends ActionSupport implements ServletRequestAware { private String state "test"; } JSP的JS函数中引用变量 <script typetext/javascript> function getSt…

hdu 4473 Exam 数学

思路&#xff1a; 将条件转化为满足abc<n的abc的数目。 1.3个数相等时&#xff0c;为 A; 2.有2个数相等时&#xff0c;为 B; 3.都不相等时&#xff0c;为 C。 则结果为A3*B6*C。 代码如下&#xff1a; 1 #include<iostream>2 #include<stdio.h>3 #include<al…

【最小生成树+子集枚举】Uva1151 Buy or Build

Description 平面上有n个点(1<N<1000)&#xff0c;你的任务是让所有n个点连通&#xff0c;为此&#xff0c;你可以新建一些边&#xff0c;费用等于两个端点的欧几里得距离的平方。 另外还有q(0<q<8)个套餐&#xff0c;可以购买&#xff0c;如果你购买了第i个套餐&a…

nginx + echo模块编译安装

1:在编译nginx之前要把编译依赖的库和头文件安装好&#xff0c;所需的库就是下面几个openssl,pcre,zlib几个库 2:下载nginx和nginx-echo源代码。 &#xff13;&#xff1a; ./configure \--prefix/home/m/workspace/build/nginx \--sbin-path/home/m/workspace/build/nginx/ngi…