建设银行网站关闭闪付深圳建站公司开发费用

当前位置： 首页 > news >正文

建设银行网站关闭闪付,深圳建站公司开发费用,劳务建筑公司网站,海西州网站建设公司文章目录 前言#xff1a;防抖节流函数柯里化函数组合instanceof 实现实现new操作符的行为深拷贝继承实现#xff1a;手写Promise数组中常见函数的实现 前言#xff1a; 在前端面试中#xff0c;经常会遇到要求手写的代码的题目#xff0c;主要是考察我们的编程能力、和对… 文章目录 前言防抖节流函数柯里化函数组合instanceof 实现实现new操作符的行为深拷贝继承实现手写Promise数组中常见函数的实现 前言 在前端面试中经常会遇到要求手写的代码的题目主要是考察我们的编程能力、和对JavaScript的理解以及对前端最佳实践的掌握。下面是我整理了一些常见的手写代码题目您可以看看自己能实现哪些。。 防抖 防抖函数确保一段时间内多次触发事件只执行一次。 // — 基础版 function debounce(fn, delay) {let timer 0;return (e) {if (timer) {clearTimeout(timer);}timer setTimeout(() fn(e), delay);}; } let deboundceCli debounce((e) console.log(e), 500); document.body.addEventListener(click, function () {deboundceCli(执行了。); });// —立即执行版 function debounceImmediate(fn, delay, immediate) {let timer null;return (…rest) {if (timer) {clearTimeout(timer);}// 立即执行if (immediate) {let exec !timer;timer setTimeout(() (timer null), delay);if (exec) {fn(…rest);}} else {timer setTimeout(() fn(…rest), delay);}}; }let deboundceCli debounceImmediate((e) console.log(e), 500, true); document.body.addEventListener(click, function () {deboundceCli(执行了。); });节流 节流函数确保在指定时间内只执行一次。 const throttle (fn, delay) {let lastTimer null;return (e) {if (Date.now() - lastTimer delay) {lastTimer Date.now();fn(e);}}; }; let throttleCli throttle((e) console.log(e), 1000); window.document.addEventListener(scroll, function () {throttleCli(执行了。。 ); });函数柯里化 能够接受多个参数并返回一个新的函数。 // —柯里化 const curry (fn) {return function inner() {let len arguments.length;if (len fn.length) {// 执行return fn(…arguments);} else {// 返回一个函数return (…res) inner(…[…arguments, …res]);}}; };const f1 (a, b, c) a * b * c;let cy curry(f1); console.log(cy(2)(3, 4)); // 24函数组合 接受多个函数返回新的函数执行结果是从右向左执行 // —- 函数组合— 从右向左执行 const group (…rest) {return (val) {return […rest].reduceRight((item, res) {return res(item);}, val);}; };const f1 (val) val 5; const f2 (val) val * 10;let res group(f1,f2) console.log(res(10)); // 105 (10*10) 5 instanceof 实现 根据原型链向上查找如果找到null都还没找到就返回false, 找到就返回 true const my_instanceof (instance, obj) {let proto instance.proto;while (proto) {if (proto.constructor.name obj.name) return true;proto proto.proto;}return false; };let a [];console.log(instanceOf 结果, my_instanceof(a, Array));实现new操作符的行为 function myNew(fn, …args) {// 1. 创建一个空对象let obj Object.create(fn.prototype);// 2. 调用构造函数绑定this并传入参数let result fn.apply(obj, args);// 3. 如果构造函数返回了一个新的对象则返回该对象否则返回步骤1创建的对象return result instanceof Object ? result : obj; }深拷贝 处理基本数据类型对象、数组以及其中的嵌套结构 function deepClone(obj) {// 如果是基本数据类型或null则直接返回if (obj null || typeof obj ! object) {return obj;}// 如果是日期对象则创建一个新的日期对象if (obj instanceof Date) {return new Date(obj);}// 如果是正则对象则创建一个新的正则对象if (obj instanceof RegExp) {return new RegExp(obj);}// 创建一个新对象或数组并存储在WeakMap中const cloneObj new obj.constructor();// 递归拷贝原对象的每个属性for (let key in obj) {if (obj.hasOwnProperty(key)) {// 忽略原型链上的属性cloneObj[key] deepClone(obj[key]);}}return cloneObj; }继承实现 5种JS原型继承方式总结你了解几种 手写Promise 手写Promise 一、二
数组中常见函数的实现 在 JavaScript 中数组的函数式方法非常强大它们允许你以声明式的方式处理数组数据. 设置全局变量numbers const numbers [1, 2, 3];map map 方法创建一个新数组其结果是该数组中的每个元素都调用一次提供的函数后的返回值。 Array.prototype.myMap function (callback) {const newArray [];for (let i 0; i this.length; i) {newArray.push(callback(this[i], i, this));}return newArray; };const squares numbers.myMap((number) number * number); console.log(squares); // 输出 [1, 4, 9]filter filter 方法创建一个新数组其包含通过所提供函数实现的测试的所有元素。 Array.prototype.myFilter function (callback) {const newArray [];for (let i 0; i this.length; i) {if (callback(this[i], i, this)) {newArray.push(this[i]);}}return newArray; };const evens numbers.myFilter((number) number % 2 0); console.log(evens); // 输出 [2]reduce reduce 方法对数组中的每个元素执行一个由您提供的 reducer 函数升序执行将其结果汇总为单个返回值需要处理默认值 Array.prototype.myReduce function (callback, initialValue) {let accumulator initialValue ! undefined ? initialValue : this[0];for (let i initialValue ! undefined ? 0 : 1; i this.length; i) {accumulator callback(accumulator, this[i], i, this);}return accumulator; };const sum numbers.myReduce((accumulator, currentValue) accumulator currentValue ); console.log(sum); // 输出 6forEach forEach 方法对数组的每个元素执行一次提供的函数。 Array.prototype.myForEach function (callback) {for (let i 0; i this.length; i) {callback(this[i], i, this);} };numbers.myForEach((number) console.log(number)); // 输出: // 1 // 2 // 3find find 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。 Array.prototype.myFind function (callback) {for (let i 0; i this.length; i) {if (callback(this[i], i, this)) {return this[i];}}return undefined; };const found numbers.myFind((number) number 1); console.log(found); // 输出 2every every 方法测试所有元素是否都通过了测试函数。如果都通过则返回 true否则返回 false。 Array.prototype.myEvery function (callback) {for (let i 0; i this.length; i) {if (!callback(this[i], i, this)) {return false;}}return true; };const allAreNumbers numbers.myEvery((element) typeof element number ); console.log(allAreNumbers); // 输出 truesome some 方法测试数组中是不是至少有一个元素通过了被提供的函数测试。如果是立即返回 true否则返回 false。 Array.prototype.mySome function (callback) {for (let i 0; i this.length; i) {if (callback(this[i], i, this)) {return true;}}return false; };const anyAreEven numbers.mySome((number) number % 2 0); console.log(anyAreEven); // 输出 trueflat flat 方法将嵌套的数组“拍平”拍平的层级取决于输入的deep 深度
递归实现 const flat (arr, deep 0) {let result [];if (deep 0) return arr;arr.forEach((item) {if (item instanceof Array) { result result.concat(flat(item, deep - 1));} else {result result.concat(item);}});return result; };console.log(flat([1, 2, [3, 4, [5, 6]]], 1)); // [ 1, 2, 3, 4, [ 5, 6 ] ] console.log(flat([1, 2, [3, 4, [5, 6]]], 2)); // [ 1, 2, 3, 4, 5, 6 ]Array.prototype.myFlat function (depth 1) {if (depth 0) return this;return this.reduce((acc, val) {return acc.concat(Array.isArray(val) ? val.myFlat(depth - 1) : val);}, []); };const nestedArray [1, [2, 3, [2, 4, [5]]]]; const flatArray nestedArray.myFlat(2); console.log(flatArray); // 输出 [1, 2, 3, 2, 4, Array(1)]reduceRight reduceRight 方法对数组中的每个元素执行一个由您提供的 reducer 函数从右到左执行将其结果汇总为单个返回值。需要处理默认值 Array.prototype.myReduceRight function (callback, initialValue) {let accumulator initialValue ! undefined ? initialValue : this[this.length - 1];let start initialValue ! undefined ? this.length - 1 : this.length - 2;for (let i start; i 0; i–) {accumulator callback(accumulator, this[i], i, this);}return accumulator; };const rightSum numbers.myReduceRight((accumulator, currentValue) accumulator currentValue ); console.log(rightSum); // 输出 6