function myEvery(callback){var arr =this,obj = arguments[1]|| window;for(var i =0; i < arr.length; i++){console.log(i)if(!callback.apply(obj,[arr[i], i, arr])){returnfalse}}returntrue}
Array.prototype.myEvery = myEvery
var arr =[1,2,3,4,5]
console.log(arr.myEvery((ele)=>{return ele >1}))
some
只要有一個條件滿足就停止遍歷
返回值是布爾值
可以改變this指向
function mySome(callback){var arr =this,obj = arguments[1]|| window;for(var i =0; i < arr.length; i++){console.log(i)if(callback.apply(obj,[arr[i], i, arr])){returntrue}}returnfalse}
Array.prototype.mySome = mySome
var arr =[1,2,3,4,5]
console.log(arr.mySome((ele)=>{return ele >6}))
reduce 歸納函數（重要）
參數1：回調函數4參數：prev | ele, index, arr
參數2：initVal（必傳）
prev的初始值是initVal給的
每次循環可以操作prev
類似filter，filter是過濾，返回(return)布爾值，就往容器里放
reduce是歸納，符合條件(if語句)就往容器里放
reduce返回新數組nArr即回調函數內return的內容（prev）
和map、forEach的區別，有了一個初始值initVal
// 將url參數轉為數組形式
var qs ='v=1&_v=j90&aip=1&a=152878233&t=pageview&_s=1&dl=https%3A%2F%2Fdeveloper.mozilla.org%2Fzh-CN%2Fdocs%2FWeb%2FJavaScript%2FReference%2FGlobal_Objects%2FJSON%2Fstringify&ul=zh-cn&de=UTF-8&dt=JSON.stringify()%20-%20JavaScript%20%7C%20MDN&sd=24-bit&sr=1536x864&vp=1519x182&je=0&_u=QACAAAABAAAAAC~&jid=1406847847&gjid=1261334307&cid=1705225672.1581390240&tid=UA-36116321-5&_gid=1728790607.1622245970&_r=1&_slc=1&z=575736183'
var arr = qs.split('&')
var nArr = arr.reduce(function (prev, ele){qArr = ele.split('=')prev[qArr[0]]= qArr[1]return prev
},{})
console.log(nArr)
重寫
function myReduce(callback, initVal){var arr =this;var obj = arguments[2]|| windowvar nResvar prevfor(var i =0; i < arr.length; i++){prev = i ===0? initVal : nResnRes = callback.apply(obj,[prev, arr[i]])}return nRes
}
Array.prototype.myReduce = myReduce
var qs ='v=1&_v=j90&aip=1&a=152878233&t=pageview&_s=1&dl=https%3A%2F%2Fdeveloper.mozilla.org%2Fzh-CN%2Fdocs%2FWeb%2FJavaScript%2FReference%2FGlobal_Objects%2FJSON%2Fstringify&ul=zh-cn&de=UTF-8&dt=JSON.stringify()%20-%20JavaScript%20%7C%20MDN&sd=24-bit&sr=1536x864&vp=1519x182&je=0&_u=QACAAAABAAAAAC~&jid=1406847847&gjid=1261334307&cid=1705225672.1581390240&tid=UA-36116321-5&_gid=1728790607.1622245970&_r=1&_slc=1&z=575736183'
var arr = qs.split('&')
var nRes = arr.myReduce(function (prev, ele){qArr = ele.split('=')prev[qArr[0]]= qArr[1]console.log(this)return prev
},{},{ name:'this'})
console.log(nRes)
reduceRight
從最后一個開始倒著遍歷，和reduce的順序相反
function myReduce(callback, initVal){var arr =this;var obj = arguments[2]|| windowvar nResvar prevfor(var i =0; i < arr.length; i++){prev = i ===0? initVal : nResnRes = callback.apply(obj,[prev, arr[i], i, arr])}return nRes
}
Array.prototype.myReduce = myReduce
Array.prototype.myReduceRight = function (callback, initVal){var arr =this;var obj = arguments[2]|| windowfor(var i = arr.length -1; i >=0; i--){initVal = callback.apply(obj,[initVal, arr[i], i, arr])}return initVal
}
var arr =[1,2,3,4,5]
var nRes1 = arr.myReduce(function (prev, ele, index, arr){prev.push(index +':'+ ele)return prev
},[])
console.log(nRes1)
var nRes2 = arr.myReduceRight(function (prev, ele, index, arr){prev.push(index +':'+ ele)return prev
},[])
console.log(nRes2)
練習
實現模糊搜索
<!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><input type="text" id="J_searchInput" placeholder="請輸入小說"><ul class="J_list"><span>暫無數據</span></ul><div id="J_data" style="display: none;">[{"id":1,"name":"飛狐外傳","chargeFlag":0},{"id":2,"name":"雪山飛狐","chargeFlag":0},{"id":3,"name":"連城訣","chargeFlag":0},{"id":4,"name":"天龍八部","chargeFlag":1},{"id":5,"name":"射雕英雄傳","chargeFlag":1},{"id":6,"name":"白馬嘯西風","chargeFlag":0},{"id":7,"name":"鹿鼎記","chargeFlag":1}]</div><script type="text/html" id="J_tpl"><li>{{name}}</li></script><script>;(function (document){var oInput = document.getElementById('J_searchInput')var data = JSON.parse(document.getElementById('J_data').innerHTML)var tpl = document.getElementById('J_tpl').innerHTML;var list = document.getElementsByClassName('J_list')[0]var emptyTpl = list.innerHTMLvar init = function (){bindEvent()}function bindEvent(){oInput.addEventListener('input', inputBlur,false)}function inputBlur(e){// console.log(this.value) // 這就可以獲取valuevar e = e || window.event;var tar = e.target || e.srcElement;var tagName = tar.tagName.toLowerCase()if(tagName ==='input'){var foundNames =searchByName(tar.value)list.innerHTML =renderList(foundNames)}}function searchByName(key){if(!key){return[]}return data.reduce(function (prev, ele){// 模糊搜索var name = ele.namename.includes(key)? prev.push(ele):''return prev},[])}function renderList(data){if(data.length ===0){return emptyTpl}var list =''data.forEach((item)=>{list += tpl.replace(/{{(.*?)}}/g, function (node, key){return{name: item.name}[key]})})return list}init()})(document)</script></body></html>
