JS基础入门篇(十)— 数组方法
1.join
作用: 将数组通过指定字符拼接成字符串。
语法: string arr.join([separator = ',']);
参数: separator可选,如果省略的话,默认为一个逗号。如果 seprator 是一个空字符串,那么数组中的所有元素将被直接连接。
返回值: 拼接后的字符串。
<script>
var arr=[2,3,4,5];
console.log(arr.join());//"2,3,4,5"
console.log(arr.join(""));//"2345"
console.log(arr.join("+"));//"2+3+4+5"
console.log(arr);//[2,3,4,5]
</script>
2.push
作用:往数组的末尾添加一个或者多个元素。
语法:number arr.push(element1, ..., elementN);
参数:elementN,一个或多个元素。
返回值:新数组的length。
注意:会修改原数组。
<script>
var att=[1,2,3,4];
console.log(att.push("a","b"));//6
console.log(att);//[1,2,3,4,"a","b"];
</script>
3.unshift
作用:往数组的头部添加一个或者多个元素。
语法:number arr.push(element1, ..., elementN);
参数:elementN,一个或多个元素。
返回值:新数组的length。
注意:会修改原数组。
<script>
var att=[1,2,3,4];
console.log(att.unshift("a","b"));//6
console.log(att);//["a","b",1,2,3,4];
</script>
4.pop
作用: 删除数组最后 一个 元素。
语法: mixed arr.pop();
返回值: 被删除的那一个元素。
注意:会修改原数组。
<script>
var arr=[1,2,3,4];
console.log(arr.pop());//4
console.log(arr);//[1,2,3]
</script>
5.shift
作用: 删除数组 第一个 元素。
语法: mixed arr.pop();
返回值: 被删除的那一个元素。
注意:会修改原数组。
<script>
var arr=[1,2,3,4];
console.log(arr.shift());//1
console.log(arr);//[2,3,4]
</script>
6.concat
作用: 将传入的数组或非数组值与原数组合并,组成一个新的数组并返回.
语法: array array.concat(value1, value2, ..., valueN);
参数: valueN是指需要与原数组合并的数组或非数组值.
返回值: 合并后的数组
注意: 不会修改原数组的内容。
<script>
var att=[1,2,3];
var attO=["a","b"];
var attT=[5,true];
console.log(att.concat(10,attO,attT));//[1,2,3,10,"a","b",5,tru]
console.log(att);//[1,2,3]
</script>
7.reverse
作用:颠倒数组中元素的位置.
语法: array arr.reverse()
返回值: 颠倒顺序后的数组
注意: 会改变原数组.
<script>
var arr = [1,2,3,6,5,4];
var res = arr.reverse();
res.push( "a" );
console.log( res );//[4,5,6,3,2,1,"a"]
console.log( arr );//[4,5,6,3,2,1,"a"]
</script>
8.slice
作用:截取**数组中一部分,并返回这个新的数组.
语法: array arr.slice([begin[,end]]);
返回值: 截取后的新的数组
注意: 包含起始位置,不包含结束位置,不会改变原数组.
什么都不传入,则是原数组。
<script>
var arr = ["a","b","c","d"];
// var res = arr.slice( 1,3 );//["b","c"]
// var res = arr.slice( 3,1 );//[]
var res = arr.slice( -3,-1 );//["b","c"]
var res = arr.slice();//["a","b","c","d"]
console.log( res );
console.log( arr );//["a","b","c","d"]
</script>
9.splice
作用:用新元素替换旧元素,以此修改数组的内容
语法:array array.splice(start, deleteCount[, item1[, item2[, ...]]])
参数:
- start 起始位置
- deleteCount 删除长度
- item 添加的内容
返回值: 由被删除的元素组成的一个数组
注意:修改了原数组的内容。
<script>
var att="Liangzhifang".split("");
console.log(att.splice(2,4,["a"]));//["a","n","g","z"]
console.log(att);//["L","i",["a"],"h","i","f","a","n","g"]
</script>
10.sort
作用: 对数组的元素进行排序。
语法: array arr.sort([compareFunction]);
参数: compareFunction可选。用来指定按某种顺序进行排列的函数。如果省略,元素按照转换为的字符串的诸个字符的Unicode位点进行排序。
返回值: 排序后的数组.
<script>
//当什么都不传入的时候,sort()默认由小到大排列。
var attr=[9,5,4,3,2];
console.log(attr.sort());//[2, 3, 4, 5, 9]
//传入function的时候,sort()内的function返回值大于0,由小到大排列。
var attrO=[9,5,4,3,2];
console.log(attrO.sort(function () {
return 1;
}));//[2, 3, 4, 5, 9]
//传入function的时候,sort()内的function返回值小于或者等于0,数组序列不变。
var attrT=[9,5,4,3,2];
console.log(attrT.sort(function () {
return -1;
}));// [9, 5, 4, 3, 2]
//由于sort内部是随机抽取两个值,我们在利用function函数的返回值,大于0的时候,交换位置。小于或者等于0的时候不变,来排序。
//以下是由小到大排序
var attrTh=[9,5,4,3,2];
console.log(attrTh.sort(function (a,b) {
return a-b;
}));// [2, 3, 4, 5, 9]
//以下是由大到小排序
var attrF=[9,5,4,3,2];
console.log(attrF.sort(function (a,b) {
return b-a;// [9, 5, 4, 3, 2]
}));
</script>
JS基础入门篇(十)— 数组方法的更多相关文章
- JS基础入门篇(三十五)—面向对象(二)
如果没有面向对象这种抽象概念的小伙伴,建议先看一下我写的JS基础入门篇(三十四)-面向对象(一)
- JS基础入门篇(二十七)—BOM
虽然上次写到js基础篇(二十四),这次直接写到(二十七).是为了提醒自己中间有几篇没写.特此说明一下啊. 1.window.open() 使用a标签呢,点击一下a标签页面才会跳转,有时候我们需要做的操 ...
- JS基础入门篇( 三 )—使用JS获取页面中某个元素的4种方法以及之间的差别( 一 )
1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...
- JS基础入门篇(十二)—JSON和Math
1.JSON JSON: 对象格式的字符串 轻量的数据传输格式 注意事项: 键名 需要 使用 双引号 包起来 JOSN有两个方法:JSON.parse和 JSON.stringify. JSON.pa ...
- JS基础入门篇(三十四)— 面向对象(一)
1.对象 对象的定义 : 对象 是 由 键值对 组成的无序集合. 创建对象两种方法 : 方法一 : 字面量方法 var obj = {name: "k"}; 方法二 : new O ...
- JS基础入门篇(二十四)—DOM(下)
1.offsetLeft/offsetTop offsetLeft/offsetTop : 到定位父级节点的距离. <!DOCTYPE html> <html lang=" ...
- JS基础入门篇(三十六)—面向对象( 三 )
1.class class es6 中 为 关键字用来声明 一个 类 1.只能通过new调用 2.不存在变量提升 3.多个方法之间直接书写,不需要,隔开 4.类的方法是直接定义在类的原型上的 5.定义 ...
- JS基础入门篇(二十)—事件对象以及案例(二)
案例一.点击按钮,选中input中的全部内容 select()方法:选中全部. 点击按钮选中输入框中的内容!!!! <!DOCTYPE html> <html lang=" ...
- JS基础入门篇(二十四)—DOM(上)
1.常用的节点类型,nodeType,attributes,childNodes. 1.元素节点 - 1 2.属性节点 - 2 3.文本节点 - 3 4.注释节点 - 8 5.文档节点 - 9 查看节 ...
随机推荐
- Martinjingyu的开发环境
Mac Pro Book一台去年新款,最近这4年多折腾的东西总结下. Mac的包管理器首选HomeBrew,安装如下: ruby -e "$(curl -fsSL https://raw.g ...
- var、let和const的区别详解
let 和 const 是 ECMAScript6 新推出的特性,其中 let 是能够替代 var 的"标准",所以我们探讨 var.let 和 const 的区别,首先应该知 ...
- qq群排名靠前最新方法
QQ群排名这几年是越来越火,因为很多灰产业都选择做QQ群排名,毕竟没有那么严,那么要做QQ群排名虽然不难,但是还是需要一点技术和软件的. https://url.cn/5JbR4C8 QQ群排名分为如 ...
- 如何设置微信小程序顶部标题
直接在对应的xxx.json中支配如下,就可以了哈 { "backgroundTextStyle": "light", //字体 "navigatio ...
- 计算机网络篇,基于UDP、TCP的应用层及其端口
- javascript 入门 之select2选择本地数据
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"/> <meta lan ...
- Git mergetool 插件
首先你喜欢使用git命令行操作,可以上网下载Kdiff3安装到你的电脑,然后按下面的操作就可以使用这个工具了. 1. 安装Kdiff3 软件.(最好使用默认路径) 2. 添加kdiff3到git me ...
- Python之 module安装
如出现这种错误 ModuleNotFoundError: No module named 'numpy' 这种错误通常不会出现,因为Python的模块,通常在你安装Python shell的时候,就已 ...
- AJ学IOS(37)UI之CALayer
AJ分享,必须精品 CALayer 在iOS中,你能看得见摸得着的东西基本上都是UIView,比如一个按钮.一个文本标签.一个文本输入框.一个图标等等,这些都是UIView. 其实UIView之所以能 ...
- 【简单了解系列】从基础的使用来深挖HashMap
HashMap定义 说的专业一点,HashMap是常用的用于存储key-value键值对数据的一个集合,底层是基于对Map的接口实现.每一个键值对又叫Entry,这些Entry分散的存储在一个由数组和 ...