处理字符串

1、js把字符串处理成数组的两种方式

const string = 'abc'
console.log(string.split('')) //[a,b,c]
console.log(Array.from(string)) //[a,b,c]

2、截取指定长度字符串

1) substr() 和 substring()

substr()

它包含两个参数，第一个参数表示准备截取的子字符串起始下标，第二个参数表示截取的长度

示例
在下面示例中使用 lastIndexOf() 获取字符串的最后一个点号的下标位置，然后从其后的位置开始截取 4 个字符。

var s = "http://c.biancheng.net/index.html";
var b = s.substr(s.lastIndexOf(".") + 1,4);  //截取最后一个点号后4个字符
console.log(b);  //返回子字符串“html”

如果第一个参数为负值，则表示从字符串的尾部开始计算下标位置，即 -1表示最后一个字符，-2 表示倒数第二个字符，以此类推。这对于左侧字符长度不固定时非常有用。

ECMAScript 不再建议使用该方法，推荐使用 slice() 和 substring() 方法。

substring()

用于提取字符串中介于两个指定下标之间的字符。 substring() 方法返回的子[包括 开始 处的字符，但不包括 结束 处的字符。

var str="Hello world!";
str.substring(3); // lo world!
str.substring(3,7));//lo w

substr()和substring()的相同点和不同点

相同点：如果只是写一个参数，两者的作用都一样：都是是截取字符串从当前下标以后直到字符串最后的字符串片段。

示例

var str = '123456789';
console.log(str.substr(2));    //  "3456789"
console.log(str.substring(2)) ;//  "3456789"

不同点：第二个参数
substr（startIndex,lenth）： 第二个参数是截取字符串的长度（从起始点截取某个长度的字符串）；
substring（startIndex, endIndex）： 第二个参数是截取字符串最终的下标 （截取2个位置之间的字符串,‘含头不含尾’）。

示例

var string = "urdhfvdsw";
a.substr(3,5); //hfvds
a.substring(3,5);//hf 含头不含尾

2）slice

slice() 方法可提取字符串或数组的某个部分，并以新的字符串/数组返回被提取的部分。
返回值：
一个新的字符串。包括字符串 stringObject 从 start 开始（包括 start）到 end 结束（不包括 end）为止的所有字符。
详细理解：

当slice方法的参数为负数时，则其先加上字符串/数组的长度
1.若start或者end为负数，则其对应的索引是这个参数加上字符串的长度
2.当负数参数都加上字符串长度变为正数后，若start大于等于end，则取不到任何字符或数组,返回空字符串 “” / 空数组 []

示例1

"123456789".slice(2,-3); //"3456"
"abc def".slice(-2,-1) //e
"abc def".slice(-1,-2) //""
"abc def".slice(0,-2) // abc d
"abc def".slice(-3) //def
"abc def".slice(-6) // bc def
"abc def".slice(-7) //abc def
"abc def".slice(-8) //abc def
/*简易理解 负参数  slice()会将负的参数加上字符串的长度
也可以这样理解后面的负数，如-3，则到倒数第四个位置截止，不包括倒数第三个位置。*/

示例2

var c3 = ["a","b","c","d","e","f"]
var c4 = c3.slice(-2,-4)//相当于（4,2）
console.log(c4) // ""
var c5 = c3.slice(-4,4) //相当于（2,4）
console.log(c5) // ["c","d"]
var c6 = c3.slice(-4)//相当于（2,最后一个字符）
console.log(c5) // ['c', 'd', 'e', 'f']

3、将字符串分割成子字符串数组

1)split

提示： 如果把空字符串 (“”) 用作 separator，那么 stringObject 中的每个字符之间都会被分割。
注意： split() 方法不改变原始字符串。

示例

var str="How are you doing today?";
//分割每个字符，包括空格
str.split(" "); //['How', 'are', 'you', 'doing', 'today?']
//使用 limit 参数
str.split(" ",3); //[How,are,you]
//使用一个字符作为分隔符
str.split("o"); //[H,w are y,u d,ing t,day?]

4、组合字符串/数组，返回一个新的字符串/数组

1）concat

ar a = "hello";
var b = ",world";
var c = a.concat(b); // hello,world

5、某个指定的字符串值在字符串中首次出现的位置。

1) indexOf()

从前向后查找字符串，若没有找到该字符串则返回-1

参数	描述
searchvalue	必需，规定需检索的字符串值
start	可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 string Object.length - 1。如省略该参数，则将从字符串的首字符开始检索。

示例

var str="Hello world, welcome to the universe.";
str.indexOf("e",5); //14
str.indexOf("e"); // 1
str.indexOf("World"); // -1

2）lastIndexOf()

从字符串尾向前开始搜索子字符串,若没有找到该字符串则返回-1
示例1

var stringVal = "hrello world"
alert(stringVal.indexOf("r"));//1
alert(stringVal.lastIndexOf("r"));  // 9 //由后向前数，但返回的是从前到后的索引

示例2

var stringValue = "hello world";
alert(stringValue.indexof("o",6)); //7
alert(stringValue.lastIndexOf("o",6));//4

处理数组

1、添加或删除数组中的元素

1) splice()

删除：array.splice(index,num)，返回值为删除元素，array为结果值。
添加:array.splice(index,num,insertValue)，返回值为删除元素，array为结果值。
num规定应该删除多少元素。必须是数字，可以是 “0”，如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。
注意：这种方法会改变原始数组。

示例

//删除
let colors = ["red", "green", "blue"];
var removed = colors.splice(0,1);
console.log(removed ); //删除第一项 ["red"]
console.log(colors);  //["green", "blue"]var removeds = colors.splice(2,0);
console.log(removeds) //删除0个 返回[]//替换并添加元素
//移除数组的第三个元素，并在数组第三个位置添加新元素:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,1,"Lemon","Kiwi");
console.log(fruits) // ['Banana', 'Orange', 'Lemon', 'Kiwi', 'Mango']//从第三个位置开始删除数组后的两个元素：
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,2);
console.log(fruits) //['Banana', 'Orange']

2、数组中的所有元素转换为一个字符串

1) join()

把数组中的所有元素转换为一个字符串

示例

var arr = ["a", "b", "c", "d"];
arr.join(); // a,b,c,d
arr.join("|") // a|b|c|d

2) toSring()

1、把数字转成字符串
2、数组转成字符串然后通过逗号隔开

let a = [2,3,4]
console.log(a.toString()) // 2,3,4

3、从已有的数组中返回指定的元素

1) slice

上面有介绍

4、移除最后一个数组元素

1) pop()

注意：修改原数组

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var end = fruits.pop();
console.log(fruits) // ['Banana', 'Orange', 'Apple']
console.log(end) // Mango

5、删除并返回第一个元素

1) shift()

注意：修改原数组
如果数组是空的，那么 shift() 方法将不进行任何操作，返回 undefined 值。

var a = ["2","3","4","5"]
console.log(a.shift()) // 2
console.log(a) // ['3', '4', '5']var b = []
console.log(b.shift()) //undefined

6、向数组的开头添加一个或更多元素，并返回新的长度

1. unshift()

注意： 该方法将改变数组的数目。
提示: 将新项添加到数组末尾，请使用 push() 方法。

var arr=[1,2,3];
var newarr= arr.unshift(3)
console.log(newarr) //4 数组长度
console.log(arr) //[3,1,2,3]

7、数组排序

）sort()

排序顺序可以是字母或数字，并按升序或降序。
默认排序顺序为按字母升序。
改变原数组

//数字排序
var points = [40,100,1,5,25,10];
//升序
points.sort(function(a,b){return a-b}); //[1,5,10,25,40,100]
//降序
points.sort(function(a,b){return b-a}); // [100,40,25,10,5,1]//字母排序
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
console.log(fruits) // ['Apple', 'Banana', 'Mango', 'Orange']

8、数组翻转

1) reverse（）

reverse() 方法用于颠倒数组中元素的顺序。

9、检测数组所有元素是否符合指定条件

1) every（）

• 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
• 如果所有元素都满足条件，则返回 true。
• 注意： every() 不会对空数组进行检测。
• 注意： every() 不会改变原始数组。

var ages = [32, 33, 16, 40];function checkAdult(age) {return age >= 18;
}function myFunction() {document.getElementById("demo").innerHTML = ages.every(checkAdult);
}
//输出结果为falsevar arr = [1000, 2000, 3000]
var flag = arr.every(function (item) {return item > 2000;
})
console.log(flag)   //false

2) some()

• some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。
• some() 方法会依次执行数组的每个元素：
• 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
  如果没有满足条件的元素，则返回false。
  注意： some() 不会对空数组进行检测。
  注意： some() 不会改变原始数组。

some()参数说明

function(currentValue, index,arr){// currentValue    必须。当前元素的值// index   可选。当前元素的索引值// arr   可选。当前元素属于的数组对象// 布尔值。如果所有元素都通过检测返回 true，否则返回 false。}
var arr = [1000, 2000, 3000]
var flag = arr.some(function (item) {return item > 2000;
})
console.log(flag)   //true

3) filter()

• filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
  注意： filter() 不会对空数组进行检测。
  注意： filter() 不会改变原始数组。

10、通过字符串创建一个数组

1) from()

这里是引用

示例1

// 返回集合中包含的对象数组
var setObj = new Set(["a", "b", "c"]);
var objArr = Array.from(setObj);
objArr[1] == "b";  // true
// 使用箭头语法和映射函数更改元素的值
var arr = Array.from([1, 2, 3], x => x * 10); //[10,20,30]

示例2

//去重
let arr = Array.from(new Set([1, 2, 1, 2]))
console.log(arr) //[1, 2]

11、判断一个数组是否包含一个指定的值，

1）includes()

如果是返回 true，否则false。

示例1
fromIndex 大于等于数组长度
如果fromIndex 大于等于数组长度 ，则返回 false 。该数组不会被搜索:

var arr = ['a', 'b', 'c'];
arr.includes('c', 3);   //false
arr.includes('c', 100); // false

示例2
如果 fromIndex 为负值，计算出的索引将作为开始搜索searchElement的位置。如果计算出的索引小于 0，则整个数组都会被搜索。

// 数组长度是3
// fromIndex 是 -100
// computed index 是 3 + (-100) = -97var arr = ['a', 'b', 'c'];
arr.includes('a', -100); // true
arr.includes('b', -100); // true
arr.includes('c', -100); // true

js处理字符串、数组的方法相关推荐

1. html设置数组的方法,js改变原数组的方法有哪些？

   js改变原数组的方法 1.pop() pop():删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值.如果数组已经为空,则 pop() 不 改变数组,并返回 un ...

2. js实现字符串数组转换成数字数组

   js实现字符串数组转换成数字数组的几种方式 1. 遍历方式实现 var turnNum = function(nums){for(let i=0;i<nums.length;i++){nums[ ...

3. js便利json 数组的方法

   js便利json 数组的方法 通过Jason对象获取里面某个键的值方法: 1,对象["键"]. 2,对象.键. 这篇文章主要介绍了JQuery遍历json数组的3种方法,本文分别给 ...

4. js 转php json string,JS里字符串转json方法总结

   这次给大家带来JS里字符串转json方法总结,JS里字符串转json的注意事项有哪些,下面就是实战案例,一起来看一下. 第一种方式: 使用js函数eval(); testJson=eval(testJ ...

5. JS 复制新数组的方法

   JS 复制新数组的方法 需求:将旧数组复制新数组,不是引用 方法1: arr = [1,2,3]; let newArr = new Array(); arr.forEach((item) => ...

6. js对象转数组的方法一种方法

   js对象转数组的方法一种方法 let obj = { name: '张三', age: 18, sex: '男' };let a = Object.values(obj) //属性值 // ['张三' ...

7. JS 常用字符串数组遍历函数方法整理

   目录 一.concat() 二.join() 三.push() 四.pop() 五.shift() 六.unshift() 七.slice() 九.substring() 和 substr() 十.s ...

8. JS对象 字符串分割 split() 方法将字符串分割为字符串数组，并返回此数组。 语法： stringObject.split(separator,limit)...

   字符串分割split() 知识讲解: split() 方法将字符串分割为字符串数组,并返回此数组. 语法: stringObject.split(separator,limit) 参数说明: 注意:如 ...

9. JS截取字符串三种方法

   一·js截取字符串 slice() slice() 方法可从已有的数组中返回选定的元素. slice()方法可提取字符串的某个部分,并以新的字符串返回被提取的部分. 注意: slice() 方法不会改 ...

10. 【JS学习】数组过滤方法的使用filter

    前言:本博客系列为学习后盾人js教程过程中的记录与产出,如果对你有帮助,欢迎关注,点赞,分享.不足之处也欢迎指正,作者会积极思考与改正. 文章目录 使用效果: 参数说明: 方法原理解析: 使用效果: ...

最新文章

1. python在会计工作中的应用-浅谈各行各业到底该如何应用python?
2. STO双中心势能积分
3. 处理字符串_12_按照指定的位置截取字符
4. 陶哲轩实分析习题8.5.15
5. 结构型模式——适配器模式
6. 13、oracle数据库下的游标
7. 保存点云数据_3Ｄ点云配准（二多幅点云配准）
8. c语言字符串升序输出,编写程序将已按升序排好的两个字符串a和b中的字符按升序归并到字符串c中，最后输出”abcdefghijklmnpq”。...
9. 如何做一个mysql数据库_如何创建一个简单的mysql数据库
10. 什么叫做微内核？与安卓系统有什么区别？
11. html静态页面实现微信分享思路
12. mysql怎么查合计_mysql-查询不同列的数量合计
13. 【vivado】PL通过axi_hp接口控制PS的DDR
14. 现实世界与虚拟世界的差别在哪里
15. 最全最详细的小白快速上手Modelsim教程
16. STM32 USB接口 一键下载电路详解与过程分析
17. html 磁贴自动布局,也来“玩”MetroUI之磁贴（一）_html/css_WEB-ITnose
18. 应聘总经理的答卷，供大家打分！（二）
19. YOLO模型train.py文件报错：size mismatch for last_layer0.6.weight: copying a param with shape torch.
20. 苹果电脑键盘没反应_MAC PRO type-c接口无反应，充电无反应或一直在充电解决方案...

热门文章

1. EOS技术贴-如何创建EOS钱包和账号并发起转账和投票
2. 谷歌云服务器设置ssh账号,LINUX | 谷歌云开启SSH及设置root密码
3. 让数据多跑路——如何为政务服务办事材料减负
4. iOS开发系列--让你的应用“动”起来--超详细的ios核心动画介绍
5. 深入理解机器学习——集成学习（Ensemble Learning）：袋装法Bagging
6. Python循环结构用法
7. ffmpeg从rtsp录制一段视频命令等
8. 网页打包成app创建IOS免签app教程
9. 如何用VOSviewer分析CNKI关键词共现？
10. Windows添加右键菜单，右击文件夹空白处弹出“在此处打开cmd”菜单