前言
在JavaScript中,幾乎每次編寫一段代碼時,通常都會寫入一個函數。我們的大部分代碼執行都是函數調用的結果。所以本文主要給大家介紹了一些JavaScript常用的函數,下面話不多說了,來一起看看詳細的介紹吧
JavaScript常用的函數
一、bind、call、apply函數的實現改變函數的執行上下文中的this指向,但不執行該函數(位于Function構造函數的原型對象上的方法)
Function.prototype.myBind = function (target) { if (typeof this !== 'function') { throw Error('myBind is not a function') } var that = this var args1 = [...arguments].slice(1) var func = function () { var args2 = [..arguments].slice(1) return that.apply(target || window, args1.concat(args2)) } return func}Function.prototype.myCall = function (context=window) { if (typeof this !== 'function') { throw Error('myBind is not a function') } context.fn = this var args = [...arguments].slice(1) var result = context.fn(..args) delete context.fn return result }Function.prototype.myApply = function (context=window) { if (typeof this !== 'function') { throw Error('myApply is not a function') } context.fn = this var result if (argument[1]) { result = context.fn(...arguments[1]) } else { result = context.fn() } delete context.fn return result}二、引用數據類型的深拷貝方法的實現
function cloneDeep (target) { function checkType(target) { return Object.prototype.toString.call(target).slice(8, -1) } var result, checkedType = checkType(target) if (checkedType === 'Array') { result = [] } else if (checkedType === 'Object') { result = {} } else { return target } //遞歸遍歷對象或數組中的屬性值或元素為原始值為止 for (var key in target) { if ( checkType(target[key]) === 'Array' || checkType(target[key]) === 'Object') { result[key] = cloneDeep(target[key]) } else { result[key] = target[key] } } return result}思路:
輸入需要深拷貝的目標target,輸出深拷貝后的結果 通過Object.prototype.toString準確判斷傳入的目標target的數據類型,當target的數據類型為對象或者數組時,會對target進行遞歸遍歷直至當遍歷的數組或者對象中的數據全部為基本數據類型為止三、數組flat函數的實現
Array.prototype.flat
四、實現n的階乘
分析:首先找規律,舉例如3的階乘等于3*2*1,也就是等于n*n-1*n-2的階乘,也就是等于3*2*1的階乘,計算到1的階乘之后,整個計算過程才結束。分析到很容易想到通過遞歸來實現這個數的階乘,因為第一,這個計算過程有規律可循,第二它有最終停止計算的出口,也就是當計算到1的時候就停止運算,以下通過遞歸來實現
function factorial (num) { if (num < 0) { throw new Error('負數沒有階乘') } if (num === 1 || num === 0) { return 1 } return num * factorial(num-1)}factorial(3) //6
新聞熱點
疑難解答
圖片精選