This content originally appeared on DEV Community and was authored by WEI FENG
"Let's take a deep dive to the most basic javascript method implementation. Hope it will help you to understand the language better"
1. Object.create()
The Object.create() method creates a new object, using an existing object as the prototype of the newly created object.
Object.prototype.newCreate = fucntion (obj) {
// create a new function object as
function F(){}
//bind the function object's prototype to the obj
F.prototype = obj
//return the newly created object based on F()
return new F()
}
2. instanceof
The instanceof operator tests to see if the prototype property of a constructor appears anywhere in the prototype chain of an object. The return value is a boolean value.
function myInstanceOf (left, right) {
//access left object's prototype chain
let leftProto = left.__proto__
//access right constructor's prototype method
let rightProto = right.prototype
//check if rightProto is on the left object's prototype chain
while (leftProto) {
if (leftProto === rightProto) return true
else leftProto = leftProto.__proto__
}
return false
}
3. new
The new operator lets developers create an instance of a user-defined object type or of one of the built-in object types that has a constructor function.
function myNew (context, ...args) {
//create a empty object
let obj = {}
//link the new object's prototype chain to the constructor's prototype
obj.__proto__ = context.prototype
//call the constructor function on new object.
let result = context.call(obj, ...args)
return typeof result === "object" ? result : obj
}
4. promise.all()
The Promise.all() method takes an iterable of promises as an input, and returns a single Promise that resolves to an array of the results of the input promises. This returned promise will resolve when all of the input's promises have resolved, or if the input iterable contains no promises. It rejects immediately upon any of the input promises rejecting or non-promises throwing an error, and will reject with this first rejection message / error.
//takes in an array of promises
function myPromiseAll(arr){
// return a new promise
return new Promise(function (resolve,reject) {
let len = arr.length
// setup a array to record the result
let result = []
for (let i = 0; i < len; i++) {
//wrap the value from array in case it is not a promise
Promise.resolve(arr[i]).then(function(value){
result[i] = value
}, function(error) {
// if there is an error, reject immediately
return reject(error)
})
}
//resolve the result when finish iteration
return resolve(result)
})
}
5. promise.race()
The Promise.race() method returns a promise that fulfills or rejects as soon as one of the promises in an iterable fulfills or rejects, with the value or reason from that promise.
//takes in an array of promises
function myPromiseRace(arr){
return new Promise(function (resolve,reject) {
for (let i = 0; i < arr.length; i++) {
Promise.resolve(arr[i]).then(resolve, reject})
}
})
}
6. Debounce function
The debounce() function forces a function to wait a certain amount of time before running again. The function is built to limit the number of times a function is called.
function debounce (func, delay) {
// set a timer variable in the clousure to keep track
let timer = null
//return a debounced function
return function debounced (...args) {
//if timer is not null, clear the timer
if (timer) {
clearTimeout(timer)
timer = null
}
//set a delay to run the function
timer = setTimeout(()=> {
func(...args)
}, delay)
}
}
7. Throttle function
To throttle a function means to ensure that the function is called at most once in a specified time period (for instance, once every 10 seconds). This means throttling will prevent a function from running if it has run “recently”. Throttling also ensures a function is run regularly at a fixed rate.
function throttle (func, wait) {
let timer = null
// set a flag in clousure to decide whether the current throttled program is running
let flag = true
return function throttled (...args) {
// if the flag is true, call the function and set the flag to false
if (flag) {
flag = false
func(...args)
timer = setTimeout(()=>{
//set the flag back to true once finished waiting
flag = true
timer = null
}, wait)
}
}
}
This content originally appeared on DEV Community and was authored by WEI FENG
WEI FENG | Sciencx (2021-12-07T14:35:54+00:00) Javascript method Implementation. Retrieved from https://www.scien.cx/2021/12/07/javascript-method-implementation/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.