侯策《前端開發核心知識高階》讀書筆記 API實現

offset() 方法返回或設定匹配元素相對於文件的偏移。

（一）遞迴實現:

const offset = ele =>

/** nodetype 屬性返回以數字值返回指定節點的節點型別。
* 如果節點是元素節點，則 nodetype 屬性將返回 1。
* 如果節點是屬性節點，則 nodetype 屬性將返回 2。
* 如果節點 node.nodetype 型別不是 element(1)，則跳出；
* 如果相關屬性的 display 屬性為 none，則應該直接返回 0 作為結果。
*/const getoffset = (node) =>
position = window.getcomputedstyle(node)['position']
if (position === 'static') 
result.top = node.offsettop + result.top -node.scrolltop
result.left = node.offsetleft + result.left -node.scrollleft
if (position === 'fixed') 
getoffset(node.parentnode)
}//當前 dom 節點的 display === 'none' 時, 直接返回 
if (window.getcomputedstyle(ele)['display'] === 'none') 
let position
getoffset(ele
) 
return
result
}let box = document.getelementbyid('box2')
let result =offset(box);
console.log(result)

（二）通過getboundingclientrectapi 實現

const offset = ele =>

//當前為 ie11 以下，直接返回 
if (!ele.getclientrects().length) 
//當前 dom 節點的 display === 'none' 時，直接返回 
if (window.getcomputedstyle(ele)['display'] === 'none') 
result =ele.getboundingclientrect()
var docelement =ele.ownerdocument.documentelement
return
}

（一）概念

arr.reduce(callback,[initialvalue])

callback （執行陣列中每個值的函式，包含四個引數）

1、previousvalue （上一次呼叫**返回的值，或者是提供的初始值（initialvalue））
2、currentvalue （陣列中當前被處理的元素）
3、index （當前元素在陣列中的索引）
4、array （呼叫 reduce 的陣列）
initialvalue （作為第一次呼叫 callback 的第乙個引數。）

（二）reduce的用法

簡單用法：

var  arr = [1, 2, 3, 4];

var sum = arr.reduce((x,y)=>x+y)
var mul = arr.reduce((x,y)=>x*y)
console.log( sum ); 
//求和，10
console.log( mul ); //
求乘積，24

計算陣列中每個元素出現的次數：

let names = ['alice', 'bob', 'tiff', 'bruce', 'alice'];

let namenum = names.reduce((pre,cur)=>
else
return
pre},{})
console.log(namenum); 
//

陣列去重：

let arr = [1,2,3,4,4,1]

let newarr = arr.reduce((pre,cur)=>
else
},)console.log(newarr);
//[1, 2, 3, 4]

將二維陣列轉化為一維：

let arr = [[0, 1], [2, 3], [4, 5]]

let newarr = arr.reduce((pre,cur)=>,)
console.log(newarr); 
//[0, 1, 2, 3, 4, 5]

將多維陣列轉化為一維：

let arr = [[0, 1], [2, 3], [4,[5,6,7]]]

const newarr = function
(arr)
console.log(newarr(arr)); 
//[0, 1, 2, 3, 4, 5, 6, 7]

物件裡的屬性求和：

var result =[,,

];var sum = result.reduce(function
(prev, cur) , 0);
console.log(sum) 
//60

（三）reduce 實現 runpromiseinsequence

const f1 = () =>

const f2 = () =>
const array =[f1, f2]
const runpromiseinsequence = (array, value) =>array.reduce(
(promisechain, currentfunction) =>promisechain.then(currentfunction),
promise.resolve(value)
)runpromiseinsequence(array, 'init')

（四）reduce 實現 pipe

function

pipe(src, ...fns), src);
}

（五）實現乙個reduce

if (!array.prototype.reduce) 

if (typeof callback !== 'function') 
var o = object(this
)var len = o.length >>> 0
var k = 0
varvalue
if (arguments.length >= 2) 
else
if (k >=len) 
value = o[k++]
}while (k k++}
return
value}})
}

其中x>>>0，保證x有意義（為數字型別），且為正整數，在有效的陣列範圍內（0 ～ 0xffffffff），且在無意義的情況下預設值為0

array.prototype.reduce = array.prototype.reduce || function

(func, initialvalue) )
return
base
}

compose 實現的幾種方案

（一）compose概念

compose其實和前面提到的pipe一樣，就是執行一連串不定長度的任務（方法） ，實際上，compose和pipe的差別只在於呼叫順序的不同：

//

compose
fn1(fn2(fn3(fn4(args))))
//pipe
fn4(fn3(fn2(fn1(args))))

面向過程的實現方式：

const compose = function

(...args) 
count--
return f1.call(null
, result)
}}

reduce的實現方式：

, arg))

const compose = (...args) => args.reverse().reduce(reducefunc, args.shift())

promise的實現方式：

const compose = (...args) =>

Web Service核心知識

xml,soap和wsdl就是構成webservice平台的三大技術。xml webservice採用http協議傳輸資料，採用xml格式封裝資料，即xml中說明呼叫遠端服務物件的哪個方法，傳遞的引數是什麼，以及服務物件的返回結果是什麼。xml是webservice平台中表示資料的格式。除了易於建立...

Hadoop核心知識

一 hadoop核心 hdfs hadoop distributed file system 分布式檔案系統 用於海量資料的儲存 yarn yet another resource negotiator 資源管理排程系統，用於資源管理排程 map reduce 分布式運算框架，用於海量資料的分析 二...

Linux核心知識

linux核心最初創始人 linus torvalds管理乙個linus樹，linus樹也稱為主線 mainline 一般指的upstream，上游 也指這個linus樹或者各種開發樹。linus樹是以2.6.x這樣的三個數字來表示。比如linux 2.6.18 164.el5xen 的linus樹...