JS中数组和字符串的方法大全
数组的方法很多,ECMScript5又提供了好几种方法。有空把之前的云上的笔记整理了一下,方便自己以后查找使用。
一、ECMScript 3的Array.prototype中定义的方法
1、join()
定义:将数组中所有的元素都转化为字符串拼接在一起,返回最后生成的字符串。
注意:不改变原数组
var a = [1,2,3];
console.log(a.join()); //1,2,3 默认使用逗号分隔
console.log(a.join("")); //123 转化为字符串的常用方法
console.log(a.join("-")); //1-2-3 自定义分隔符
console.log(a); //[1,2,3] 不修改原素组
var b = new Array(5);
console.log(b.join('*')); //**** 4个连字号组成字符串
2、reverse()
定义:将数组中的元素颠倒顺序,返回逆序的字符串。
注意:原数组被改变
var a2=[1,2,3];
console.log(a2.reverse()); //[3,2,1]
console.log(a2); //[3,2,1]原数组被修改
console.log(a2.reverse().join()); //1,2,3 因为原数组又被修改了
3、sort()
定义:将数组中的元素排序后返回排序后的数组、
注意:数组以字母表顺序排。
原数组被改变
可以自定义按非字母的顺序排序,只要个sort()传入一个比较的匿名的比较函数可以了。
该比较函数决定了两个参数的在排好数组中的先后顺序,加入第一个参数在前,返回小于0的值,反之。相等为0。
var a3=['c','b',undefined,'a','z'];
console.log(a3.sort()); //["a", "b", "c", "z", undefined],undefined被排到最后
console.log(a3); //["a", "b", "c", "z", undefined]修改原数组 //自定义排序规则
var a4 = [33,4,1111,2222];
//console.log(a4.sort()); //[1111, 2222, 33, 4] 默认排序
a4.sort(function(a,b){
return a-b;
});
console.log(a4); //[4, 33, 1111, 2222]
4、concat()
定义:创建并返回一个新数组。新数组由原数组和concat()里面的参数组成
注意:不改变原数组
只能扁平化一维数组,高维不行(不会递归扁平化数组),高维数组(扁平化)降维可以看。扁平化多维数组。
var a5 = [1,2,3];
console.log(a5.concat(4)); //[1,2,3,4]
console.log(a5); //[1,2,3] //原数组不改变
console.log(a5.concat([4,5])); //[1, 2, 3, 4, 5]
console.log(a5.concat([4,5,[6,7]])); //[1, 2, 3, 4, 5,[6,7]] //只能扁平化一维
5、slice()
定义:返回指定数组的片段或者子数组,两个参数分别指是片段的开始和结束位置(不包含结束的位置)。
注意:不改变原数组
如果没有参数,相当于生成一原数组的副本
生成的新数组不包含结束位置的元素
说明:字符串也可以使用这个方法 ,如"[Object Array]".slice(8,-1); =>Array
var a6 = [1,2,3,4,5];
console.log(a6.slice(1,3)); //[2,3] //索引从1到3但包括3的子数组
console.log(a6); //[1,2,3,4,5] //原数组不改变
console.log(a6.slice(1)); //[2,3,4,5] 只有一个参数,则从该参数位置到末尾
console.log(a6.slice(1,-1)); //[2,3,4] 参数为-1只向最后一个元素,但不包括它
console.log(a6.slice(-2,-1)) //[4] 从倒数第2个数到倒数第一个数,但不包括倒数第一个数
6、splice()
定义:在数组中输入和删除元素的通用方法。返回的是由删除元素组成的新数组,没有删就返回空数组[]
前两个参数是指定需要删除的元素,后面的任意个数的参数是需要插入到原数组的元素
注意:原数组被改变
var a7 = [1,2,3,4,5];
b7 = a7.splice(2);
console.log(b7); //[3,4,5] 返回原数组从索引为2的元素到结尾被删除的部分
console.log(a7); //[1,2] 原数组是被修改之后的数组 b7 = a7.splice(1,2);
b7 = a7.splice(1,1); // 从索引为1的元素开始删除1个元素
console.log(b7); //[2,3] 从索引为1的元素开始删除2个元素,也就是2和3
console.log(a7); //[1,4,5] 原数组是被删除之后剩余的数组 var b7 = a7.splice(1,0,100);
console.log(b7); //[] 因为没有删除元素,所有返回的是一个空数组
console.log(a7); //[1, 100, 2, 3, 4, 5] 从索引为1的元素开始,删除0个元素,之后原索引为1的位置插入新元素
7、push()和pop()
定义:push在数组的末尾添加一个或者多个元素,返回新数组的长度。所以不能链式操作
pop删除数组的最后一个元素,返回它删除的值元素
组合使用push()和pop()可以实现先进后出的栈
var a8 = [1,2,3];
var b8 = a8.push(4,5);
console.log(b8); //5 返回的是新数组的长度。
console.log(a8); //[1,2,3,4,5] 直接原数组尾部添加4 var a9 = [1,2,3];
var b9 = a9.pop();
console.log(b9); //3 返回的删除的元素。
console.log(a9); //[1,2] 直接在原数组上删除元素3
//栈
var stack = [];
stack.push(1,2,3);
console.log(stack); //[1,2,3]
stack.pop();
console.log(stack); //[1,2]
stack.push(100)
console.log(stack); //[1, 2, 100]
stack.pop()
console.log(stack); //[1, 2]
8、unshift()和shift()
定义:unshift是在数组头部添加一个或多个元素。如果一次性传入多个参数,多个参数按照按照原先的位置直接加到数
组中。返回新数组的新数组的长度。
shift:删除数组的第一个元素,并返回删除的元素
//组合使用push()和()可以实现先进先出的队列
var queue = [];
queue.push(1,2,3);
console.log(queue); //[1,2,3]
queue.shift();
console.log(queue); //[2,3]
queue.push(100)
console.log(queue); //[2, 3, 100]
queue.shift();
console.log(queue); //[3,100]
queue.shift();
console.log(queue); //[100]
9、toString()
定义:将数组数组中的每个元素转化为字符串。 输出用逗号分隔的字符串列表(可能数组的内部元素(数组)还会再次调
用toString(),高维数组扁平化正是利用这点)
注意:与不使用任何参数调用的jion()方法返回的字符串一样。
var a10 = [1,2,3];
var a11 = [1,2,[3,4,[5,6]]];
console.log(a10.toString()); //1,2,3
console.log(a10); //原数组
console.log(a11.toString()); //1,2,3,4,6
console.log(a11); //原数组
二、ECMScript 5中的数组方法
1、forEach() //遍历
定义:该方法从头到尾遍历数组,为某个元素调用指定的函数。传递函数包括三个参数(数组元素、元素索引、数组本身
),如果只关心数组元素的值,可以只传一个参数。
注意:无法在所有元素的都传递给调用函数之前提前结束。也就是没有像for中一样的break语句。如果要提交终止,可以
把forEach()方法放到try块中。如果forEach()调用的函数抛出forEach.break异常,循环提前结束
var data = [1,2,3];
var sum = 0;
data.forEach(function(value){
sum+=value;
});
console.log(sum); //6 var data = [10,20,30];
data.forEach(function(v,i,a){
a[i] = v*2;
});
console.log(data) //[20, 40, 60]
2、map() //映射
定义:将调用的数组的每个元素传递给指定的函数,并返回一个新数组,它包含该该函数的返回值
注意:传递给map的函数应该有返回值,返回的是新数组,不修改调用的数组。
var data3 = [1,2,3];
var b = data3.map(function(val){
return val*10;
});
console.log(data3); //[1,2,3] 不改变原数组
console.log(b); //[10,20,30] 新数组
3、filter() //过滤
定义:返回的数组元素是调用的数组的一个子集,就传递的函数是用来做逻辑判定的,返回true,传给给判定函数的元素就是这个子集的成员。
var data4 = [1,2,3,4,5];
var b2 = data4.filter(function(val){
return val<3;
});
console.log(b2); //[1,2]
console.log(data4); //[1,2,3,4,5] 不改变原数组 var b3 = data4.filter(function(val,i){
return i%2;
});
console.log(b3); //[2,4] 返回索引为奇数的元素组成的数组
4、every() 和some()
这两种方法是数组的逻辑判定,他们针对数组中的所有元素应用指定的函数进行判定。返回true或者false
定义:every 当且仅针对数组中的所有元素调用判定的函数都返回true,它才返回true
some 至少有一个判定为true就返回true.
5、reduce()
定义:使用指定的函数将数组元素进行组合,生成一个单值。参数一是执行简化操作的函数,参数二是传给简化函数的初始值。
注意:一旦确认之后,就停止遍历数组了。
var data5 = [1,2,3];
var sum = data5.reduce(function(x,y){
return x+y;
},0);
console.log(sum); //6 var product = data5.reduce(function(x,y){
return x*y;
},100);
console.log(product); //600
6、indexOf()和lastIndexOf()
定义:搜索整个数组中具有给定值的位子,返回找到第一个元素的索引,如果没有找到就返回-1;indexOf()是从头找到尾,lastIndexOf()正好相反
注意:不接受函数作为参数,第一个参数是需要搜索的值,第二个参数是可选的,表示从哪里搜索,可以是负数,表示相对数组末尾的偏移量。
说明:字符串也有这两个方法,功能类似。
var data6 = [1,2,3,3,4,3,5];
console.log(data6.indexOf(3)); //2 第一个3的索引是2
7、isArray()
定义:判断对象是不是数组
三、作为数组的字符串
1、简单的使用
var str = "test"
str.charAt(1) //e
str[1] //e
2、可以调用数组的方法
注意:字符串是不可变的值,当成数组看待是只可读的。所以像push() sort() reverse() splice()等会修改原数组的方法,在字符串上是无效的。错误可能都没有提示!
var str = "hello";
Array.prototype.join.call(str," "); //"h e l l o" Array.prototype.filter.call(str, function(x){
return x.match(/o/g); //["o"]
});
String 对象方法
常用的:
chatAt()
indexOf()
match()
replace()
slice() //数组也是
split() //数组也是 split(/\s+/) 按中间一个或多个空字符串分隔成数组,如获取字符串中的单词
substr()
substring()
等
| 方法 | 描述 |
|---|---|
| anchor() | 创建 HTML 锚。 |
| big() | 用大号字体显示字符串。 |
| blink() | 显示闪动字符串。 |
| bold() | 使用粗体显示字符串。 |
| charAt() | 返回在指定位置的字符。 |
| charCodeAt() | 返回在指定的位置的字符的 Unicode 编码。 |
| concat() | 连接字符串。 |
| fixed() | 以打字机文本显示字符串。 |
| fontcolor() | 使用指定的颜色来显示字符串。 |
| fontsize() | 使用指定的尺寸来显示字符串。 |
| fromCharCode() | 从字符编码创建一个字符串。 |
| indexOf() | 检索字符串。 |
| italics() | 使用斜体显示字符串。 |
| lastIndexOf() | 从后向前搜索字符串。 |
| link() | 将字符串显示为链接。 |
| localeCompare() | 用本地特定的顺序来比较两个字符串。 |
| match() | 找到一个或多个正则表达式的匹配。 |
| replace() | 替换与正则表达式匹配的子串。 |
| search() | 检索与正则表达式相匹配的值。 |
| slice() | 提取字符串的片断,并在新的字符串中返回被提取的部分。 |
| small() | 使用小字号来显示字符串。 |
| split() | 把字符串分割为字符串数组。 |
| strike() | 使用删除线来显示字符串。 |
| sub() | 把字符串显示为下标。 |
| substr() | 从起始索引号提取字符串中指定数目的字符。 |
| substring() | 提取字符串中两个指定的索引号之间的字符。 |
| sup() | 把字符串显示为上标。 |
| toLocaleLowerCase() | 把字符串转换为小写。 |
| toLocaleUpperCase() | 把字符串转换为大写。 |
| toLowerCase() | 把字符串转换为小写。 |
| toUpperCase() | 把字符串转换为大写。 |
| toSource() | 代表对象的源代码。 |
| toString() | 返回字符串。 |
| valueOf() | 返回某个字符串对象的原始值。 |
JS中数组和字符串的方法大全的更多相关文章
- js中数组和字符串的方法总结
一.数组方法简单总结为以下几种 1.原有: 增.删.改.截.拼.复.排.转 2.ES5扩展: 查.遍历 增: 前增 ,,,,]; console.log(arr.unshift(,,[ console ...
- JS中数组和字符串具有的方法,以及substring,substr和slice的用法与区别
String 对象属性 属性 描述 constructor 对创建该对象的函数的引用 length 字符串的长度 prototype 允许您向对象添加属性和方法 String 对象方法 方法 描述 ...
- JS中数组和字符串方法的简单整理
一.数组: 数组的基本方法: 1.增:arr.unshift() /push() 前增/后增 2.删:arr.shift() /pop ...
- js中数组、字符串、日期、数学API方法一览
以下内容摘选自 http://www.w3school.com.cn/jsref/jsref_obj_array.asp 点击方法新窗口打开详解 数组: 方法 描述 concat() 连接两个或更多的 ...
- javascript中数组和字符串的方法比较
× 目录 [1]可索引 [2]转换 [3]拼接[4]创建[5]位置 前面的话 字符串和数组有很多的相同之处,它们的方法众多,且相似度很高:但它们又有不同之处,字符串是不可变值,于是可以把其看作只读的数 ...
- js中数组的字符串表示
<html> <head> <title>数组的字符串表示</title> <script type="text/javascript& ...
- 【js中数组和字符串的相互转换】
一.数组转字符串 //数组转字符串 var a, b; a = new Array(0,1,2,3,4); b = a.join(","); //得到字符串 二.字符串转数组 // ...
- js中数组遍历常用的方法
常见的数组遍历方法,比如 for in,for of, forEach,map,filter,every,some,find,reduce等 1,普通for循环,经常用的数组遍历 var arr = ...
- js中数组对象去重的方法
var arr = [{ key: '01', value: '乐乐' }, { key: '02', value: '博博' }, { key: '03', value: '淘淘' },{ key: ...
随机推荐
- 以太坊挖矿源码:clique算法
上文我们总结了以太坊最主要的共识算法:ethash算法,本文将重点分析以太坊的另一个共识算法:clique. 关键字:clique,共识算法,puppeth,以太坊地址原理,区块校验,认证结点,POA ...
- 新概念英语(1-27)Mrs. Smtih's living room
Where are the books? Mrs. Smtih's living room is large. There is a television in the room. The telev ...
- DevExpress 控件中GridControl的使用
近期开发用到了DevExpress系列的控件,GridControl是我用到的Dev系列控件最多的一个控件.现在先来总结一下: 首先先写一个简单的小例子来简单介绍一下GridControl的用法: 1 ...
- 从感知机到 SVM,再到深度学习(二)
这篇博文承接上一篇,详细推导了 SVM 算法,包括对偶算法,SMO 优化算法,核函数技巧等等,最后还提到用高度非线性的曲线代替超平面,就是神经网络的方法. 在第一篇中已经得到了最优间隔 ...
- 【面试题】由HashMap引发的一系列追问
HashMap和HashTable的区别 同:HashMap和Hashtable都实现了Map接口. 异:HashMap允许null的键值对,非同步的,非线程安全的,效率高: HashTable不允许 ...
- 浅析开源数据库MySQL架构
数据库是所有应用系统的核心,故保证数据库稳定.高效.安全地运行是所有企业日常工作的重中之重.数据库系统一旦出现问题无法提供服务,有可能导致整个系统都无法继续工作.所以,一个成功的数据库架构在高可用设计 ...
- eclipse下maven插件搭建springmvc之helloworld
这几天学习了怎样使用maven,最终还是要回归web项目嘛,所以主要还是使用eclipse插件. 1 下载eclipse maven插件. 其实新版的eclipse已经集成了maven:lunar.m ...
- JVMGC机制
GC 是JVM的垃圾回收器.与C/C++不同,java程序员无需考虑太多内存分配的位置,更不用考虑内存释放的机制,java对象内存的申请和释放都有JVM托管.JVM的内存释放机制就是GC. GC的过程 ...
- [LeetCode] License Key Formatting 注册码格式化
Now you are given a string S, which represents a software license key which we would like to format. ...
- springboot AOP全局拦截日志记录
@Aspect@Component@Slf4jpublic class WebLogAspect { @Pointcut("execution(public * com.we.control ...