踏歌笙的个人主页 - 动态

狗粮品尝师 @江城之光

·

#每日一题# 🦶✍🏻️instanceof
function myInstanceof(left, right) {
let proto = Object.getPrototypeOf(left),
prototype = right.prototype;
while (true) {
if (!proto) return false;
if (proto === prototype) return true;

proto = Object.getPrototypeOf(proto);
}
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 🦶✍🏻️图片懒加载
function isVisible(el) {
const position = el.getBoundingClientRect()
const windowHeight = document.documentElement.clientHeight
const topVisible = position.top > 0 && position.top < windowHeight;
const bottomVisible = position.bottom < windowHeight && position.bottom > 0;
return topVisible || bottomVisible;
}

function imageLazyLoad() {
const images = document.querySelectorAll('img')
for (let img of images) {
const realSrc = img.dataset.src
if (!realSrc) continue
if (isVisible(img)) {
img.src = realSrc
img.dataset.src = ''
}
}
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 对象扁平化
function objectFlat(obj = {}) {
const res = {}
function flat(item, preKey = '') {
Object.entries(item).forEach(([key, val]) => {
const newKey = preKey ? `${preKey}.${key}` : key
if (val && typeof val === 'object') {
flat(val, newKey)
} else {
res[newKey] = val
}
})
}
flat(obj)
return res
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 数组扁平化
function limit(count, array, iterateFunc) {
const tasks = []
const doingTasks = []
let i = 0
const enqueue = () => {
if (i === array.length) {
return Promise.resolve()
}
const task = Promise.resolve().then(() => iterateFunc(array[i++]))
tasks.push(task)
const doing = task.then(() => doingTasks.splice(doingTasks.indexOf(doing), 1))
doingTasks.push(doing)
const res = doingTasks.length >= count ? Promise.race(doingTasks) : Promise.resolve()
return res.then(enqueue)
};
return enqueue().then(() => Promise.all(tasks))
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 🦶✍🏻️请求并发限制
function limit(count, array, iterateFunc) {
const tasks = []
const doingTasks = []
let i = 0
const enqueue = () => {
if (i === array.length) {
return Promise.resolve()
}
const task = Promise.resolve().then(() => iterateFunc(array[i++]))
tasks.push(task)
const doing = task.then(() => doingTasks.splice(doingTasks.indexOf(doing), 1))
doingTasks.push(doing)
const res = doingTasks.length >= count ? Promise.race(doingTasks) : Promise.resolve()
return res.then(enqueue)
};
return enqueue().then(() => Promise.all(tasks))
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 🦶✍🏻️柯里化
function curry(func) {
return function curried(...args) {
if (args.length >= func.length) {
return func.apply(this, args)
}
return function (...args2) {
return curried.apply(this, args.concat(args2))
}
}
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 🦶✍🏻️节流
function throttle(func, ms = 1000) {
let canRun = true
return function (...args) {
if (!canRun) return
canRun = false
setTimeout(() => {
func.apply(this, args)
canRun = true
}, ms)
}
}

作者：iboying
链接：

juejin.cn
来源：稀土掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 🦶✍🏻️防抖
function debounce(func, ms = 1000) {
let timer;
return function (...args) {
if (timer) {
clearTimeout(timer)
}
timer = setTimeout(() => {
func.apply(this, args)
}, ms)
}
}

作者：iboying
链接：

juejin.cn
来源：稀土掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 🦶✍🏻️bind ＋1
Function.prototype.bind = function(ctx, ...args) {
const _self = this
const newFn = function(...rest) {
return _self.call(ctx, ...args, ...rest)
}
if (_self.prototype) {
newFn.prototype = Object.create(_self.prototype);
}
return newFn
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 🦶写apply，＋1
Function.prototype.apply = function(ctx, array = []) {
const o = ctx == undefined ? window : Object(ctx)
const key = Symbol()
o[key] = this
const result = o[key](...array)
delete o[key]
return result
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 再来个手写call＋1分
Function.prototype.call = function(ctx, ...args) {
const o = ctx == undefined ? window : Object(ctx)
const key = Symbol()
o[key] = this
const result = o[key](...args)
delete o[key]
return result
}

展开

技术交流圈

狗粮品尝师 @江城之光

·

2年前

#每日一题# 我上来就是一个手写new
function _new(fn,...args){
const newObj = Object.create(fn.prototype);
const value = fn.apply(newObj,args);
// 如果函数返回非空并是对象返回 value 否则返回 newObj
return value instanceof Object ? value : newObj;
}

展开

技术交流圈

赞过

2

赞了这篇文章

前端开发工程师 @emm

·

3年前