数组方法和字符串方法

本文详细介绍了JavaScript中数组的类型检测,如使用instanceof和Array.isArray()方法。接着讨论了添加或删除数组元素的方法,如push、unshift、pop和shift。还涵盖了数组的排序、筛选、索引查找以及去重的案例。此外,提到了字符串对象的操作,包括indexOf、charAt、charCodeAt、concat、slice、substring、substr、toLowerCase、toUpperCase、split、replace等方法。最后,文章提供了一个判断用户名是否合法的案例,涉及字符串长度检查和敏感词过滤。
摘要由CSDN通过智能技术生成

数组对象

数组类型检测:数组类型检测有两种常用的方式,分别是使用instanceof运算符和使用ArrayisArray()方法示例

代码:

var arr =D; var obj =();

// 第一种方式
console.log(arr instanceofArray);
//输出结果:true 
console.1og(obi instanceofArray):
//输出结果:false

// 第二种方式
console.1og(ArrayisArray(arr));
//输出结果:true
 console.1og(ArrayisArrayCobj));
//输出结果:false

添加或删除数组元素

JavaScript数组对象提供了添加或删除元素的方法,可以实现在数组的未尾或开头添加新的数组元素,或在数细的末尾或开头移出数细元素。方法如下:

方法名        功能描述返回值
push(参数1...) 数组末尾添加一个或多个元素,会修改原数组 返回数组的新长度 
unshift(参数1...)数组开头添加一个或多个元素(把数组长度-1,无参数),会修改原数组 返回数组的新长度 
pop()     删除数组的最后一个元素,若是空数组则返回undefined,会修改原数组返回删除的元素的值
shift()删除数组的第一个元素,若是空数组则返回undefined,会修改原数组返回第一个元素的值

示例代码:

// push
var arr = ['pink', 'black','white', 'yellow']
console.1og(arrpush(red));//返回的是数组长度 输出结果为:5
console.1og(arr);//修改了原来的数组输出结果为['pink', 'black', 'white', 'ye1low'. 'red']

// unshift
var arr = ['pink', 'black', 'white','ye1low']
console.1og(arr.unshift('red','blue'));  // 返回的是数组长度 输出结果为:6
conso1e.1og(arr);
// 修改了原来的数图 输出结果为['red", "blue', 'pink", "black", "white''yellow']

// pop
var arr = ["pink","black","white","ye1low']
console.1og(arr.pop());// 返回的是除的元素 输出结果为:ye11ow
console.1og(arr);//修改了原来的数组 输出结果为['pink","black","white']

// shift
var arr = ['pink',"black","white","yellow']
console.log(arr.shift());/!返回的是删除的元素(第一个)输出结果为:pink
console.1og(arr);//修改了原来的数组 输出结果为[ "black","white',"yellow']

注意:push()和unshift()方法的返回值是新数组的长度,而pop0和shift方法返回的是移出的数组元素 

案例:筛选数组

案例需求:要求在包含工资的数组中,剔除工资达到2000或以上的数据,把小于2000的数重新放到新的数组里面。

var arr = [1500,1200,2000,2100,1800]; 
var newArr = [];
for (var i = 0; i <arr.length;i++){
if (arr[i] <2000){
        newArr.push(arr[i]);  //相当于:newArr[newArr.1ength] =arr[i]:
     }
}
console.1og(newArr);

数组排序

JavaScript数组对象提供了数组排序的方法,可以实现数组元素排序或者颠倒数组元素的顺序等,排序方法如下:

方法功能描述
reverse()颠倒数组中元素的位置,该方法会改变原数组,返回新数组 
sort()对数组的元素进行排序,该方法会改变原数组,返回新数组 

示例代码:

var arr = ['red', 'blue', 'green']
console.1og(arr.reverse());
//输出的结果为:['green','blue'.'red'] 
conso1e.1og(arr);
//改变原数组['green', 'blue', 'red']

sort有两种情况:

1.不传参数

2.传参数:参数是用来指定按某种顺序进行排列的函数   即a和b是两个将要被比较的元素

// sort: 如果调用该方法时没有使用参数,按照字符编码的顺序进行排率 
var arr1 = [1,4,5,6,73,32,22。15]; 
//不传参数的情况
console.1og(arr1.sortO);
//输出的结果为:[1,15。22,32,4,5,6,73]

// 传参数:参数是用来指定按某种顺序进行排列的函数
即a和b是两个将要被比较的元素
arr1.sort(function (a,b){
// return b-a;//降序 //[73,32,22,15,6,5,4,1] 
return a-b;//开序 // [1,4,5,6,15,22,32,73]
console.1og(arrl);

注意:

#需要注意的是:reverse()和sort()方法的返回值是排序后的数组

#sort如果调用该方法时没有使用参数,按照字符编码的顺序进行排序

数组索引

在开发中,若要查找指定的元素在数组中的位置,可以利用Array对象提供的检索方法,检索方法如下:

方法功能描述
indexOf()返回在数组中可以找到给定值的第一个素引,如果不存在,则返回-1 
lastIndexOf()返回指定元素在教组中的最后一个的索引,如果不存在则返回-1 

示例代码:

var beasts = ['ant', 'bison', 'came1', 'duck', 'bison']; conso1e.1og(beasts.indexof('bison'));
// 输出结果为: 1

// 找到第二个bison的索引
console 1oaCbeasts,indexofc'bison'2);
// 输出结果为: 4
console.1og(beasts.indexof('giraffe'));
// 输出结果为: -1

案例:数组去重

案例需求:要求在一组数据中,去除重复的元素

// 声明数组
function unique(arr) {
    var nemArr = [];// 通历数组
    for (var i =0; i < arr.length; i++) {
         //判断新数组中是否有原数组中的元素 
         //indexof结果为-1表示没有该元素
        if(newArr.indexof(arr[i]===-1){
          //没有的话就把该元素push到新数服中
           newArr.push(arr[i])
        }
   }
    return nemArr
}
// 调用数组
var res = unique([1,2,3,4,3,2])
console.1og(res);

数组转换成字符串

在开发中,可以利用数组对象的join()和toString0方法,将数组转换为字符串。方法如下:

方法功能描述
toString()把数组转换为字符串,逗号分隔每一项 
join('分隔符')将数组的所有元素连接到一个字符中

示例代码:

toString()

// toString
var arr = ['a','b', 'c']
console.1og(arr.toString()); //输出结果为:a,b,c

join()

// join
console.1og(arr.join();// 输出结果为:a,b,c 
console.1og(arr.join(''))://输出结果为:abc
console.log(arr.join('-'));//输出结果为:a-b-c

其他方法

方法功能描述
fill() 用一个固定值填充数组中指定下标范围内的全部元素
splice()通过删除或替换现有元素或者原地酒加新的元素来修改数组,近回被制除项目的新数组 
slice()数组截取,参数为slice(beginend),包含begin,但不包含end,返回被截取项目的新数组
concat()连接两个或多个数组,不影响原数组,返回一个新数组 

示例代码:

fill()

var array1 = [1, 2, 3, 4];
// 填充0,从数组索引2(包含)开始到4(不包含)结束
console.1og(array1.fill(0,2,4));// 输出结果为: Array [1,2,0,0]

//填充5,从数组索引1(包含)开始
console.1og(array1.fill(5.1);
// 输出结果为: Array[1,5,5,5]

// 填充6
console.1og(array1.fill(6));
// 输出结果为: Array[6,6,6,6]

splice()

// 从索引 2 的位置开始删除 0 个元素,插入"小红"
var myFish =["小米","小明","小张","小李"]; 
var removed=myFish.splice(2,0,"小红”); 
console.1og(myFish); 
console.1og(removed):
// 运算后的 myFish:["小米","小明","小红","小张","小李"]
// 被删除的元素:[],没有元素被删除

slice()

// 从索引 2 的位置开始截取
var array3 = ['小兰','小蔡','小刚','小张','小李'];
var getArr=array3.s1ice(2); 
console.1og(array3);
console.1og(getArr);
// 运算后的 array3:['小兰',"小蔡","小刚","小张'。'小李'】
// 被截取的元素:["小刚","小张","小李"]

concat()

// 连接两个数组
const letters = ['a', 'b', 'c'];
const numbers = [1,2,3];

const concatArr=letters.concat(numbers);
console.1og(letters);//['a', 'b', 'c']
console.1og(concatArr);//['a', 'b','c', 1, 2, 3]

字符串对象

字符串对象的使用

语法:

var str = new String('送你一朵小红花') 
console.1og(str)
console.1og(str.length);//输出结果为:7

// 看不到常见的属性和方法 
var str1 ='送你一朵小红花'
console.1og(str1)

根据字符返回位置

方法功能描述
indexOf(要查找的值,开始的位置) 参数2可选,规定在字符串中开始检索的位置。它的合法取值是0到string 
lastIndexOf(要查找的值,开始的位置)

从后往前找,只找第一个匹配的,如果没有找到匹配字符串则返回-1

 参数2可选,规定在字符串中开始检索的位置。它的合法取值是0到 stringObject.length-1。如省略该参数,则将从字符串的最后一个字符处开始检索。

示例代码:

// indexof:参数1:要搜索的子字符串;参数2:可选
var str = new string('送你一朵小红花,送你一朵小红花');// 查找 花首次出现的位置
var res = str.indexof('花');
// 查找花从第七个位置查找 花,第一次出现的位置 
var res2 =str.indexof('花',7);

console.1og(str);
console.1og(str.1ength);//7 
console.1og(res);//输出结果:6 
console.1og(res2);//输出结果:14

案例:判断用户名是否合法

案例需求:用户名长度在3~10范围内,不能出现敏感词admin的任何大小写形式。

var res = prompt('请您输入用户名')
if (res.length < 3 || res.length > 10) {
    alert('用户名长度为3-10位,请您重新输入')
} else if (res.toLocaleLowerCase().indexof('admin')!= -1 | |res.toUppercase(().indexof('admin')!= -1) {
     alert('不能出现敏感词admin')
} else {
     alert('恭喜您,该用户名可以使用');
}

根据位置返回字符

成员作用
charAt(index)获取index位置的字符,位置从0开始计算
charCodeAt(index)获取index位置的字符的ASCII码
str[index]获取指定位置处的字符(HTML5新增)和charAt等效

示例代码:

var str = 'andy';
// 获取index位置的字符
console.log(str.charAt(0));//输出的结果为:a

// 获取index位置的字符的ASCII码
conso le.loa(str.charCodeAt(0))://输出结果为:97(a的ASCTT码是97
for (var i=0:i<str.length;i++){
         //获取指定位置处的字符 
         console.1og(str[i]);
 }

统计出现最多的字符和次数

var max = 0; // 保存出现次数最大值
var maxstr = ''; // 保存出现次数最多的字符
// 2.1 遍历对象的属性和方法 
for (var key in obj) {
// 2.2 将对象中属性的值和max进行比较 
    if (obj[key] > max) {
        max=obj[key]; 
        maxStr =[key];
     }
}
console.1og('出现最多的字符是:"+maxstr +',共出现了'+ max +'次')

字符串操作方法

方法作用
concat(str1, concat()方法用于连接两个或多个字符串。拼接字符串,等效于+,+更常用,该方法没有改变原有字符串,会返回连接两个或多个字符串新字符串。
slice(start)[截取从start位置到end(不包含end)位置之间的一个子字符串可提取字符串的某个部分,并以新的字符串返回被提取的部分
substring(start[,end])截取从start位置到end位置之间的一个子字符串,基本和slice相同,但是不接收负值
substr(start[,length])截取从start位置开始到length长度的子字符串,从起始索引号提取字符串中指定数目的字符
toLowerCase()获取字符串的小写形式
toUpperCase()获取字符串的大写形式
split([separator[
limit])
limit可选。该参数可指定返回的数组的最大长度。如果设置了该参数,返回的子串不会多于这个参数指定的数组。如果没有设置该参数,整个字符串都会被分割,不考虑它的长度。
replace(str1,str2)使用str2替换字符串中的str1,返回替换结果,只会替换第一个字符

示例代码:

var str = 'HelloWord';
// concat
var res = str.concat('!!');
console.log(res);//Helloword!!

// slice
var res1=str.slice(1.5): console.1og(res1);

// substring
var res2=str.substring(3);
var res3 =str.substring(3,7);
console.1og(res3);

// substr
var res4 =str.substr(2. 5); console.log(res4);//11oWo

// tolowerCase
var res5=str.toLocaleLowerCase0: console.1og(res5);//helloword

// toupperCase
var res6=str.toLocaleUpperCase(; console.1og(res6);//HELLOWORD

// split
var str1 = 'How are you doing today? var res7 = str1.split('');
console.1og(res7);// ['How','are', 'you', 'doing', 'today?'] 
var res8 =str1.split():
console.1og(res8);//['How are you doing today?'] 
var res9 =str1.split(' '. 3);
console.1og(res9);// ['How', 'are', 'you']

// replace
var res10 =str1.replace('',',');
console.log(res10);//How,are you doing today?

判断用户名是否合法

示例代码:

var str = 'abc';
str = 'he1lo';
var str = '';
for (var i = 0; i < 100000; i++) {
   str += i;
}
console.1og(str);

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值