javaScript 基础知识汇总(七)
1、数组
特点:数组是可以存储有序集合的对象。
声明: let arr = new Array();
let arr=[];
大多数情况下我们使用第二种。
let fruits = ["apple","orange","plum"];
fruits[]="Pear";//对数组的更改 fruits[]="Lemon"; 数组元素增加 let arrLength = arr.lenght; //数组的长度
多维数组
let matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
alert(matrix[2,1]);//第三行第一个
2、数组的方法
JavaScript中的数组既可以看成栈也可以看成队列
作为队列有以下两种方法:
push 在末端添加一个元素
shift 取出队列最前端的一个元素,整个队列往前移
作为栈有以下两个方法
push 在末端添加一个元素,
pop 在末端取出一个元素
JavaScript 中的数组既可以用作队列,也可以用作栈。它们允许从前端/末端来添加/删除元素。
这在计算机科学中叫做双端队列
//JavaScript在数组末端有两种操作方法
let arr = ["a"];
alert(a.pop());//移除a并显示a arr.push("b");
alert(arr);//b在数组末端添加元素 //在数组前端也有两种方法。
let arr = ["a","b"];
alert(arr.shift());//移除a并显示a
arr.unshift("c");//在数组的前端添加元素。 在数组末端的操作比在数组前端的操作速度要快,因为在数组末端操作不需要更改数据其他位置的索引。
splice
删除数组元素,用delete删除,只能删除该元素的值,但是不能删除元素的索引。
而splic 可以对数组进行添加、删除、和插入操作
语法: arr.splic(index[,deleteCount,elem1,...,elemN])
从index开始:删除deleteCount元素并在当前位置插入elem1,..,elemN。最后返回仪删除元素的数组。
//删除
let arr = ["I", "study", "JavaScript"]; arr.splice(, ); // from index 1 remove 1 element alert( arr ); // ["I", "JavaScript"] //删除并替换 let arr = ["I", "study", "JavaScript", "right", "now"]; // remove 3 first elements and replace them with another
arr.splice(, , "Let's", "dance"); alert( arr ) // now ["Let's", "dance", "right", "now"] //将 deleteCount 设置为 0,splice 方法就能够插入元素而不用删除:
let arr = ["I", "study", "JavaScript"]; // from index 2
// delete 0
// then insert "complex" and "language"
arr.splice(, , "complex", "language"); alert( arr ); // "I", "study", "complex", "language", "JavaScript"
slice
语法:arr.slice(start,end) 赋值数组中的元素
let str = "test";
let arr = ["t", "e", "s", "t"]; alert( str.slice(, ) ); // es
alert( arr.slice(, ) ); // e,s alert( str.slice(-) ); // st
alert( arr.slice(-) ); // s,t
concat
语法:arr.
concat
(
arg1,
arg2...
)
let arr = [,] alert(arr.concat([,]));//1,2,3,4
查询数组
indexOf/lastIndexOf和includes
这些方法和字符串的一样。
arr.indexOf(item,from) 从索引from 查询item ,如果找到返回索引,否则返回-1;
arr.lastIndexOf(item,from) 从尾部开始查询
arr.includes(item,from) 从索引from 查询iitem 如果找到返回true;
let arr = [,,false]; alert(arr.indexOf());//
alert(arr.indexOf(false));//
alert(arr.indexOf(null));//-1
alert(arr.includes());//true 在这里用的是 === 比较所以如果查询的false ,会精确必须是false,而不是零
find和findIndex
语法:let result = arr.find(function(item,index,array){});
let users =[
{id:1,name:"john"},
{id:2,name:"Pete"},
{id:3,name:"Mary"}
];
let user = users.find(item=>item.id==1);
alert(user.name);//John
filter
和find 类似,但是该方法可以返回多个要素
语法:let result = arr.filter(function(item,index,array){});
let someUsers = users.filter(item=>item.id<3);
alert(someUsers.length);//2
数组转换
map
语法: let result = arr.map(function,index,array){});
对数组中的每一个元素进行判断,最终返回符合结果的数组。
let lengths = ["Bilbo", "Gandalf", "Nazgul"].map(item => item.length)
alert(lengths); // 5,7,6
soft
此方法默认是按照字符串排序的,如果不传参数,返回值不一定是自己想要的
比较函数可以返回任何数字
let arr = [ , , ]; arr.sort(function(a, b) { return a - b; }); alert(arr); // 1, 2, 15
更短的代码
rr.sort( (a, b) => a - b );
reverse
颠倒数组中元素的顺序
let arr = [, , , , ];
arr.reverse(); alert( arr ); // 5,4,3,2,1
split 和join
分割和合并元素
//逗号分割
let names = 'Bilbo, Gandalf, Nazgul'; let arr = names.split(', '); for (let name of arr) {
alert( `A message to ${name}.` ); // A message to Bilbo (and other names)
}
//将一个数组用“;”连接成字符串
let arr = ['Bilbo', 'Gandalf', 'Nazgul']; let str = arr.join(';'); alert( str ); // Bilbo;Gandalf;Nazgul
reduce 和reduceRight
语法:let
value =
arr.
reduce
(
function
(
previousValue
,
item,
index,
arr)
{
// ...
}
,
initial)
;
previousValue
— 是前一个函数调用的结果,第一次调用是初始化。
let arr = [, , , , ]; let result = arr.reduce((sum, current) => sum + current, ); alert(result); //
如果不初始化初始值则默认使用第一个元素作为初始值
let arr = [, , , , ]; // 删除初始值
let result = arr.reduce((sum, current) => sum + current); alert( result ); //
arr.reduceRight 也一样,但是遍历是从右到左。
迭代:forEach
语法:arr.
forEach
(
function
(
item
,
index,
array)
{
// ... do something with item
}
)
;
// 为每个元素调用 alert
1 ["Bilbo", "Gandalf", "Nazgul"].forEach(alert);
javaScript 基础知识汇总(七)的更多相关文章
- JavaScript基础知识汇总
1. 图片热区: <img src="logo.jpg" usemap="#logo"> <map id="logo" n ...
- javaScript 基础知识汇总(三)
1.循环:while 和 for while 循环 while(condition){ //代码 循环体 } do ... while 循环 let i =0; do { //循环体 }while( ...
- javaScript 基础知识汇总(六)
1.基本类型与对象的区别 基本类型:是原始类型的中的一种值. 在JavaScript中有6中基本类型:string number boolean symbol null undefined 对 ...
- javaScript 基础知识汇总(五)
1.垃圾回收 JavaScript 的内存管理是自动的,不能强制执行或者阻止执行 可达性 JavaScript中主要的内存管理概念是可达性. 什么是可达性? 定义一个对象 let user = { n ...
- javaScript 基础知识汇总(二)
1.运算符 术语或者叫法:一元运算符.二元运算符.运算元(参数) let x=0; x=5+2; //5和2为运算元,“+” 为二元运算符: x=-x; //"-" 为一元运算符 ...
- javascript 基础知识汇总(一)
1.<script> 标签 1) 可以通过<script> 标签将javaScript 代码添加到页面中 (type 和language 属性不是必须的) 2)外部的脚本可以通 ...
- JavaScript 基础知识汇总目录
一.标签.代码结构.现代模式.变量.数据类型.类型转换 GO 二.运算符.值的比较.交互.条件运算符.逻辑运算符 GO 三.循环 while 和 for .switch语句.函数.函数表达式和箭头函数 ...
- javaScript 基础知识汇总 (十三)
1.Class 在JavaScript中 calss即类是一种函数 基本语法 class Myclass{ constructor(){} method1(){} method2(){} method ...
- javaScript 基础知识汇总 (十)
1.New Function 语法:let func = new Function ([arg1[, arg2[, ...argN]],] functionBody) //无参数示例: let say ...
随机推荐
- 地址SQL文件
文件下载 Beckoning
- axios学习笔记
axios学习笔记axios文档源地址:https://github.com/axios/axios0.概念axios 在NPM上的描述是:Promise based HTTP client for ...
- python djangjo 文件上传
视图: request.GET 获取数据 request.POST 提交数据 request.FILES 获取文件用 checkbox 等多选的内容 request.POST.getlist ...
- 序列化模块ModelSerializer上补充及ListSerializer
整体单改 路由层.模型层.序列化层不需要做修改,只需要处理视图层:views.py """ 1) 单整体改,说明前台要提供修改的数据,那么数据就需要校验,校验的数据应该在 ...
- Leetcode刷题记录 剑指offer
面试题3:数组中重复数字 # 使用set,时间复杂度O(n),空间复杂度O(n)class Solution(object): def findRepeatNumber(self, nums): &q ...
- 在python中使用json
在服务器和客户端的数据交互的时候,要找到一种数据格式,服务端好处理,客户端也好处理,这种数据格式应该是一种统一的标准,不管在哪里端处理起来都是统一的,现在这种数据格式非常的多,比如最早的xml,再后来 ...
- water
webchacking.kr 第5题 打开题目发现了两个按钮,分别是Login和join 打开Login发现url是http://webhacking.kr/challenge/web/web-05/ ...
- 使用Python生成自己的特色二维码
二维码又称二维条码,常见的二维码为QR Code,QR全称Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的Bar Code条形码能存更多的信息,也能表示更多的数据 ...
- golang 统计系统测试覆盖率
golang 统计系统测试覆盖率 参考资料 https://www.elastic.co/blog/code-coverage-for-your-golang-system-tests https:/ ...
- 移动端flex布局
移动端flex布局 弹性盒布局语法分为两部分: 1. 添加在父容器上的语法 (1)display : flex; 设置为弹性盒(父元素添加) (2)flex-direction: 主轴排列方式 row ...