JS中some(),every(),forEach(),map(),filter()区别及使用案例

版权声明： https://blog.csdn.net/xiasohuai/article/details/81981294

map():返回一个新的Array，每个元素为调用func的结果

filter():返回一个符合func条件的元素数组

some():返回一个boolean，判断是否有元素是否符合func条件(有一个就行)

every():返回一个boolean，判断每个元素是否符合func条件（所有都判断）

forEach():没有返回值，只是针对每个元素调用func

map()   返回一个新的Array，每个元素为调用func的结果

<script>
    var numbers = [65, 44, 12, 4];
    function multiplyArrayElement(num) {
        return num * 10;
    }
    function myFunction() {
        console.log(numbers.map(multiplyArrayElement));//[650,440,120,40]
    }
</script>

react中的案例：

getHtmlTodoItem(){
       return (
            this.state.list.map((item,index)=>{
                return (<TodoItem key={index} contents={item} index={index} delete={this.handleDel.bind(this,index)}></TodoItem>)
            })
       )   
    }

filter():返回一个符合func条件的元素数组

<script>
    var ages = [32, 33, 16, 40];
    function checkAdult(age) {
        return age >= 18;
    }
    function myFunction() {
        console.log(ages.filter(checkAdult));//[32,33,40]
    }
</script>

some():返回一个boolean，判断是否有元素是否符合func条件(有一个就行)

<script>
var ages = [3, 10, 18, 20];
function checkAdult(age) {
    return age >= 40;
}
function myFunction() {
    console.log(ages.some(checkAdult));//false
}

function checkAdult2(age) {
    return age >= 18;
}
function myFunction() {
    console.log(ages.some(checkAdult2));//true
}
</script>

every():返回一个boolean，判断每个元素是否符合func条件（所有都判断）

var ages = [32, 33, 16, 40];

function checkAdult(age) {
    return age >= 18;
}

function myFunction() {
    console.log(ages.every(checkAdult))//false
}

forEach():没有返回值，只是针对每个元素调用func

var array1 = ['a', 'b', 'c'];

array1.forEach(function(element) {
  console.log(element);
});

// expected output: "a"
// expected output: "b"
// expected output: "c"


var workdata=[
	    {id:'1',name:"IS"},
	    {id:'2',name:"IS-leader"},
	    {id:'3',name:"数据管理员"},
	    {id:'4',name:"管理员"}
	]	
workdata.forEach(item=>{
	console.log(item.id+" : "+item.name)
})
//  1 : IS
//  2 : IS-leader
//  3 : 数据管理员
//  4 : 管理员

 vue中的案例：

this.data3.forEach(item => {       
         //总额=总额+每列列数量*每列列价格*联系人
        this.totalsum = this.totalsum + item.int2222 * item.decimal1 * this.selsectid.length
})