underscore.js每个函数

Question

I'm using underscore.js. I loop through the selectedCharges array using underscore each function but I cannot access the selectedCharges variable inside the loop.

_.each(this.selectedCharges, function(selectedCharge, key){
    if(selectedCharge._id == charge._id){
        this.selectedCharges.splice(key,1); // get error from this line  
    }
});

Answer 1

This happens because the scope changes inside the loop, you can keep the same scope by binding your function with this using the bind function.

The bind() method creates a new function that, when called, has its this keyword set to the provided value, with a given sequence of arguments preceding any provided when the new function is called.

Code example:

_.each(this.selectedCharges, function(selectedCharge, key){
    if(selectedCharge._id == charge._id){
        this.selectedCharges.splice(key,1);  
    }
}.bind(this));

Answer 2

Nowadays javascript has native support for most underscore features. See https://www.reindex.io/blog/you-might-not-need-underscore/ .

The underscore answer is:

var filteredCharges = _.filter(this.selectedCharges, function(selectedCharge){
    return selectedCharge._id !== charge._id;
});

The native answer is:

const filteredCharges = this.selectedCharges.filter(selectedCharge => {
    return selectedCharge._id !== charge._id
});

Answer 3

You can use the third argument which is the collection itself. For example

_.each(this.selectedCharges, function(selectedCharge, key, coll){

   if(selectedCharge._id == charge._id){
       coll.splice(key,1);
   }

});

Here is the documentation link: http://underscorejs.org/#each