JS中indexOf方法
文章描述：
indexOf查找数组或者字符串里面第一次出现的位置
数组中使用
indexOf() 方法可返回数组中某个指定的元素位置。
该方法将从头到尾地检索数组，看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头（没有指定 start参数时）。如果找到一个 item，则返回 item 的第一次出现的位置。
如果在数组中没找到指定元素则返回 -1。
//语法
// array.indexOf(item,start)
//item 必须 要查找的元素的位置，
//start 非必须可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。
let food= ["菠萝", "榴莲", "哈密瓜", "苹果"];
let a = food.indexOf("苹果");
console.log(a) // 3
let b= food.indexOf("香蕉");
console.log(b) // -1
字符串使用
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
区分大小写
如果要检索的字符串值没有出现，则该方法返回 -1。
//语法
//string.indexOf(value,start)
// value 必须 要查找的元素的位置
// start 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 string.length - 1。如省略该参数，则将从字符串的首字符开始检索。
let str="Hello world!";
console.log(str.indexOf("Hello")); //0
console.log(str.indexOf("World") ); //-1
console.log(str.indexOf("world")); //6
多选应用
<template>
<div class="biaoqian">
<button v-for="(item,index) in biaoqianList"
:key='index'
class="btn"
type="default"
size="mini"
:class="{'active': isChange.indexOf(index)!=-1}"
@click="clickBtn(index)">{{item}}</button>
</div>
</template>
<script>
export default{
data(){
return{
isChange:[], //多选
biaoqianList:['牛奶','豆浆','包子','馒头'],
foodChose:[]
}
},
methods:{
clickBtn(index){
// 多选
if (this.isChange.indexOf(index) == -1) {
if(this.isChange.length == 4){
uni.showToast({
title:'最多选择四项',
icon:'none'
})
}else{
this.isChange.push(index);//选中添加到数组里
}
} else {
this.isChange.splice(this.isChange.indexOf(index), 1); //取消选中
}
console.log(this.isChange)
// let biaoqianList = []
// for(let index in this.isChange){ //biaoqianList里面的索引重新加入
// biaoqianList.push(this.biaoqianList[this.isChange[index]])
// }
},
}
}
</script>
<style lang="less">
.biaoqian{
padding-top: 200rpx;
display: flex;
justify-content: start;
align-items: center;
.btn{
border:0.01px solid #76d2f4;
background-color:white ;
color: #76d2f4;
}
.active{
background-color: #76d2f4 ;
color: white;
}
}
</style>
发布时间：2023/02/09
发表评论