ES6 — 数组方法

一、forEach 循环

var colors = ['red','blue','green']

// es5
for(var i = 0; i < colors.length; i++){
    console.log(colors[i]);
}
// es6
colors.forEach(function(color){
    console.log(color);
});

二、map 需要返回值，如果不给return，默认返回undefined map返回的是一个新的数组

1、场景一 假定有一个数组A，将A数组中的值以双倍形式放到B数组

var numbers = [1,2,3]

// es5
var doubeldNumbers = [];
for(var i = 0; i < numbers.length; i++){
    doubeldNumbers.push(numbers[i] * 2);
}
console.log(doubeldNumbers);
// es6
var doubeld = numbers.map(function(number){
    return number * 2;
});
console.log(doubeld);

2、场景二 假定有一个数组对象a，将a数组中对象某个属性的值储存到b数组中

// es6
var cars = [
    {
        model:'buick',
        price:'cheap'
    },
    {
        model:'bmw',
        price:'expensive'
    }
];
var prices = cars.map(function(car){
    return car.peice;
});

三、filter 过滤 查找符合条件的所有值

1、场景一 假设有一个对象数组a 获取数组中指定类型的对象放到b数组中

var products = [
    {
        name:'a',
        type:'1'
    },
    {
        name:'b',
        type:'2'
    },
    {
        name:'c',
        type:'1'
    },
    {
        name:'d',
        type:'2'
    }
]
// es5
var es5 = [];
for(var i = 0; i < products.length; i++){
    if(products[i].type === '2'){
        es5.push(products[i]);
    }
}
// es6
var es6 = products.filter(function(e){
    return e.type === '2';
});
console.log(es6);

2、场景二 假设有一个对象数组a 过滤掉不满足以下条件的对象：蔬菜 数量大于0 价格小于10

var products2 = [
    {
        num:0,
        price:15
    },
    {
        num:5,
        price:8
    },
    {
        num:2,
        price:12
    },
    {
        num:7,
        price:2
    }
]
var es6_t = products2.filter(function(e){
    return e.num > 0 && e.price < 10;
});
console.log(es6_t);

3、场景三 假设有两个数组a，b 根据a中的id值 过滤掉b数组不符合的数据

var products3 = {
    id:2
}
var es6_s = [
    {
        postId:0,
        content:'one'
    },
    {
        postId:1,
        content:'two'
    },{
        postId:2,
        content:'three'
    },
    {
        postId:3,
        content:'four'
    }
]
function comments(a,b){
    return b.filter(function(e){
        return e.postId === a.id;
    });
}
console.log(comments(products3,es6_s));

四、find 当查找到符合条件的第一个值后 会返回 不会再继续执行下去

1、场景一 假设有一个对象数组a 找到符合条件的对象

var users = [
    {
        name:'a'
    },
    {
        name:'b'
    },
    {
        name:'c'
    }
]
var user = users.find(function(e){
    return e.name === 'b';
})

2、场景二 假设有一个对象数组a 根据指定对象的条件找到数组中符合条件的对象

var posts = [
    {
        id:0,
        title:'cont1'
    },
    {
        id:1,
        title:'cont2'
    }
]
var posts_t = {
    postId:0,
    content:'hellow world!'
}
function arr(a,b){
    return a.find(function(e){
        return e.id === b.postId;
    });
}
console.log(arr(posts,posts_t));

五、every && some

1、场景一 计算对象数组中每个电脑的操作系统是否可用 大于16位操作系统表示可用 否则不可用

var computers = [
    {
        name:'IBM',
        ram:4
    },
    {
        name:'Apple',
        ram:16
    },
    {
        name:'Acer',
        ram:32
    }
];
var every_o = true;
var some_o = false;

// es5
for(var i = 0; i < comments.length; i++){
    var computer = computers[i];
    if(computer.ram < 16){
        every_o = false;  //一假即假
    }else{
        some_o = true; //一真即真
    }
}
// es6
var every_t = computers.every(function(e){
    return e.ram > 16; //所有为真 才为真
});
console.log(every_t);
var some_t = computers.some(function(e){
    return e.ram > 16; //如果有一个是真的 则返回为真
});
console.log(every_t);

2、场景二 假设有一个注册页面 判断所有input内容的长度是否大于0

function Field(value){
    this.value = value
}
Field.prototype.validate = function(){
    return this.value.length > 0
}
var username = new Field("zhangh");
var telephone = new Field("15451321321");
var password = new Field("my_password");
var fields = [username,telephone,password]
var form = fields.every(function(e){
    return e.validate()
})
console.log(form)

六、reduce

1、场景一 计算数组中所有值的总和

var numbers = [10,20,30];
var sum = 0;

// es5
for(var i = 0; i < numbers.length; i++){
    sum += numbers[i];
}
// es6
var sums = numbers.reduce(function(a,b){
    console.log(a);
    return a + b;
},0);// 0定义了a的起始值 (初始化a)，可以定义不同类型值

2、场景二 将数组中对象的某个属性抽离到另一个数组中

var primaryColor = [
    {
        color:'red'
    },
    {
        color:'green'
    },
    {
        color:'blue'
    }
]
var colors = primaryColor.reduce(function(a,b){
    a.push(b.color);
    return a;
},[]);
console.log(colors);

3、场景三 判断字符串中括号是否对称

function kuoh(string){
    return !string.split("").reduce(function(a,b){
        if(a<0){
            return a
        }
        if(b == "("){
            return ++a
        }
        if(b == ")"){
            return --a
        }
        return a;
    },0);
}
console.log(kuoh("()()())("))