例:
const add = num => num + 10
const multiply = num => num * 2
const foo = compose(multiply, add)
foo(5) //30
实现:
/* 注意:compose 的每一个参数都是 function,并且返回的也是 function */
// ...funcs 将传入的所有参数,组成一个 array
function compose(...funcs) {
// 如果没有传参,则返回一个 (a)=>a 的 callback
if(funcs.length===0){
return argument=>argument
}
// 如果参数只有一个,则直接返回该参数,而不是 callback
if(funcs.length===1){
return funcs[0]
}
// 简单理解,就是将每一个参数 function 执行后返回的 result,作为下一个参数 function 的 arguments
return funcs.reduce((a,b)=>(...argument)=>a(b(...argument)))
// return funcs.reduce((a,b)=>{
// return (...argument)=>a(b(...argument))
// })
}
git reflog --date=local --all | grep <branch>
还是使用git rebase
如果之前的commit
已经push
到origin branch
了,直接:
git push origin -f
bad:
function(a,b,c,d,e,f)
good:
function({a,b,c,d,e,f})
几乎没用过,熟悉下
"abc".repeat(-1) // RangeError: repeat count must be positive and less than inifinity
"abc".repeat(0) // ""
"abc".repeat(1) // "abc"
"abc".repeat(2) // "abcabc"
"abc".repeat(3.5) // "abcabcabc" 参数count将会被自动转换成整数.
"abc".repeat(1/0) // RangeError: repeat count must be positive and less than inifinity
① 数组易读取,链表只能一个个读或者需要额外空间才能易读取
② 数组增删元素需要使用index
,链表不用
数组和链表优点缺点,应用场景【举例】
① 增删:数组增删的时候需要维护index,链表不需要考虑
② 查:链表查取某一项就比较麻烦。数组的优势在于需要index的时候,随时读取某一个。但很多情况下,简单的列表遍历用哪个都一样。
③ fiber
:链表可以模拟任何流程,并可以随时中断/继续,比如react
的fiber
使用链表可以随时回到当前状态
html:
<div id="a" style="width:100px;height:100px;border:1px blue solid;">
aaa
<div id="b" style="width:50px;height:50px;border:1px red solid;">
bbb
</div>
</div>
① 当你将第三个参数设为true/false
时,
true
:表示在事件捕获阶段触发 handler
false
(默认):表示在事件冒泡阶段触发 handler
js:
const clickA1=()=>{console.log('事件捕获阶段,点击 a')}
const clickA2=()=>{console.log('事件冒泡阶段,点击 a')}
//1.第三个参数作为 useCapture:boolean
//true:表示在事件捕获阶段,触发 handler
document.getElementById('a').addEventListener('click',clickA1,true)
//false:表示在事件冒泡阶段,触发 handler
document.getElementById('a').addEventListener('click',clickA2,false)
注意:
当你将useCapture
设为true
时,同一节点可绑定两次click
事件,
分别为 事件捕获阶段(useCapture=true
) 和 事件冒泡阶段(useCapture=false
) 触发,即触发两次
② 当你将第三个参数设为{capture : true}
时,addEventListener('click',handler,{capture : true})
作用同 ①
③ 当你将第三个参数设为{once : true}
时,addEventListener('click',handler,{once : true})
注册事件只触发一次
js:
const clickA2=()=>{console.log('事件冒泡阶段,点击 a')}
document.getElementById('a').addEventListener('click',clickA2, {once : true})
④ 当你将第三个参数设为{passive : true}
时,addEventListener('click',handler,{passive : true})
禁止注册事件调用preventDefault()
常见于移动端优化,因为不设置该参数的话,浏览器会自己去判断要不要preventDefault
,所以会影响性能,所以干脆显式地设置为 true,让移动端的滑动更流畅
const str='abCDeFg'
function reverse(str) {
let st=''
for(let i=0;i<str.length;i++){
const char=str[i]
if(char.toLowerCase()!==char){
st+=char.toLowerCase()
}else{
/*不是 heigherCase*/
st+=char.toUpperCase()
}
}
return st
}
console.log(reverse(str),str); //ABcdEfG abCDeFg
这两个不经常去用的话,很容易搞混
一、Array.splice(deleteIndex,deleteCount,addItem,addItem,...)
作用:
① 改变原数组
② 始终返回删除的item
例子:
const arr=[1,2,3]
// 从 index=1 开始,删除了 index=1 及后面的 item,改变原数组
arr.splice(1) //返回 [2,3] ,arr=[1]
// 从 index=1 开始,删除了 1 个 item,,改变原数组
arr.splice(1,1) //返回 [2] ,arr=[1,3]
// 从 index=1 开始,删除了 1 个 item,并且在 index=1 的位置上新增了 'a','b',改变原数组
arr.splice(1,1,'a','b') //返回 [2] ,arr=[1,'a','b',3]
二、Array.slice(startIndex,endIndex)
作用:
① 不改变原数组
② 左开右闭,返回被截取的item
例子:
const arr=[1,2,3]
// 从 index=1 开始截取
arr.slice(1) // 返回[2,3] ,不改变原数组
// 从 index=0 开始截取,到 index=2 结束(不包括 2)
arr.slice(0,2) // 左开右闭 ,返回[1,2] ,不改变原数组
// 从倒数第二个 index 开始截取
arr.slice(-2) // 返回[2,3] ,不改变原数组
// 从倒数第二个 index 开始截取,到倒数第一个 index 结束(不包括 -1)
arr.slice(-2,-1) // 左开右闭,返回[2] ,不改变原数组
<Father>
<Child/>
</Father>
① app componentWillMount ② child componentWillMount ③ child componentDidMount ④ app componentDidMount
参考: React的ClassComp和FunctionComp组件的更新/卸载顺序
小进进已开通「读者讨论」功能,觉得不错的话,留言、点「在看」、转发朋友圈都是一种支持 (●'◡'●)ノ 。
欢迎关注本公众号:
(完)