<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
<p v-if="isShow">holle world</p>
<p v-else>holle python</p>
</div>
<script src="../js/vue.js"></script>
<script>
const app = new Vue({
el: "#app",
data:{
isShow:true,
},
methods:{
}
})
const nums = [10,90,400,20,600,20,40,125,10]
// filter函数
let newnums = nums.filter(function(n){
return n < 100
})
console.log(newnums)
//map函数
let newnums1 = nums.map(function(n){
return n * 2
})
console.log(newnums1)
// reduce函数
// 对数组数据汇总
let newnums3 = nums.reduce(function(preValue, n){
return preValue + n
}, 0)
console.log(newnums3)
//
let total = nums.filter(function(n){
return n<100
}).map(function(n){
return n *2
}).reduce(function(prevalue, n){
return prevalue+n
}, 0)
console.log(total)
// 箭头函数
let total1 = nums.filter(n => n<100).map(n=>n*2).reduce((prevalue, n) => prevalue+n)
console.log(total1)
</script>
</body>
</html>
vue高阶函数的相关教程结束。
