本篇文章給大家?guī)砹岁P(guān)于JavaScript的相關(guān)知識,其中主要介紹了五個常用功能及其示例,包括了計(jì)時(shí)器、流程控制、閉包應(yīng)用、arguments剩余參數(shù)以及二次封裝函數(shù)的相關(guān)問題,下面一起來看一下,希望對大家有幫助。

一、計(jì)時(shí)器
實(shí)現(xiàn)一個打點(diǎn)計(jì)時(shí)器,要求:
1、從 start 到 end(包含 start 和 end),每隔 100 毫秒 console.log 一個數(shù)字,每次數(shù)字增幅為 1
2、返回的對象中需要包含一個 cancel 方法,用于停止定時(shí)操作
3、第一個數(shù)需要立即輸出
function count(start, end) {
console.log(start++);
let timer = setInterval(() => {
if (start <= end) {
console.log(start++);
}
}, 100);
return {
cancel: () => {
clearInterval(timer);
},
};
}第一個數(shù)立即輸出,console.log(start++) 中start++是先輸出再自加1。
之后使用setInterval定時(shí)器,count函數(shù)return出cancel,cancel內(nèi)是一個清除定時(shí)器的操作(引用了timer這個在count函數(shù)中聲明的變量),這里用到了閉包的知識。
cancel是一個閉包函數(shù),它能訪問count函數(shù)中的變量timer,這時(shí)這個timer不會被JS垃圾回收機(jī)制清除(會永駐內(nèi)存,即使count函數(shù)被銷毀),這就是可以在外部調(diào)用cancel清除timer這個定時(shí)器的原因。
閉包是指有權(quán)訪問另外一個函數(shù)作用域中的局部變量的函數(shù)。聲明在一個函數(shù)中的函數(shù),叫做閉包函數(shù)。而且內(nèi)部函數(shù)總是可以訪問其所在的外部函數(shù)中聲明的參數(shù)和變量,即使在其外部函數(shù)被返回(壽命終結(jié))了之后。
二、流程控制
實(shí)現(xiàn) fizzBuzz 函數(shù),參數(shù) num 與返回值的關(guān)系如下:
1、如果 num 能同時(shí)被 3 和 5 整除,返回字符串 fizzbuzz
2、如果 num 能被 3 整除,返回字符串 fizz
3、如果 num 能被 5 整除,返回字符串 buzz
4、如果參數(shù)為空或者不是 Number 類型,返回 false
5、其余情況,返回參數(shù) num
示例:
輸入:15輸出:fizzbuzz
這就是簡單的分支判斷:
function fizzBuzz(num) {
if (!num || typeof num !== "number") return false;
if (num % 3 === 0 && num % 5 === 0) return "fizzbuzz";
if (num % 3 === 0) return "fizz";
if (num % 5 === 0) return "buzz";
return num;
}三、閉包應(yīng)用
實(shí)現(xiàn)函數(shù) makeClosures,調(diào)用之后滿足如下條件:
1、返回一個函數(shù)數(shù)組 result,長度與 arr 相同
2、運(yùn)行 result 中第 i 個函數(shù),即 result[i](),結(jié)果與 fn(arr[i]) 相同
示例:
var arr = [1, 2, 3];
var fn = function (x) {
return x * x;
};
var result = makeClosures(arr, fn);
result[1]() === fn(arr[1]) ? console.log("yes") === 4 : console.log("no"); // yes這題一眼看上去感覺是比較繞,但你從上到下去梳理就很容易找到解決的方法:
makeClosures返回一個數(shù)組數(shù)組中每個元素都是一個函數(shù)
并且這些函數(shù)執(zhí)行的結(jié)果要與使用
arr中對應(yīng)元素作為參數(shù)調(diào)用fn的結(jié)果一致
四、arguments剩余參數(shù)
函數(shù) useArguments 可以接收 1 個及以上的參數(shù)。請實(shí)現(xiàn)函數(shù) useArguments,返回所有調(diào)用參數(shù)相加后的結(jié)果。本題的測試參數(shù)全部為 Number 類型,不需考慮參數(shù)轉(zhuǎn)換。
輸入:1, 2, 3, 4輸出:10
解:
function useArguments() {
return [...arguments].reduce((a, b) => a + b);
}函數(shù)中能直接訪問arguments變量,這個變量是一個含有該函數(shù)接收的所有參數(shù)的偽數(shù)組(不具有數(shù)組的全部方法)。
所以我是先使用...解構(gòu)來將arguments轉(zhuǎn)換成一個真正的數(shù)組,之后調(diào)用數(shù)組的reduce求和方法進(jìn)行求和即可。
reduce() 方法對數(shù)組中的每個元素按序執(zhí)行一個由您提供的 reducer 函數(shù),每一次運(yùn)行 reducer 會將先前元素的計(jì)算結(jié)果作為參數(shù)傳入,最后將其結(jié)果匯總為單個返回值。
Array.prototype.reduce(callbackFn, initialValue)
參數(shù):
callbackFn
一個 “
reducer” 函數(shù),包含四個參數(shù):
previousValue:上一次調(diào)用callbackFn時(shí)的返回值。在第一次調(diào)用時(shí),若指定了初始值initialValue,其值則為initialValue,否則為數(shù)組索引為 0 的元素array[0]。
currentValue:數(shù)組中正在處理的元素。在第一次調(diào)用時(shí),若指定了初始值initialValue,其值則為數(shù)組索引為 0 的元素array[0],否則為array[1]。
currentIndex:數(shù)組中正在處理的元素的索引。若指定了初始值
initialValue,則起始索引號為 0,否則從索引 1 起始。
array:用于遍歷的數(shù)組。
initialValue 可選
作為第一次調(diào)用
callback函數(shù)時(shí)參數(shù)previousValue的值。若指定了初始值initialValue,則currentValue則將使用數(shù)組第一個元素;否則previousValue將使用數(shù)組第一個元素,而currentValue將使用數(shù)組第二個元素。
五、二次封裝函數(shù)
實(shí)現(xiàn)函數(shù) partialUsingArguments,調(diào)用之后滿足如下條件:
1、返回一個函數(shù) result
2、調(diào)用 result 之后,返回的結(jié)果與調(diào)用函數(shù) fn 的結(jié)果一致
3、fn 的調(diào)用參數(shù)為 partialUsingArguments 的第一個參數(shù)之后的全部參數(shù)以及 result 的調(diào)用參數(shù)
解:
function partialUsingArguments(fn) {
const arr = [].slice.call(arguments,1)
return function (...arr2) {
// ...arr2表示用arr2接收所有參數(shù),arr2是一個數(shù)組
return fn(...arr,...arr2)
}
}第一個arr數(shù)組表示的是partialUsingArguments接收的第一個參數(shù)之后的全部參數(shù)數(shù)組。
因?yàn)?code>arguments是偽數(shù)組,不具有slice方法,所以這里通過隨便一個數(shù)組(我選的是空數(shù)組[])來調(diào)用slice,然后通過call修改調(diào)用的這個slice的this指向,使其指向到arguments,這樣就相當(dāng)于是在arguments上使用slice方法。
call修改函數(shù)this指向并立即調(diào)用該函數(shù),call第一個參數(shù)表示需要修改的this指向,之后的所有參數(shù)都會作為原函數(shù)的參數(shù)傳遞到原函數(shù)中。
slice(begin,end)方法能切割數(shù)組,返回一個新的數(shù)組對象,這一對象是一個由begin和end決定的原數(shù)組的淺拷貝(包括begin,不包括end)。原始數(shù)組不會被改變。
不加end參數(shù)表示從begin一直切割到最后。






