本文详细介绍了JavaScript中字符串和数组的常见操作方法，包括长度获取、字符检索、字符串拼接与分割、数组元素添加与删除等，是前端开发的基础教程。
字符串常用方法
- 字符串相关方法 — .length/.charAt/.fromCharCode
.length ----->字符串的长度
var str = "你好帅呀";
console.log(str.length);//4
.charAt(索引)，返回值是指定索引位置的字符串，超出索引，结果是空字符串，如果下标超出会显示空
var str="hello word";
var str="hello word";
var result=str.charAt(1);
var result = str.charAt(100);//这个超出了输出空字符串
console.log(result);
.fromCharCode(数字值，可以是多个参数)，返回的是ASCII码对应的值
var str = String.fromCharCode(97,98,99);
console.log(str);
-
字符串操作相关方法 — .concat/.indexOf.lastIndexOf
.concat(字符串1,字符串2,…);返回的是拼接之后的新的字符串
var str = '你好！世界'
console.log(str.concat('，这个是将字符串连接在一起'))
.indexOf(要找的字符串,从某个位置开始) 返回的是这个字符串的索引值，没找到返回-1，第二个参数可以不要
var str = '要找的字符串从某个位置开始找起';
console.log(str.indexOf('字'))//填写对应的字符串可以找到下标
console.log(str.indexOf('找',2))//从下标为2起找到对应的字符串“找”字是13,如果从0开始找就是下标1，因为有两个找
console.log(str.indexOf('来'))//如果找不到的话，下标返回 -1
.lastIndexOf(要找的字符串) 从后往前找，但是索引仍然是从左向右的方式
var str = '要找的字符串从某个位置开始找起';
console.log(str.lastIndexOf('找'))//按照从左往右的形式找 但是是从后面找起 输出13
- 字符串操作相关方法 — replace
.replace (“原来的字符串”,“新的字符串”);用来替换字符串的
var str = '这是原来的字符';
console.log(str.replace('原来的','新的字符'))//这是新的字符字符
根据上面所认识的知识可以写出一道简单的判断修改题：
var str = '这是原来的字符';
if(str.indexOf('原来') !== -1){
console.log(str.replace('原来','现在'))
}
//输出：这是现在的字符
.slice (开始的索引，结束的索引) 从索引 “xx” 的位置开始提取，到索引 “xx.length - 1” 的前一个结束，返回这个提取后的字符串；
var str = "如果真的有神，是一个孤家寡人"
console.log(str.slice(0,4))//如果真的 ---- 从提取的下标开始算起，取值到结束前一个下标数 可以称为左闭右开
- 字符串操作相关方法 — .split
.split(“以什么字符串拆分”,拆分后留下的字符个数);后面参数可以省略，直接以什么字符串拆分，他是把字符串以指定的字符拆分成数组
var str = '周周|婷婷|零零|右右'
console.log(str)
console.log(str.split('|')) // ["周周", "婷婷", "零零", "右右"]
var arr = '周周 婷婷 零零 右右'
console.log(arr)
console.log(arr.split(" ")) // ["周周", "婷婷", "零零", "右右"]
var str = "hello world hello javascript";
console.log(str.split("o")); // ["hell", " w", "rld hell", " javascript"]
5. 字符串操作相关方法 — .substr / .substring
.substr(开始的位置，个数) 返回的是截取后的新的字符串,个数也可以省略，就是从什么位置开始截取到最后（!不是取最后下标 ，是最后的个数）
.substring(开始的索引，结束的索引)，返回截取后的字符串，不包含结束的索引字符串
两者的区别就是：一个是取到最后 个数 / 一个是不包含最后的 下标
var str = '你看我取到哪里了？';
console.log(str.substr('0','3')) //你看我
console.log(str.substr('2')) //我取到哪里了？
console.log(str.substr('2','-2')) //
console.log(str.substring('0','3'))//你看我
console.log(str.substring('2')) // 我取到哪里了？
console.log(str.substring('1','-2')) //
- 转换小写 — .toLocaleLowerCase() / .toLowerCase()
//.toLocaleLowerCase() 转小写字母
// .toLowerCase();转小写,两个方法都是转小写。
var str="HELLO";
//str=str.toLocaleLowerCase();
str=str.toLowerCase();
console.log(str); // hello
- 转换大写 — .toLocaleUpperCase() / .toUpperCase()
//.toLocaleUpperCase()转大写
//.toUpperCase() 转大写
var str="hello";
//str=str.toLocaleUpperCase();
str=str.toUpperCase();
console.log(str); // HEELO
- 删除两端空格 — trim()
var str = ' 我打了两端空格 '
console.log(str); // 我打了两端空格
console.log(str.trim()) //我打了两端空格
var str = ' 中间 空格去不掉 '
console.log(str.trim()) // 中间 空格去不掉
Array对象常用方法
- 创建Array对象
//如何创建一个数组
//方式一：数组字面量
var numbers = [1, 2, 3];
console.log(numbers);
//方式二：构造函数，使用构造函数创建对象，跟以前不同的是，此处使用的是数组的构造函数
var array = new Array(3,2,1);
console.log(array);
//创建一个长度为5的空数组
var array1 = new Array(5);
console.log(array1);
注意
构造函数参数中有一个参数为数字n时，构造函数将以数字n为数组的长度，创建一个长度为n的空数组。该数组是长度为n的空数据，并不存在数组元素！
- 判断变量是否是Array对象
在使用数组时，我们往往要先确定该变量是数组变量之后，才能放心地使用数组的方法，否则程序可能会出错。那么如何确定一个变量是否是数组对象呢？
//使用关键字 instanceof
var arr = new Array(1,2,3);
console.log(arr instanceof Array); // true 如果换成别的类型就是false
//使用方法 Array.isArray(对象)---->判断这个对象是不是数组;
console.log(Array.isArray(arr)) // true
- Array对象常用方法 — .push / .unshift / pop() / shift()
.push (值1,值2…)把值往数组后面添加，返回值也是追加数据之后的数组长度，参数的数据类型不限；
var arr = [1,2,3,4,5,6]
var ret = arr.push(7,8,9,10)
console.log(ret,arr) // 10 -> (10) [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
var newarr = new Array(1,2,3,4,5,'后面我还能追加')
var ret = newarr.push(7,8,9,10)
console.log(ret,newarr) // 9 -> (9) [1, 2, 3, 4, 5, 7, 8, 9, 10]
.unshift (值1,值2…)往数组前面添加，返回的是改变后的数组的长度参数数据类型不限;
var arr = [1,2,3,4,5,6]
var ret = arr.unshift(-1,-2,)
console.log(ret,arr)
pop() 删除数组的最后一项，参数无 返回值是删除的那一项;
var arr = [1,2,3,4,5,6]
var ret = arr.pop()
console.log(arr) // (5) -> [1, 2, 3, 4, 5]
shift() 删除数组的第一项，参数无 返回值是删除的那一项;
var arr = [1,2,3,4,5,6]
var ret = arr.shift()
console.log(arr) // (5) -> [2, 3, 4, 5, 6]
数组一些其他方法（有些跟字符串类似）
.indexOf(元素值) 查看某个元素在数组里面的索引，如果没有这个元素返回值是-1
返回值是该元素在数组中的索引值，如果没有就返回-1
indexOf（n，m） 从索引m开始查看n在数组里面的索引值
lastIndexOf（） 从后往前看
var arr = [1,2,3,4,5,3,6]
var res = arr.indexOf(3);
console.log(res) // 索引 2
var res = arr.indexOf(3,3); //(n,m) 索引m开始查看n在数组里面的索引值 5
console.log(res);
var res = arr.indexOf(1,3); // -1
console.log(res);
var res = arr.lastIndexOf(3); // 从后面开始查找
console.log(res);
var res = arr.lastIndexOf(3,4); //从后面的索引4查看‘3’在数组里面的索引
console.log(res);
join(“字符串”) 把数组按照指定的字符串拼接成一个字符串,如果没有参数就按默认的逗号拼接成字符串，如果有参数就按照指定的字符串拼接成字符串
var arr = ["小白","小黑","小红","小芳","小绿","小花"];
var res = arr.join(); // 如果没有传参，就默认‘，’ --- 小白,小黑,小红,小芳,小绿,小花
console.log(res);
var res = arr.join('|'); // 小白|小黑|小红|小芳|小绿|小花
console.log(res);
reverse() 数组反转 参数无 返回值是反转后的数组，(改变原有数组)
var arr = [111,223,311,4,5,6,7,8];
console.log(arr.reverse()) // 两极反转 -> [8, 7, 6, 5, 4, 311, 223, 111]
sort()数组排序 返回值是排好序的数组，改变原有数组。参数可传可不传，如果传参数，参数是回调函数。如果不传参数的时候只能排10以内的数字，不包括10
var arr = [7,6,3,4,9,8,1,5]
console.log(arr.sort()) //[1, 3, 4, 5, 6, 7, 8, 9]
sort（）带有参数的升序和降序 – .sort(function(a,b){}
var arr = [22,1,33,4,5,767,2,3]
console.log(arr.sort(function(a,b){
return a-b;
})) // [1, 2, 3, 4, 5, 22, 33, 767] -> 升序
var Temp = arr.sort(function(a,b){
return b-a;
})
console.log(Temp) //[767, 33, 22, 5, 4, 3, 2, 1] -> 降序
slice（n,m） 从索引n开始获取到索引m （不包含m） 返回值是获取到的元素组成的新数组
注意：slice();和slice(0);都是把原数组复制一份
var ary = [10,20,30,40,50,60,70,80,90,100];
var temp = ary.slice(2,6);
console.log(temp); //结果是[30, 40, 50, 60] 从索引2开始获取到索引6不包括索引6
//注意：slice();和slice(0);都是把原数组复制一份
splice(n,m,x/y/z…) 把数组从索引n开始删除m个元素，用x，y…替换删除的m项。返回值是删除的m项组成的新数组
var ary = [10,20,30,40,50,60,70,80,90,100];
var newarry = ary.splice(2,5,4,5,6,7); //(n(从第n个索引开始),m(删除得个数),x/y/z...(想要增加))
console.log(ary) //旧得数组 ->[10, 20, 4, 5, 6, 7, 80, 90, 100]
console.log(newarry)// 删除数到新的数组里 -> [30, 40, 50, 60, 70]
splice(n,m=0,x/y/z…) 当m项是0的时候，它把x,y…替换项放到索引n的前面
var ary = [10,20,30,40,50,60,70,80,90,100];
var newarry = ary.splice(2,0,123,424,666)
console.log(ary) // (13) [10, 20, 123, 424, 666, 30, 40, 50, 60, 70, 80, 90, 100]
splice(n,m) 当不写x、y替换项的时候代表删除数组的元素
var ary = [10,20,30,40,50,60,70,80,90,100];
var newarry = ary.splice(2,5) // (删除得索引，个数)
console.log(ary) // [10, 20, 80, 90, 100]
当splice（） 里面什么都不写的时候，代表没有对数组做任何操作，返回一个空数组
var ary=[1,2,3,4,5];
var temp=ary.splice();
console.log(temp); //结果：[]
console.log(ary);//结果：[1, 2, 3, 4, 5]
当splice(0) 里面是0 的时候，代表删除整个数组，返回的是原数组的数据，原数组变为空数组
var ary = [10,20,30,40,50,60,70,80,90,100];
var newary = ary.splice(0);
console.log(ary); // 删除了整数组 输出了空数组【】
console.log(newary) // 删除的数组保存到新的数组
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
