JavaScript五個常用功能是什么

這篇文章主要介紹“JavaScript五個常用功能是什么”，在日常操作中，相信很多人在JavaScript五個常用功能是什么問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”JavaScript五個常用功能是什么”的疑惑有所幫助！接下來，請跟著小編一起來學(xué)習吧！

一、計時器

實現(xiàn)一個打點計時器，要求：

1、從 start 到 end（包含 start 和 end），每隔 100 毫秒 console.log 一個數(shù)字，每次數(shù)字增幅為 1

2、返回的對象中需要包含一個 cancel 方法，用于停止定時操作

3、第一個數(shù)需要立即輸出

function count(start, end) {
    console.log(start++); 
    let timer = setInterval(() => {
        if (start  {
            clearInterval(timer);
        },
    };}

第一個數(shù)立即輸出，console.log(start++) 中start++是先輸出再自加1。

之后使用setInterval定時器，count函數(shù)return出cancel，cancel內(nèi)是一個清除定時器的操作（引用了timer這個在count函數(shù)中聲明的變量），這里用到了閉包的知識。

cancel是一個閉包函數(shù)，它能訪問count函數(shù)中的變量timer，這時這個timer不會被JS垃圾回收機制清除（會永駐內(nèi)存，即使count函數(shù)被銷毀），這就是可以在外部調(diào)用cancel清除timer這個定時器的原因。

閉包是指有權(quán)訪問另外一個函數(shù)作用域中的局部變量的函數(shù)。聲明在一個函數(shù)中的函數(shù)，叫做閉包函數(shù)。而且內(nèi)部函數(shù)總是可以訪問其所在的外部函數(shù)中聲明的參數(shù)和變量，即使在其外部函數(shù)被返回（壽命終結(jié)）了之后。

二、流程控制

實現(xiàn) fizzBuzz 函數(shù)，參數(shù) num 與返回值的關(guān)系如下：
1、如果 num 能同時被 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)用

實現(xiàn)函數(shù) makeClosures，調(diào)用之后滿足如下條件：
1、返回一個函數(shù)數(shù)組 result，長度與 arr 相同
2、運行 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

解：

function makeClosures(arr, fn) {
    const result = []
    arr.forEach(item=>{
        result.push(function(){
            return fn(item)
        })
    })
    return result}

這題一眼看上去感覺是比較繞，但你從上到下去梳理就很容易找到解決的方法：

• makeClosures返回一個數(shù)組

• 數(shù)組中每個元素都是一個函數(shù)

• 并且這些函數(shù)執(zhí)行的結(jié)果要與使用arr中對應(yīng)元素作為參數(shù)調(diào)用fn的結(jié)果一致

四、arguments剩余參數(shù)

函數(shù) useArguments 可以接收 1 個及以上的參數(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求和方法進行求和即可。

reduce() 方法對數(shù)組中的每個元素按序執(zhí)行一個由您提供的 reducer 函數(shù)，每一次運行 reducer 會將先前元素的計算結(jié)果作為參數(shù)傳入，最后將其結(jié)果匯總為單個返回值。

Array.prototype.reduce(callbackFn, initialValue)

參數(shù)：

• callbackFn
  一個 “reducer” 函數(shù)，包含四個參數(shù)：

• previousValue：上一次調(diào)用 callbackFn 時的返回值。在第一次調(diào)用時，若指定了初始值 initialValue，其值則為 initialValue，否則為數(shù)組索引為 0 的元素 array[0]。

• currentValue：數(shù)組中正在處理的元素。在第一次調(diào)用時，若指定了初始值 initialValue，其值則為數(shù)組索引為 0 的元素 array[0]，否則為 array[1]。

• currentIndex：數(shù)組中正在處理的元素的索引。若指定了初始值

• initialValue，則起始索引號為 0，否則從索引 1 起始。

• array：用于遍歷的數(shù)組。

• initialValue 可選
  作為第一次調(diào)用 callback 函數(shù)時參數(shù) previousValue 的值。若指定了初始值 initialValue，則 currentValue 則將使用數(shù)組第一個元素；否則 previousValue 將使用數(shù)組第一個元素，而 currentValue 將使用數(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ù)組。

因為arguments是偽數(shù)組，不具有slice方法，所以這里通過隨便一個數(shù)組（我選的是空數(shù)組[]）來調(diào)用slice，然后通過call修改調(diào)用的這個slice的this指向，使其指向到arguments，這樣就相當于是在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一直切割到最后。

到此，關(guān)于“JavaScript五個常用功能是什么”的學(xué)習就結(jié)束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學(xué)習，快去試試吧！若想繼續(xù)學(xué)習更多相關(guān)知識，請繼續(xù)關(guān)注億速云網(wǎng)站，小編會繼續(xù)努力為大家?guī)砀鄬嵱玫奈恼拢?/p>