前端刷題 —— 牛客網前端題庫60道詳解(五)

目錄

• 引言

  41. 使用 arguments (入門)
  42. 使用 apply 調用函數 (簡單)
  43. 二次封裝函數 (簡單)
  44. 柯里化 (入門)
  45. 或運算 (入門)
  46. 且運算 (入門)
  47. 模塊 (較難)
  48. 二進制轉換 (簡單)
  49. 二進制轉換 (入門)
  50. 二進制轉換 (簡單)

引言

牛客網這個前端筆試題庫，能夠說這60道是最基礎的了，也是考察的東西比較雜，有時間4天差很少就能夠刷完，鞏固基礎仍是有些用的。作完題回顧一上午就能夠過完一遍。如今我結合個人答案和參考的其餘人的答案，在這裏作一個總結，也是本身知識的整理結果。

• 前端刷題 —— 牛客網前端題庫60道詳解(一)
• 前端刷題 —— 牛客網前端題庫60道詳解(二)
• 前端刷題 —— 牛客網前端題庫60道詳解(三)
• 前端刷題 —— 牛客網前端題庫60道詳解(四)
• 前端刷題 —— 牛客網前端題庫60道詳解(五)
• 前端刷題 —— 牛客網前端題庫60道詳解(六)

41. 使用 arguments

題目描述
函數 useArguments 能夠接收 1 個及以上的參數。請實現函數 useArguments，返回全部調用參數相加後的結果。本題的測試參數所有爲 Number 類型，不需考慮參數轉換。
輸入：1, 2, 3, 4
輸出：10

// 方法一：直接遍歷
function useArguments() {
    let count = 0
    for(let i = 0; i < arguments.length; i++) {
        count+= arguments[i]
    }
    return count
}

// 方法二：ES6，把arguments轉化成數組用數組的方式相加
function useArguments() {
    return Array.from(arguments).reduce((prev, item) => prev + item, 0)
}
複製代碼

相關知識點：

• arguments —— 函數參數的獲取和類數組的運算。

42. 使用 apply 調用函數

題目描述
實現函數 callIt，調用以後知足以下條件
一、返回的結果爲調用 fn 以後的結果
二、fn 的調用參數爲 callIt 的第一個參數以後的所有參數
輸入：無 輸出：無

// 方法一：把參數從第一個開始截取，而後調用apply
function callIt(fn) {
    let newArr = Array.from(arguments).slice(1)
    return fn.apply(this,newArr)
}
複製代碼

相關知識點：

• apply/arguments

43. 二次封裝函數

題目描述
實現函數 partialUsingArguments，調用以後知足以下條件：
一、返回一個函數 result
二、調用 result 以後，返回的結果與調用函數 fn 的結果一致
三、fn 的調用參數爲 partialUsingArguments 的第一個參數以後的所有參數以及 result 的調用參數
輸入： 無 輸出：無

// 方法一：用call直接擴展運算符
function partialUsingArguments(fn) {
    let args = [].slice.call(arguments,1)
    return function result(...newArgs) {
        return fn.call(this,...args,...newArgs)
    }
}

// 方法二：用apply接收數組
function partialUsingArguments(fn) {
    let args = [].slice.call(arguments,1)
    return function result(...newArgs) {
        return fn.apply(this,args.concat(newArgs))
    }
}

// 方法三：bind
function partialUsingArguments(fn) {
    let args = [].slice.call(arguments,1)
    return function result(...newArgs) {
        return fn.bind(this,...args,...newArgs)()
    }
}
複製代碼

相關知識點：

• arguments/apply/call/bind

44. 柯里化

題目描述
已知 fn 爲一個預約義函數，實現函數 curryIt，調用以後知足以下條件：
一、返回一個函數 a，a 的 length 屬性值爲 1（即顯式聲明 a 接收一個參數）
二、調用 a 以後，返回一個函數 b, b 的 length 屬性值爲 1
三、調用 b 以後，返回一個函數 c, c 的 length 屬性值爲 1
四、調用 c 以後，返回的結果與調用 fn 的返回值一致
五、fn 的參數依次爲函數 a, b, c 的調用參數
輸入
var fn = function (a, b, c) {return a + b + c}; curryIt(fn)(1)(2)(3);
輸出 6

function curryIt(fn) {
    let len = fn.length
    let args = []
    return function (arg){
        args.push(arg)
        if(len > args.length) {
            return arguments.callee
        }
        return fn.apply(this, args)
    }
}
複製代碼

相關知識點：

• 柯里化

函數式編程（三）—— 柯里化

• 函數形參長度獲取：fn.length

45. 或運算

題目描述
返回參數 a 和 b 的邏輯或運算結果
輸入： false, true ; 輸出： true

// 方法一：直接或運算符
function or(a, b) {
    return a || b
}

// 方法二：位運算中的或運算，返回0或者1，須要轉化類型爲布爾值
function or(a, b) {
    return a | b ? true : false
}
複製代碼

相關知識點：

• 或運算

|| 運算符，a和b都爲false，纔是false，其中一個有true，就是false
| 運算符，是位運算，位置上都是0才返回0，位置上有一個1就返回1，若是返回須要布爾值，須要轉化

46. 且運算

題目描述
返回參數 a 和 b 的邏輯且運算結果 輸入：
false, true
輸出：
false

// 方法一：且運算符，返回布爾值
function and(a, b) {
    return a && b
}

// 方法二：位運算的且運算符，返回 0 和 1，須要轉化成布爾值
function and(a, b) {
    return a & b ? true : false
}

複製代碼

相關知識點：

• 且運算

&& 運算符，a和b都爲true，纔是true，其中一個有false，就是false
& 運算符，是位運算，位置上都是1才返回1，位置上有一個0就返回0，若是返回須要布爾值，須要轉化

47. 模塊

題目描述
完成函數 createModule，調用以後知足以下要求：
一、返回一個對象
二、對象的 greeting 屬性值等於 str1， name 屬性值等於 str2
三、對象存在一個 sayIt 方法，該方法返回的字符串爲 greeting屬性值 + ', ' + name屬性值

// 方法一：對象
function createModule(str1, str2) {
    return  {
        greeting: str1,
        name: str2,
        sayIt: function (){
            return this.greeting + ', ' + this.name
        }
    }
}

// 方法二： 構造函數
function createModule(str1, str2) {
    function Obj() {
        this.greeting = str1
        this.name = str2
    }
    Obj.prototype.sayIt = function () {
        return this.greeting + ', ' + this.name
    }
    return new Obj
}
複製代碼

相關知識點：

• 模塊化、構造函數、對象

48. 二進制轉換

題目描述
獲取數字 num 二進制形式第 bit 位的值。注意：
一、bit 從 1 開始
二、返回 0 或 1
三、舉例：2 的二進制爲 10，第 1 位爲 0，第 2 位爲 1
輸入： 128，8
輸出： 1

// 方法一：while循環
function valueAtBit(num, bit) {
    let arr = []
    while(num){
        arr.push(num % 2)
        num = Math.floor(num / 2)
    }
    return arr[bit-1]
}

// 方法二：位運算右移 >> 位數 - 1 而後取模 2
function valueAtBit(num, bit) {
    return (num >> bit - 1) % 2
}
複製代碼

相關知識點：

• 二進制數值運算
• 取模
• 位運算符 左移 >> 右移 << 無符號位右移 <<<

49. 二進制轉換

題目描述
給定二進制字符串，將其換算成對應的十進制數字
輸入：'11000000'
輸出：192

// 方法一：parseInt(str,2) 
// 方法二：
function base10(str) {
    let count = 0
    for(let i = 0; i < str.length; i++) {
        count = count * 2 + str[i]*1
    }
    return count
}
複製代碼

相關知識點：

• 進制轉換

二進制轉十進制，從最高位開始乘2，十進制轉二進制，除2取餘後取逆向

50. 二進制轉換

題目描述
將給定數字轉換成二進制字符串。若是字符串長度不足 8 位，則在前面補 0 到滿8位。
輸入：65
輸出：01000001(字符串)

// 方法一：轉化以後檢查位(算法思惟，推薦)
function convertToBinary(num) {
    let arr = []
    while(num) {
        arr.push(num % 2)
        num = num >> 1
    }
    let str = ''
    let len = arr.length > 8 ? arr.length : 8
    for(let i = len - 1; i >= 0; i--){
        str = arr[i] ? str + '1' : str + '0'
    }
    return str
}

// 方法二：使用API轉化成二進制而後看缺的(儘可能不要前面加字符串，性能消耗大)
function convertToBinary(num) {
    var str = num.toString(2);
    while(str.length < 8) {
        str = "0" + str;
    }
    return str;
}
複製代碼

相關知識點：

• 二進制轉換

還有一個就勝利了，真的是由淺到難的深度~~~~