\n \n

\n ```\n\n - 这里创建了一个宽度和高度都为 500px 的 SVG 容器，并将其放置在一个`id`为`container`的`div`元素内部。\n\n - **步骤二：创建连线元素并设置初始位置（使用 JavaScript）**\n\n - 假设已经有两个可拖拽的 DOM 元素，它们的`id`分别为`element1`和`element2`。在 JavaScript 中，可以通过以下方式创建连线并设置初始位置：\n\n ```javascript\n const svgContainer = document.getElementById(\"svg-container\");\n const element1 = document.getElementById(\"element1\");\n const element2 = document.getElementById(\"element2\");\n // 创建SVG连线元素\n const line = document.createElementNS(\"http://www.w3.org/2000/svg\", \"line\");\n line.setAttribute(\"x1\", element1.offsetLeft + element1.offsetWidth / 2);\n line.setAttribute(\"y1\", element1.offsetTop + element1.offsetHeight / 2);\n line.setAttribute(\"x2\", element2.offsetLeft + element2.offsetWidth / 2);\n line.setAttribute(\"y2\", element2.offsetTop + element2.offsetHeight / 2);\n line.setAttribute(\"stroke\", \"black\");\n line.setAttribute(\"stroke - width\", \"2\");\n // 将连线元素添加到SVG容器中\n svgContainer.appendChild(line);\n ```\n\n - 这段代码首先获取了 SVG 容器和两个可拖拽元素。然后使用`createElementNS`方法创建了一个 SVG 的``元素，这个方法是用于创建 SVG 元素的正确方式，因为 SVG 元素是在一个特定的命名空间下。接着，通过`setAttribute`方法设置了连线的起点（`x1`、`y1`）和终点（`x2`、`y2`）坐标，这里的坐标是根据元素的偏移位置（`offsetLeft`和`offsetTop`）以及元素宽度和高度的一半来计算的，这样连线就会连接到元素的中心位置。最后，设置了连线的颜色（`stroke`）和宽度（`stroke - width`），并将连线元素添加到 SVG 容器中。\n\n - **步骤三：更新连线位置（在元素拖拽事件中）**\n - 为了在元素拖拽时更新连线的位置，需要在拖拽事件处理函数中添加代码来更新连线的起点和终点坐标。假设使用了 HTML5 的`drag`事件来实现元素的拖拽，以下是一个简单的示例：\n ```javascript\n element1.addEventListener(\"drag\", (event) => {\n line.setAttribute(\"x1\", event.target.offsetLeft + event.target.offsetWidth / 2);\n line.setAttribute(\"y1\", event.target.offsetTop + event.target.offsetHeight / 2);\n });\n element2.addEventListener(\"drag\", (event) => {\n line.setAttribute(\"x2\", event.target.offsetLeft + event.target.offsetWidth / 2);\n line.setAttribute(\"y2\", event.target.offsetTop + event.target.offsetHeight / 2);\n });\n ```\n - 在这里，分别为两个可拖拽元素添加了`drag`事件监听器。当元素被拖拽时，会获取元素的新位置，并更新连线的起点（对于`element1`）或终点（对于`element2`）坐标，从而实现连线随着元素位置变化而动态更新的效果。\n\n3. **使用 Canvas 实现连接线（替代方案）**\n\n - **步骤一：创建 Canvas 元素并获取绘图上下文**\n\n - 在 HTML 文件中创建一个 Canvas 元素：\n\n ```html\n

\n ```\n\n - 然后在 JavaScript 中获取 Canvas 元素和它的绘图上下文（`2d`上下文用于绘制二维图形）：\n\n ```javascript\n const canvasContainer = document.getElementById(\"canvas-container\");\n const ctx = canvasContainer.getContext(\"2d\");\n ```\n\n - **步骤二：绘制初始连线（根据元素位置）**\n\n - 同样假设已经有两个可拖拽的 DOM 元素，`id`为`element1`和`element2`。在 JavaScript 中计算连线的起点和终点坐标并绘制连线：\n\n ```javascript\n const element1 = document.getElementById(\"element1\");\n const element2 = document.getElementById(\"element2\");\n function drawLine() {\n const x1 = element1.offsetLeft + element1.offsetWidth / 2;\n const y1 = element1.offsetTop + element1.offsetHeight / 2;\n const x2 = element2.offsetLeft + element2.offsetWidth / 2;\n const y2 = element2.offsetTop + element2.offsetHeight / 2;\n ctx.beginPath();\n ctx.moveTo(x1, y1);\n ctx.lineTo(x2, y2);\n ctx.strokeStyle = \"black\";\n ctx.lineWidth = 2;\n ctx.stroke();\n }\n drawLine();\n ```\n\n - 这段代码定义了一个`drawLine`函数，在函数内部计算了连线的起点和终点坐标，然后使用 Canvas 的绘图 API（`beginPath`、`moveTo`、`lineTo`和`stroke`）来绘制连线，设置了连线的颜色（`strokeStyle`）和宽度（`lineWidth`）。\n\n - **步骤三：更新连线（在元素拖拽事件中）**\n - 在元素拖拽事件处理函数中，需要清除之前绘制的连线（因为 Canvas 是基于像素的绘制，每次重新绘制都需要清除之前的内容），然后重新绘制连线：\n ```javascript\n element1.addEventListener(\"drag\", (event) => {\n ctx.clearRect(0, 0, canvasContainer.width, canvasContainer.height);\n drawLine();\n });\n element2.addEventListener(\"drag\", (event) => {\n ctx.clearRect(0, 0, canvasContainer.width, canvasContainer.height);\n drawLine();\n });\n ```\n - 这里为两个可拖拽元素添加了`drag`事件监听器。当元素被拖拽时，首先使用`clearRect`方法清除整个 Canvas 画布，然后调用`drawLine`函数重新绘制连线，以实现连线随着元素位置变化而更新的效果。\n",{"_58":228,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/1083/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/1083/timeline",{"_58":231,"_60":61,"_62":232,"_64":233,"_66":234,"_68":235,"_70":236,"_72":237,"_74":238,"_76":239,"_78":240,"_111":241,"_124":125,"_126":24,"_127":-5,"_128":243,"_130":244,"_152":246,"_146":247,"_148":248,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":249,"_162":250,"_168":251,"_170":252,"_182":254,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/1079","https://api.github.com/repos/pro-collection/interview-question/issues/1079/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/1079/comments","https://api.github.com/repos/pro-collection/interview-question/issues/1079/events","https://github.com/pro-collection/interview-question/issues/1079",2740556506,"I_kwDOJGDC6c6jWZLa",1079,"实现一个加法函数sum，支持sum(1)(2)(3,4)(5,6,7....)【热度: 116】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[242],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":245,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},4,"2024-12-15T11:15:36Z","2025-02-22T02:55:03Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：sum 函数实现\n\n举例：\n\n```js\nconsole.log(sum(1,2,3)(4)) => 输出 10\n```\n\n以下是使用 JavaScript 实现满足要求的`sum`函数的代码：\n\n```javascript\nfunction sum(...args) {\n let total = 0;\n for (let arg of args) {\n if (Array.isArray(arg)) {\n for (let num of arg) {\n total += num;\n }\n } else {\n total += arg;\n }\n }\n\n function innerSum(...innerArgs) {\n for (let innerArg of innerArgs) {\n if (Array.isArray(innerArg)) {\n for (let num of innerArg) {\n total += num;\n }\n } else {\n total += innerArg;\n }\n }\n return innerSum;\n }\n\n innerSum.toString = function () {\n return total;\n };\n\n return innerSum;\n}\n```\n\n在上述代码中：\n\n1. 首先定义了外部的`sum`函数，它接受任意数量的参数（可以是单个数字或数字数组），并将这些参数的值累加到`total`变量中。\n2. 然后在`sum`函数内部定义了一个名为`innerSum`的内部函数，它同样接受任意数量的参数，并将这些参数的值累加到`total`变量中。每次调用`innerSum`都会继续累加新传入的参数值。\n3. 最后，为`innerSum`函数添加了一个`toString`方法，当在`console.log`等需要将函数转换为字符串的场景下，会返回累加得到的`total`值，这样就能得到正确的输出结果。\n\n例如：\n\n```javascript\nconsole.log(sum(1, 2, 3)(4));\n// 输出 10\n\nconsole.log(sum(1)(2)(3, 4)(5, 6, 7));\n// 输出 28\n```\n",{"_58":253,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/1079/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/1079/timeline",{"_58":256,"_60":61,"_62":257,"_64":258,"_66":259,"_68":260,"_70":261,"_72":262,"_74":263,"_76":264,"_78":265,"_111":266,"_124":125,"_126":24,"_127":-5,"_128":268,"_130":269,"_152":145,"_146":281,"_148":282,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":283,"_162":284,"_168":285,"_170":286,"_182":288,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/1053","https://api.github.com/repos/pro-collection/interview-question/issues/1053/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/1053/comments","https://api.github.com/repos/pro-collection/interview-question/issues/1053/events","https://github.com/pro-collection/interview-question/issues/1053",2638508271,"I_kwDOJGDC6c6dRHDv",1053,"实现一个处理长字符串的函数【热度: 200】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[267],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":270,"_68":271,"_62":272,"_70":273,"_72":274,"_74":187,"_76":275,"_122":276,"_140":277,"_142":278,"_144":145,"_124":125,"_146":279,"_148":280,"_150":-5,"_151":-5},"https://api.github.com/repos/pro-collection/interview-question/milestones/1","https://github.com/pro-collection/interview-question/milestone/1","https://api.github.com/repos/pro-collection/interview-question/milestones/1/labels",9124541,"MI_kwDOJGDC6c4Aizq9","初","初级面试问题",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},79,"2023-03-06T14:59:51Z","2024-11-22T14:22:55Z","2024-11-06T15:53:43Z","2024-11-06T15:53:44Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"> 描述\n>\n> 实现一个处理字符串的函数: 字符串长度不能超过 256，如果超过 256，字符串中间字符【...】处理，且处理结果字符串长度还是为 256\n\n以下是使用 JavaScript 实现的函数：\n\n```javascript\nfunction processString(str) {\n if (str.length <= 256) {\n return str;\n }\n const halfLength = Math.floor((256 - 3) / 2);\n return str.slice(0, halfLength) + \"... \" + str.slice(str.length - halfLength);\n}\n```\n\n这个函数首先检查输入字符串的长度是否超过 256。如果不超过，则直接返回原字符串。如果超过，它会计算出前后两端保留的字符长度，使得加上中间的“... ”后总长度为 256。然后，它从字符串的开头和结尾分别截取相应长度的子字符串，并将它们与“... ”拼接起来返回。\n",{"_58":287,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/1053/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/1053/timeline",{"_58":290,"_60":61,"_62":291,"_64":292,"_66":293,"_68":294,"_70":295,"_72":296,"_74":297,"_76":298,"_78":299,"_111":300,"_124":125,"_126":24,"_127":-5,"_128":302,"_130":303,"_152":145,"_146":305,"_148":306,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":307,"_162":308,"_168":309,"_170":310,"_182":312,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/1040","https://api.github.com/repos/pro-collection/interview-question/issues/1040/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/1040/comments","https://api.github.com/repos/pro-collection/interview-question/issues/1040/events","https://github.com/pro-collection/interview-question/issues/1040",2622506973,"I_kwDOJGDC6c6cUEfd",1040,"创建一个禁止修改的对象，只能通过指定方法去修改属性【热度: 410】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[301],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":304,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2024-10-29T23:17:59Z","2024-10-29T23:52:46Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"具体描述如下\r\n\r\n```js\r\n// 实现 createObject 函数，用例如下；\r\n\r\n// 比如：\r\nconst obj = createObject({ name: \"name\" });\r\n\r\nobj.name = \"name2\"; // 错误，禁止修改；\r\nobj.set(\"name\", \"name2\"); // 正确方式，允许修改；\r\nobj.set(\"address.info\", \"chongqing\"); // 正确方式，允许添加属性。\r\n```\r\n\r\n**实现**\r\n\r\n以下是使用 JavaScript 实现的`createObject`函数：\r\n\r\n```javascript\r\nfunction createObject(initialData) {\r\n const data = initialData;\r\n return new Proxy(data, {\r\n set(target, property, value, receiver) {\r\n if (property === 'set') {\r\n const keys = property.split('.');\r\n let obj = target;\r\n for (let i = 0; i < keys.length - 1; i++) {\r\n obj = obj[keys[i]] || (obj[keys[i]] = {});\r\n }\r\n obj[keys[keys.length - 1]] = value;\r\n return true;\r\n } else {\r\n return false;\r\n }\r\n },\r\n get(target, property, receiver) {\r\n if (property === 'set') {\r\n return function (key, value) {\r\n const keys = key.split('.');\r\n let obj = target;\r\n for (let i = 0; i < keys.length - 1; i++) {\r\n obj = obj[keys[i]] || (obj[keys[i]] = {});\r\n }\r\n obj[keys[keys.length - 1]] = value;\r\n };\r\n } else {\r\n return target[property];\r\n }\r\n },\r\n });\r\n}\r\n```\r\n\r\n你可以使用以下方式测试这个函数：\r\n\r\n```javascript\r\nconst obj = createObject({ name: 'name' });\r\n\r\nobj.name = 'name2'; // 不会生效，禁止直接修改属性\r\nconsole.log(obj.name); // 'name'\r\n\r\nobj.set('name', 'name2');\r\nconsole.log(obj.name); // 'name2'\r\n\r\nobj.set('address.info', 'chongqing');\r\nconsole.log(obj.address.info); // 'chongqing'\r\n```\r\n",{"_58":311,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/1040/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/1040/timeline",{"_58":314,"_60":61,"_62":315,"_64":316,"_66":317,"_68":318,"_70":319,"_72":320,"_74":321,"_76":322,"_78":323,"_111":324,"_124":125,"_126":24,"_127":-5,"_128":326,"_130":327,"_152":145,"_146":329,"_148":329,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":330,"_162":331,"_168":332,"_170":333,"_182":335,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/1014","https://api.github.com/repos/pro-collection/interview-question/issues/1014/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/1014/comments","https://api.github.com/repos/pro-collection/interview-question/issues/1014/events","https://github.com/pro-collection/interview-question/issues/1014",2597801654,"I_kwDOJGDC6c6a1062",1014,"如何把一个数组随机打乱【热度: 550】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[325],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":328,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2024-10-18T15:14:02Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：数组随机打乱\n\n在 JavaScript 中，可以使用以下几种方法来随机打乱一个数组：\n\n**一、使用`sort`方法结合随机函数**\n\n1. **基本原理**：\n\n - JavaScript 的数组`sort`方法可以接受一个比较函数作为参数。通过提供一个随机的比较函数，可以实现对数组的随机排序，从而打乱数组的顺序。\n\n2. **示例代码**：\n\n```javascript\nconst array = [1, 2, 3, 4, 5];\n\narray.sort(() => Math.random() - 0.5);\n\nconsole.log(array);\n```\n\n在这个例子中，`sort`方法的比较函数每次都会返回一个随机的正负值，使得数组元素的排序顺序完全随机，从而实现数组的随机打乱。\n\n**二、Fisher-Yates 洗牌算法**\n\n1. **基本原理**：\n\n - Fisher-Yates 洗牌算法是一种经典的随机打乱数组的算法。它的基本思想是从数组的最后一个元素开始，随机选择一个位置与当前元素交换，然后逐步向前移动，重复这个过程，直到处理完第一个元素。\n\n2. **示例代码**：\n\n```javascript\nfunction shuffleArray(array) {\n for (let i = array.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [array[i], array[j]] = [array[j], array[i]];\n }\n return array;\n}\n\nconst array = [1, 2, 3, 4, 5];\n\nconst shuffledArray = shuffleArray(array);\n\nconsole.log(shuffledArray);\n```\n\n在这个例子中，定义了一个`shuffleArray`函数，该函数使用 Fisher-Yates 洗牌算法随机打乱输入的数组，并返回打乱后的数组。\n",{"_58":334,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/1014/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/1014/timeline",{"_58":337,"_60":61,"_62":338,"_64":339,"_66":340,"_68":341,"_70":342,"_72":343,"_74":344,"_76":345,"_78":346,"_111":347,"_124":125,"_126":24,"_127":-5,"_128":349,"_130":350,"_152":187,"_146":352,"_148":353,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":354,"_162":355,"_168":356,"_170":357,"_182":359,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/1007","https://api.github.com/repos/pro-collection/interview-question/issues/1007/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/1007/comments","https://api.github.com/repos/pro-collection/interview-question/issues/1007/events","https://github.com/pro-collection/interview-question/issues/1007",2597622372,"I_kwDOJGDC6c6a1JJk",1007,"JS 如何翻转一个数组【热度: 327】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[348],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":351,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2024-10-18T14:07:09Z","2025-02-26T11:53:54Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：翻转数组\n\n在 JavaScript 中，可以通过以下几种方法来翻转一个数组：\n\n**一、使用循环和数组拼接**\n\n1. 原理：\n\n - 通过从数组的末尾开始遍历每个元素，并将其依次添加到一个新的数组中，实现数组的翻转。\n - 首先确定数组的长度，然后从最后一个元素开始，逐个将元素添加到新数组中。\n\n2. 代码示例：\n\n```javascript\nfunction reverseArray(arr) {\n const reversedArr = [];\n for (let i = arr.length - 1; i >= 0; i--) {\n reversedArr.push(arr[i]);\n }\n return reversedArr;\n}\n\nconst originalArray = [1, 2, 3, 4, 5];\nconst reversedArray = reverseArray(originalArray);\nconsole.log(reversedArray); // [5, 4, 3, 2, 1]\n```\n\n**二、使用数组的`reverse`方法**\n\n1. 原理：\n\n - JavaScript 的数组对象提供了一个`reverse`方法，可以直接原地翻转数组，即修改原始数组。\n - 这个方法会改变原始数组的顺序，将第一个元素变为最后一个，第二个元素变为倒数第二个，以此类推。\n\n2. 代码示例：\n\n```javascript\nconst originalArray = [1, 2, 3, 4, 5];\nconst reversedArray = originalArray.reverse();\nconsole.log(reversedArray); // [5, 4, 3, 2, 1]\n```\n\n**三、使用扩展运算符和`reverse`方法（不修改原始数组）**\n\n1. 原理：\n\n - 首先使用扩展运算符（`...`）将原始数组展开为一个新的数组，然后对这个新数组调用`reverse`方法，这样可以在不修改原始数组的情况下得到一个翻转后的数组。\n\n2. 代码示例：\n\n```javascript\nconst originalArray = [1, 2, 3, 4, 5];\nconst reversedArray = [...originalArray].reverse();\nconsole.log(reversedArray); // [5, 4, 3, 2, 1]\nconsole.log(originalArray); // [1, 2, 3, 4, 5]（原始数组未被修改）\n```\n\n这些方法可以根据具体的需求选择使用，如果你希望修改原始数组，可以直接使用`reverse`方法；如果你希望保留原始数组并得到一个翻转后的新数组，可以使用循环或者扩展运算符结合`reverse`方法。\n",{"_58":358,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/1007/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/1007/timeline",{"_58":361,"_60":61,"_62":362,"_64":363,"_66":364,"_68":365,"_70":366,"_72":367,"_74":368,"_76":369,"_78":370,"_111":371,"_124":125,"_126":24,"_127":-5,"_128":373,"_130":374,"_152":137,"_146":376,"_148":377,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":378,"_162":379,"_168":380,"_170":381,"_182":383,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/1006","https://api.github.com/repos/pro-collection/interview-question/issues/1006/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/1006/comments","https://api.github.com/repos/pro-collection/interview-question/issues/1006/events","https://github.com/pro-collection/interview-question/issues/1006",2597618887,"I_kwDOJGDC6c6a1ITH",1006,"JS 如何翻转一个字符串【热度: 442】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[372],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":375,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2024-10-18T14:05:57Z","2025-05-14T12:51:24Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：翻转字符串\n\n在 JavaScript 中，可以通过以下几种方式翻转一个字符串：\n\n**一、使用循环和字符串拼接**\n\n1. 原理：\n\n - 通过从字符串的末尾开始遍历每个字符，并将其依次拼接起来，从而实现字符串的翻转。\n - 首先获取字符串的长度，然后从最后一个字符开始，逐个将字符添加到一个新的字符串中。\n\n2. 代码示例：\n\n```javascript\nfunction reverseString(str) {\n let reversedStr = \"\";\n for (let i = str.length - 1; i >= 0; i--) {\n reversedStr += str[i];\n }\n return reversedStr;\n}\n\nconst originalString = \"hello world\";\nconst reversedString = reverseString(originalString);\nconsole.log(reversedString); // 'dlrow olleh'\n```\n\n**二、使用数组方法和`join`**\n\n1. 原理：\n\n - 将字符串转换为字符数组，然后使用数组的`reverse`方法翻转数组的顺序，最后再使用`join`方法将数组转换回字符串。\n - 这种方法利用了 JavaScript 中数组操作的便利性来实现字符串的翻转。\n\n2. 代码示例：\n\n```javascript\nfunction reverseString(str) {\n return str.split(\"\").reverse().join(\"\");\n}\n\nconst originalString = \"hello world\";\nconst reversedString = reverseString(originalString);\nconsole.log(reversedString); // 'dlrow olleh'\n```\n\n**三、使用递归**\n\n1. 原理：\n\n - 递归地将字符串的最后一个字符与剩余部分的翻转结果拼接起来，直到字符串为空。\n - 每次递归调用都将字符串缩短一个字符，并将最后一个字符放在结果的前面。\n\n2. 代码示例：\n\n```javascript\nfunction reverseString(str) {\n if (str === \"\") {\n return \"\";\n }\n return str[str.length - 1] + reverseString(str.slice(0, -1));\n}\n\nconst originalString = \"hello world\";\nconst reversedString = reverseString(originalString);\nconsole.log(reversedString); // 'dlrow olleh'\n```\n",{"_58":382,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/1006/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/1006/timeline",{"_58":385,"_60":61,"_62":386,"_64":387,"_66":388,"_68":389,"_70":390,"_72":391,"_74":392,"_76":393,"_78":394,"_111":395,"_124":125,"_126":24,"_127":-5,"_128":404,"_130":405,"_152":145,"_146":407,"_148":407,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":408,"_162":409,"_168":410,"_170":411,"_182":413,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/869","https://api.github.com/repos/pro-collection/interview-question/issues/869/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/869/comments","https://api.github.com/repos/pro-collection/interview-question/issues/869/events","https://github.com/pro-collection/interview-question/issues/869",2498581712,"I_kwDOJGDC6c6U7VTQ",869,"实现阿拉伯数字转中文【热度: 673】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[396,403],{"_70":397,"_72":398,"_58":399,"_117":400,"_119":401,"_121":24,"_122":402},5326133419,"LA_kwDOJGDC6c8AAAABPXZYqw","https://api.github.com/repos/pro-collection/interview-question/labels/%E5%B0%8F%E7%B1%B3","小米","ededed","公司标签",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":406,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2024-08-31T03:12:35Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：数字转中文\n\n将阿拉伯数字转换成中文数字，主要考虑到以下几个转换规则：\n\n1. **基本数字**：0-9 对应的汉字数字。\n2. **单位**：十、百、千、万、亿等。\n3. **规则**：数字从右到左，每 4 位一小节，小节内部和小节之间的转换规则。\n\n### 实现思路\n\n1. 将阿拉伯数字分解成单个数字，从右到左进行处理。\n2. 对每 4 位数字进行处理，即一个小节，处理完再根据小节的位置添加对应的单位（万、亿等）。\n3. 处理当前小节内部的数字，并添加十、百、千的单位，注意去除连续的零，并且在必要时加入“零”字。\n4. 将各个小节合并得到最终结果。\n\n下面的 JavaScript 函数实现了阿拉伯数字到中文数字的基本转换：\n\n```js\nconst number2text = (number, type = \"upper\") => {\n // 配置\n const confs = {\n lower: {\n num: [\"零\", \"一\", \"二\", \"三\", \"四\", \"五\", \"六\", \"七\", \"八\", \"九\"],\n unit: [\"\", \"十\", \"百\", \"千\", \"万\"],\n level: [\"\", \"万\", \"亿\"],\n },\n upper: {\n num: [\"零\", \"壹\", \"贰\", \"叁\", \"肆\", \"伍\", \"陆\", \"柒\", \"捌\", \"玖\"],\n unit: [\"\", \"拾\", \"佰\", \"仟\"],\n level: [\"\", \"万\", \"亿\"],\n },\n decimal: {\n unit: [\"分\", \"角\"],\n },\n maxNumber: 999999999999.99,\n };\n\n // 过滤不合法参数\n if (Number(number) > confs.maxNumber) {\n console.error(`The maxNumber is ${confs.maxNumber}. ${number} is bigger than it!`);\n return false;\n }\n\n const conf = confs[type];\n const numbers = String(Number(number).toFixed(2)).split(\".\");\n const integer = numbers[0].split(\"\");\n const decimal = Number(numbers[1]) === 0 ? [] : numbers[1].split(\"\");\n\n // 四位分级\n const levels = integer.reverse().reduce((pre, item, idx) => {\n let level = pre[0] && pre[0].length < 4 ? pre[0] : [];\n let value = item === \"0\" ? conf.num[item] : conf.num[item] + conf.unit[idx % 4];\n level.unshift(value);\n\n if (level.length === 1) {\n pre.unshift(level);\n } else {\n pre[0] = level;\n }\n\n return pre;\n }, []);\n\n // 整数部分\n const _integer = levels.reduce((pre, item, idx) => {\n let _level = conf.level[levels.length - idx - 1];\n let _item = item.join(\"\").replace(/(零)\\1+/g, \"$1\"); // 连续多个零字的部分设置为单个零字\n\n // 如果这一级只有一个零字，则去掉这级\n if (_item === \"零\") {\n _item = \"\";\n _level = \"\";\n\n // 否则如果末尾为零字，则去掉这个零字\n } else if (_item[_item.length - 1] === \"零\") {\n _item = _item.slice(0, _item.length - 1);\n }\n\n return pre + _item + _level;\n }, \"\");\n\n // 小数部分\n let _decimal = decimal\n .map((item, idx) => {\n const unit = confs.decimal.unit;\n const _unit = item !== \"0\" ? unit[unit.length - idx - 1] : \"\";\n\n return `${conf.num[item]}${_unit}`;\n })\n .join(\"\");\n\n // 如果是整数，则补个整字\n return `${_integer}元` + (_decimal || \"整\");\n};\n```\n",{"_58":412,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/869/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/869/timeline",{"_58":415,"_60":61,"_62":416,"_64":417,"_66":418,"_68":419,"_70":420,"_72":421,"_74":422,"_76":423,"_78":424,"_111":425,"_124":125,"_126":24,"_127":-5,"_128":432,"_130":433,"_152":145,"_146":435,"_148":436,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":437,"_162":438,"_168":439,"_170":440,"_182":442,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/724","https://api.github.com/repos/pro-collection/interview-question/issues/724/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/724/comments","https://api.github.com/repos/pro-collection/interview-question/issues/724/events","https://github.com/pro-collection/interview-question/issues/724",2254463388,"I_kwDOJGDC6c6GYGGc",724,"扁平数据通过 parent 关联, 实现扁平结构转嵌套 tree 结构【热度: 218】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[426,431],{"_70":427,"_72":428,"_58":429,"_117":430,"_119":401,"_121":24,"_122":402},5312738037,"LA_kwDOJGDC6c8AAAABPKny9Q","https://api.github.com/repos/pro-collection/interview-question/labels/%E7%99%BE%E5%BA%A6","百度",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":434,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2024-04-20T09:07:22Z","2024-04-20T09:07:23Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：扁平结构转嵌套结构\n\n**题目**\n\n```\n数据输入：\n[\n { \"name\": \"数据1\", \"parent\": null, \"id\": 1 },\n { \"name\": \"数据2\", \"id\": 2, \"parent\": 1 },\n { \"name\": \"数据3\", \"parent\": 2, \"id\": 3 },\n { \"name\": \"数据4\", \"parent\": 3, \"id\": 4 },\n { \"name\": \"数据5\", \"parent\": 4, \"id\": 5 },\n { \"name\": \"数据6\", \"parent\": 2, \"id\": 6 }\n]\n\n数据输出：\n[\n {\n \"name\": \"数据1\",\n \"parent\": null,\n \"id\": 1,\n \"children\": [\n {\n \"name\": \"数据2\",\n \"id\": 2,\n \"parent\": 1,\n \"children\": [\n {\n \"name\": \"数据3\",\n \"parent\": 2,\n \"id\": 3,\n \"children\": [\n {\n \"name\": \"数据4\",\n \"parent\": 3,\n \"id\": 4,\n \"children\": [\n {\n \"name\": \"数据5\",\n \"parent\": 4,\n \"id\": 5,\n \"children\": []\n }\n ]\n }\n ]\n },\n {\n \"name\": \"数据6\",\n \"parent\": 2,\n \"id\": 6,\n \"children\": []\n }\n ]\n }\n ]\n }\n]\n```\n\n**解**\n\n解法非常有意思，自己好好体会\n\n```js\nfunction listToTree(list) {\n const map = {},\n roots = [];\n\n // 首先将每个节点按照 id 存入 map\n for (const item of list) {\n map[item.id] = { ...item, children: [] };\n }\n\n for (const item of list) {\n if (item.parent === null) {\n // 顶级节点\n roots.push(map[item.id]);\n } else if (map[item.parent]) {\n // 非顶级节点，找到父节点并添加到其 children 数组中\n map[item.parent].children.push(map[item.id]);\n }\n }\n\n return roots;\n}\n\nconst tree = listToTree(list);\n```\n",{"_58":441,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/724/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/724/timeline",{"_58":444,"_60":61,"_62":445,"_64":446,"_66":447,"_68":448,"_70":449,"_72":450,"_74":451,"_76":452,"_78":453,"_111":454,"_124":125,"_126":24,"_127":-5,"_128":457,"_130":458,"_152":145,"_146":460,"_148":460,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":461,"_162":462,"_168":463,"_170":464,"_182":466,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/723","https://api.github.com/repos/pro-collection/interview-question/issues/723/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/723/comments","https://api.github.com/repos/pro-collection/interview-question/issues/723/events","https://github.com/pro-collection/interview-question/issues/723",2254461151,"I_kwDOJGDC6c6GYFjf",723,"树结构查找，实现一个函数，通过 id 来查找 tree 数据结构对应的节点【热度: 867】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[455,456],{"_70":427,"_72":428,"_58":429,"_117":430,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":459,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2024-04-20T09:01:01Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：树结构查找\n\n树结构查找，实现一个函数，通过 id 来查找 tree 数据结构对应的节点\n\n**题目如下**\n\n```js\n// 数据如下：\nconst tree = [\n {\n name: \"数据1\",\n id: 1,\n children: [\n {\n name: \"数据2\",\n id: 2,\n children: [\n {\n name: \"数据3\",\n id: 3,\n children:\n {\n name: \"数据4\",\n id: 4,\n children: [],\n },\n ],\n },\n ],\n },\n ],\n },\n];\n\nfunction findNodeById(tree, id) {\n // ....\n}\n\nconst res = findNodeById(tree, 3);\n// res 的结果为\n// {\n// name: \"数据3\",\n// id: 3,\n// children: [\n// {\n// name: \"数据4\",\n// id: 4,\n// children: [],\n// },\n// ],\n// }\n```\n\n**实现**\n\n```js\nfunction findNodeById(tree, id) {\n if (!tree.length) return null; // 如果树是空的，则返回 null\n\n const search = (node) => {\n if (node.id === id) {\n // 如果找到一个匹配的节点，返回它\n return node;\n } else if (node.children) {\n // 否则，如果它有子节点，递归地搜索子节点\n for (const child of node.children) {\n const result = search(child);\n if (result) {\n return result; // 如果递归找到了一个匹配的节点，返回它\n }\n }\n }\n return null; // 如果什么都没找到，返回 null\n };\n\n for (const root of tree) {\n const result = search(root);\n if (result) {\n return result; // 如果在根节点中找到了一个匹配的节点，返回它\n }\n }\n\n // 如果循环遍历整个树完成后没有找到，返回 null\n return null;\n}\n\n// 使用\nconst foundNode = findNodeById(tree, 3);\nconsole.log(foundNode); // 将打印出 id 为 3 的节点\n```\n",{"_58":465,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/723/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/723/timeline",{"_58":468,"_60":61,"_62":469,"_64":470,"_66":471,"_68":472,"_70":473,"_72":474,"_74":475,"_76":476,"_78":477,"_111":478,"_124":125,"_126":24,"_127":-5,"_128":485,"_130":486,"_152":145,"_146":488,"_148":489,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":490,"_162":491,"_168":492,"_170":493,"_182":495,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/644","https://api.github.com/repos/pro-collection/interview-question/issues/644/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/644/comments","https://api.github.com/repos/pro-collection/interview-question/issues/644/events","https://github.com/pro-collection/interview-question/issues/644",2010952234,"I_kwDOJGDC6c533LIq",644,"封装一个请求超时，发起重试的代码【热度: 789】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[479,484],{"_70":480,"_72":481,"_58":482,"_117":483,"_119":401,"_121":24,"_122":402},5562711972,"LA_kwDOJGDC6c8AAAABS5A_pA","https://api.github.com/repos/pro-collection/interview-question/labels/Shopee","Shopee",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":210,"_68":211,"_62":212,"_70":213,"_72":214,"_74":215,"_76":216,"_122":217,"_140":487,"_142":219,"_144":145,"_124":125,"_146":220,"_148":221,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-11-26T08:33:08Z","2023-11-26T08:33:09Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：请求重试\n\n看过很多请求超时重试的样例，很多都是基于 axios interceptors 实现的。但是有没有牛逼的原生方式实现呢？\n\n最近在看 fbjs 库里面的代码，发现里面有一个超时重试的代码，只有一百多行代码，封装的极其牛逼。\n\n不过这里的代码是 Flow 类型检测的代码，而且有一些外部小依赖，之后要翻译成 ts 代码。\n\n**这里简单介绍一下 fbjs 这个库**\n\n> fbjs（Facebook JavaScript）是一个由 Facebook 开发和维护的 JavaScript 工具库。它提供了一组通用的 JavaScript 功能和实用工具，用于辅助开发大型、高性能的 JavaScript 应用程序。\n\n说到这儿了，直接上完整代码\n\n```ts\ninterface InitWithRetries extends RequestInit {\n fetchTimeout?: number | null;\n retryDelays?: number[] | null;\n}\n\nconst DEFAULT_TIMEOUT = 1000 * 1.5;\nconst DEFAULT_RETRIES = [0, 0];\n\nconst fetchWithRetries = (url: string, initWithRetries?: InitWithRetries): Promise => {\n // fetchTimeout 请求超时时间\n // 请求\n const { fetchTimeout, retryDelays, ...init } = initWithRetries || {};\n\n // 超时时间\n const _fetchTimeout = fetchTimeout != null ? fetchTimeout : DEFAULT_TIMEOUT;\n\n // 重复时间数组\n const _retryDelays = retryDelays != null ? retryDelays : DEFAULT_RETRIES;\n\n // 开始时间\n let requestStartTime = 0;\n\n // 重试请求索引\n let requestsAttempted = 0;\n\n return new Promise((resolve, reject) => {\n // 申明发送请求方法\n const sendTimedRequest = (): void => {\n // 自增索引与请求次数\n requestsAttempted++;\n\n // 发起请求时间\n requestStartTime = Date.now();\n\n // 是否需要处理后续请求\n let isRequestAlive = true;\n\n // 发起请求\n const request = fetch(url, init);\n\n // 请求超时情况\n const requestTimeout = setTimeout(() => {\n // 需要阻断正常的请求返回\n isRequestAlive = false;\n\n // 需要重新发起请求\n if (shouldRetry(requestsAttempted)) {\n console.warn(\"fetchWithRetries: HTTP timeout, retrying.\");\n retryRequest();\n } else {\n reject(new Error(\n `fetchWithRetries(): Failed to get response from server, tried ${requestsAttempted} times.`,\n ));\n }\n }, _fetchTimeout);\n\n // 正常请求发起\n request.then(response => {\n // 正常请求返回的场景，清空定时器\n clearTimeout(requestTimeout);\n\n // 如果进入了超时流程，那么正常返回的逻辑，就直接阻断\n if (isRequestAlive) {\n if (response.status >= 200 && response.status < 300) {\n resolve(response);\n } else if (shouldRetry(requestsAttempted)) {\n console.warn(\"fetchWithRetries: HTTP error, retrying.\");\n retryRequest();\n } else {\n const error: any = new Error(`response error.`);\n error.response = response;\n reject(error);\n }\n }\n }).catch(error => {\n clearTimeout(requestTimeout);\n if (shouldRetry(requestsAttempted)) {\n retryRequest();\n } else {\n reject(error);\n }\n });\n };\n\n // 发起重复请求\n const retryRequest = (): void => {\n // 重复请求 delay 时间\n const retryDelay = _retryDelays[requestsAttempted - 1];\n\n // 重复请求开始时间\n const retryStartTime = requestStartTime + retryDelay;\n\n // 延迟时间\n const timeout = retryStartTime - Date.now() > 0 ? retryStartTime - Date.now() : 0;\n\n // 重复请求\n setTimeout(sendTimedRequest, timeout);\n };\n\n // 是否可以发起重复请求\n const shouldRetry = (attempt: number): boolean => attempt <= _retryDelays.length;\n\n sendTimedRequest();\n });\n};\n\nfetchWithRetries(\"http://127.0.0.1:3000/user/\")\n```\n",{"_58":494,"_173":187,"_174":187,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/644/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/644/timeline",{"_58":497,"_60":61,"_62":498,"_64":499,"_66":500,"_68":501,"_70":502,"_72":503,"_74":504,"_76":505,"_78":506,"_111":507,"_124":125,"_126":24,"_127":-5,"_128":514,"_130":515,"_152":145,"_146":517,"_148":518,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":519,"_162":520,"_168":521,"_170":522,"_182":524,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/601","https://api.github.com/repos/pro-collection/interview-question/issues/601/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/601/comments","https://api.github.com/repos/pro-collection/interview-question/issues/601/events","https://github.com/pro-collection/interview-question/issues/601",1955517666,"I_kwDOJGDC6c50jtTi",601,"[代码实现] 手写数组降维flat方法【热度: 244】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[508,513],{"_70":509,"_72":510,"_58":511,"_117":512,"_119":401,"_121":24,"_122":402},5312231007,"LA_kwDOJGDC6c8AAAABPKI2Xw","https://api.github.com/repos/pro-collection/interview-question/labels/%E9%98%BF%E9%87%8C%E5%B7%B4%E5%B7%B4","阿里巴巴",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":516,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-10-21T14:35:10Z","2023-10-21T14:35:26Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：JS数组降维、reduce数组降维\n\n原生Array.prototype.flat方法接受一个depth参数，默认值为1，depth表示要降维的维数：\n\n输出结果：\n\n```js\nconst arr = [1, [2, 3], [4, [5, 6]]]\nconsole.log(arr.flat(1)) // [1, 2, 3, 4, [5, 6]]\nconsole.log(arr.flat(Infinity)) // [1, 2, 3, 4, 5, 6]\n```\n\nreduce + 递归实现方案\n\n```js\n// MDN: 可查看更多flat实现方法\nfunction flat(arr = [], depth = 1) {\n if (arr.length === 0) {\n return []\n }\n let result = []\n if (depth > 0) {\n result = arr.reduce((acc, val) => {\n return acc.concat(Array.isArray(val) ? flat(val, depth - 1) : val)\n }, [])\n } else {\n result = arr.slice()\n }\n return result\n}\n\nconst arr = [1, 2, 3, [1, 2, 3, 4, [2, 3, 4]]]\nconst myResult1 = flat(arr, 1)\nconst originResult1 = arr.flat(1)\nconst myResult2 = flat(arr, Infinity)\nconst originResult2 = arr.flat(Infinity)\nconsole.log(myResult1) // [1, 2, 3, 1, 2, 3, 4, [2, 3, 4]]\nconsole.log(originResult1) // [1, 2, 3, 1, 2, 3, 4, [2, 3, 4]]\nconsole.log(myResult2) // [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]\nconsole.log(originResult2) // [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]\n```\n\n",{"_58":523,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/601/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/601/timeline",{"_58":526,"_60":61,"_62":527,"_64":528,"_66":529,"_68":530,"_70":531,"_72":532,"_74":533,"_76":534,"_78":535,"_111":536,"_124":125,"_126":24,"_127":-5,"_128":539,"_130":540,"_152":145,"_146":542,"_148":543,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":544,"_162":545,"_168":546,"_170":547,"_182":549,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/600","https://api.github.com/repos/pro-collection/interview-question/issues/600/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/600/comments","https://api.github.com/repos/pro-collection/interview-question/issues/600/events","https://github.com/pro-collection/interview-question/issues/600",1955506343,"I_kwDOJGDC6c50jqin",600,"[代码实现] 手写 dom 分段渲染【热度: 280】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[537,538],{"_70":509,"_72":510,"_58":511,"_117":512,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":541,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-10-21T14:05:34Z","2023-10-21T14:06:42Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：dom 分段渲染\n\n分时函数案例：把1秒创建1000个DOM节点，改成每隔200毫秒创建10个节点，这样不用短时间在页面中创建大量的DOM。\n\n```jsx\nvar timeChunk = function(arr,fn,count,interval) {\n var timer = null;\n var data = null;\n var start = function() {\n for(var i = 0 ; i < Math.min(count || 1 , arr.length) ; i++) {\n fn(arr.shift());\n }\n }\n return function() {\n timer = setInterval(function(){\n if(arr.length == 0) {\n clearInterval(timer);\n timer = null;\n return;\n }\n start();\n }, interval || 200)\n }\n}\n\nvar arr = [];\nfor(var i = 0 ; i < 1000 ; i++) {\n arr.push(i);\n}\n\nvar renderDOMList = timeChunk(arr, function(data) {\n var div = document.createElement('div');\n div.innerHTML = data;\n document.body.appendChild(div);\n},10,200);\nrenderDOMList();\n```\n",{"_58":548,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/600/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/600/timeline",{"_58":551,"_60":61,"_62":552,"_64":553,"_66":554,"_68":555,"_70":556,"_72":557,"_74":558,"_76":559,"_78":560,"_111":561,"_124":125,"_126":24,"_127":-5,"_128":568,"_130":569,"_152":145,"_146":571,"_148":572,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":573,"_162":574,"_168":575,"_170":576,"_182":578,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/599","https://api.github.com/repos/pro-collection/interview-question/issues/599/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/599/comments","https://api.github.com/repos/pro-collection/interview-question/issues/599/events","https://github.com/pro-collection/interview-question/issues/599",1955497329,"I_kwDOJGDC6c50joVx",599,"[代码实现] 不使用 setTimeout 来实现 setInterval【热度: 231】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[562,567],{"_70":563,"_72":564,"_58":565,"_117":566,"_119":401,"_121":24,"_122":402},5312726360,"LA_kwDOJGDC6c8AAAABPKnFWA","https://api.github.com/repos/pro-collection/interview-question/labels/%E8%85%BE%E8%AE%AF","腾讯",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":570,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-10-21T13:40:53Z","2023-10-21T14:06:25Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：实现setInterval、requestAnimationFrame实现setInterval、setTimeout实现setInterval\n\n如果不使用 `setTimeout` 来实现 `setInterval`，可以使用 `requestAnimationFrame` 函数和时间戳来实现定时循环。下面是实现的代码示例：\n\n**实现方式1**\n\n```javascript\nfunction mySetInterval(callback, interval) {\n let startTime = Date.now();\n let elapsedTime = 0;\n\n function loop() {\n const currentTime = Date.now();\n const deltaTime = currentTime - startTime;\n\n if (deltaTime >= interval) {\n callback();\n startTime = currentTime;\n }\n\n requestAnimationFrame(loop);\n }\n\n requestAnimationFrame(loop);\n\n return {\n clear: function() {\n startTime = 0;\n elapsedTime = 0;\n }\n };\n}\n```\n\n这个实现中，我们通过 `requestAnimationFrame` 函数来循环执行 `loop` 函数。在 `loop` 函数中，我们获取当前时间戳 `currentTime`，并计算与上一次执行的时间间隔 `deltaTime`\n。如果 `deltaTime` 大于等于指定的间隔时间 `interval`，则执行回调函数 `callback`，并更新 `startTime` 为当前时间，以便下一次判断。\n\n最后，返回一个具有 `clear` 方法的对象，用于清除定时器。调用 `clear` 方法时，将 `startTime` 和 `elapsedTime` 重置为初始值。\n\n**实现方式2**\n\n```js\nconst obj = {\n timer: null,\n setInterval: function(callback, interval) {\n const now = Date.now\n let startTime = now()\n let endTime = startTime\n const self = this\n const loop = function() {\n self.timer = requestAnimationFrame(loop)\n endTime = now()\n if (endTime - startTime >= interval) {\n startTime = endTime = now()\n callback && callback()\n }\n }\n this.timer = requestAnimationFrame(loop)\n return this.timer\n },\n clearInterval: function() {\n cancelAnimationFrame(this.timer)\n }\n}\n\nlet count = 0\nconst timer = obj.setInterval(() => {\n console.log('interval...')\n count++\n if (count >= 3) {\n obj.clearInterval()\n }\n}, 500)\n```\n\n**实现方式3**\n\n使用 `setTimeout` 来实现\n\n```ts\n/**\n * setTimeout 版本\n */\nfunction _setIntervalUseTimeout(\n fn: () => void,\n millisec: number,\n count?: number\n) {\n let timer: number;\n function interval() {\n if (typeof count === 'undefined' || count-- > 0) {\n timer = setTimeout(interval, millisec);\n try {\n fn();\n } catch (e: any) {\n count = 0;\n throw e.toString();\n }\n }\n }\n timer = setTimeout(interval, millisec);\n return {\n clear: () => clearTimeout(timer),\n };\n}\n```\n",{"_58":577,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/599/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/599/timeline",{"_58":580,"_60":61,"_62":581,"_64":582,"_66":583,"_68":584,"_70":585,"_72":586,"_74":587,"_76":588,"_78":589,"_111":590,"_124":125,"_126":24,"_127":-5,"_128":597,"_130":598,"_152":145,"_146":600,"_148":600,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":601,"_162":602,"_168":603,"_170":604,"_182":606,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/568","https://api.github.com/repos/pro-collection/interview-question/issues/568/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/568/comments","https://api.github.com/repos/pro-collection/interview-question/issues/568/events","https://github.com/pro-collection/interview-question/issues/568",1910291617,"I_kwDOJGDC6c5x3Lyh",568,"实现日期格式化 format 函数【热度: 489】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[591,596],{"_70":592,"_72":593,"_58":594,"_117":595,"_119":401,"_121":24,"_122":402},5312214934,"LA_kwDOJGDC6c8AAAABPKH3lg","https://api.github.com/repos/pro-collection/interview-question/labels/%E7%BD%91%E6%98%93","网易",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":599,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-09-24T16:14:06Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：日期format函数、日期format实现\n\n**问题**\n```ts\n// js 实现日期的 format 函数\n//\n// YYYY 对应年\n// MM 对应月\n// DD 对应日\n//\n// HH 对应 24 小时制度\n// hh 对应 12 小时制度\n// mm 对应分钟\n// ss 对应秒\n\nconst date = new Date();\nconst formattedDate = date.format('YYYY-MM-DD HH:mm:ss');\nconsole.log(formattedDate); // 输出结果为当前日期和时间的格式化字符串\n```\n\n\n**解答**\n以下是使用JavaScript实现日期格式化的`format`函数：\n\n```javascript\nDate.prototype.format = function (format) {\n const date = this;\n\n const year = date.getFullYear();\n const month = date.getMonth() + 1;\n const day = date.getDate();\n const hours = date.getHours();\n const minutes = date.getMinutes();\n const seconds = date.getSeconds();\n\n format = format.replace('YYYY', year);\n format = format.replace('MM', month.toString().padStart(2, '0'));\n format = format.replace('DD', day.toString().padStart(2, '0'));\n format = format.replace('HH', hours.toString().padStart(2, '0'));\n format = format.replace('hh', (hours % 12).toString().padStart(2, '0'));\n format = format.replace('mm', minutes.toString().padStart(2, '0'));\n format = format.replace('ss', seconds.toString().padStart(2, '0'));\n\n return format;\n};\n\n// 示例用法\nconst date = new Date();\nconst formattedDate = date.format('YYYY-MM-DD HH:mm:ss');\nconsole.log(formattedDate); // 输出结果为当前日期和时间的格式化字符串\n```\n\n上述代码中，我们通过在`Date`对象的原型上定义`format`函数，使得所有的`Date`对象都可以调用`format`函数进行日期格式化。在函数内部，我们使用`getFullYear`、`getMonth`、`getDate`等方法获取日期的年、月、日、时、分、秒的值，并将其替换到传入的`format`字符串中对应的占位符。最后返回格式化后的字符串。\n",{"_58":605,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/568/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/568/timeline",{"_58":608,"_60":61,"_62":609,"_64":610,"_66":611,"_68":612,"_70":613,"_72":614,"_74":615,"_76":616,"_78":617,"_111":618,"_124":125,"_126":24,"_127":-5,"_128":621,"_130":622,"_152":145,"_146":624,"_148":624,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":625,"_162":626,"_168":627,"_170":628,"_182":630,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/567","https://api.github.com/repos/pro-collection/interview-question/issues/567/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/567/comments","https://api.github.com/repos/pro-collection/interview-question/issues/567/events","https://github.com/pro-collection/interview-question/issues/567",1910290192,"I_kwDOJGDC6c5x3LcQ",567,"实现一个函数，计算两个日期之间的天数差",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[619,620],{"_70":592,"_72":593,"_58":594,"_117":595,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":270,"_68":271,"_62":272,"_70":273,"_72":274,"_74":187,"_76":275,"_122":276,"_140":623,"_142":278,"_144":145,"_124":125,"_146":279,"_148":280,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-09-24T16:09:44Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"以下是使用JavaScript实现计算两个日期之间的天数差的函数：\n\n```javascript\nfunction calculateDateDifference(date1, date2) {\n // 将日期字符串转换为 Date 对象\n const d1 = new Date(date1);\n const d2 = new Date(date2);\n\n // 计算两个日期的时间差（毫秒数）\n const timeDiff = Math.abs(d2.getTime() - d1.getTime());\n\n // 将时间差转换为天数\n const daysDiff = Math.ceil(timeDiff / (1000 * 3600 * 24));\n\n return daysDiff;\n}\n\n// 示例用法\nconst date1 = '2022-01-01';\nconst date2 = '2022-01-10';\n\nconst difference = calculateDateDifference(date1, date2);\nconsole.log(difference); // 输出结果为 9\n```\n\n上述函数首先将两个日期字符串转换为Date对象，然后计算两个日期对象之间的时间差（以毫秒表示），最后将时间差转换为天数。通过调用`calculateDateDifference`函数，可以获取两个日期之间的天数差。\n",{"_58":629,"_173":187,"_174":187,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/567/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/567/timeline",{"_58":632,"_60":61,"_62":633,"_64":634,"_66":635,"_68":636,"_70":637,"_72":638,"_74":639,"_76":640,"_78":641,"_111":642,"_124":125,"_126":24,"_127":-5,"_128":645,"_130":646,"_152":648,"_146":649,"_148":650,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":651,"_162":652,"_168":653,"_170":654,"_182":656,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/551","https://api.github.com/repos/pro-collection/interview-question/issues/551/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/551/comments","https://api.github.com/repos/pro-collection/interview-question/issues/551/events","https://github.com/pro-collection/interview-question/issues/551",1884318813,"I_kwDOJGDC6c5wUGxd",551,"[代码实现] JS 中数组深对比实现【热度: 985】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[643,644],{"_70":592,"_72":593,"_58":594,"_117":595,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":647,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},6,"2023-09-06T16:00:24Z","2024-08-01T12:15:28Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：JS数组对比\r\n\r\n在JavaScript中，可以使用递归的方式实现数组的深度对比。以下是一个示例函数，用于比较两个数组是否相等：\r\n\r\n```javascript\r\n// 判断对象是否相同\r\nfunction deepEqual(obj1, obj2) {\r\n // 检查类型是否相同\r\n if (typeof obj1 !== typeof obj2) {\r\n return false;\r\n }\r\n \r\n // 检查是否是对象或数组\r\n if (typeof obj1 === 'object' && obj1 !== null && obj2 !== null) {\r\n // 检查对象或数组长度是否相同\r\n if (Object.keys(obj1).length !== Object.keys(obj2).length) {\r\n return false;\r\n }\r\n \r\n for (let key in obj1) {\r\n // 递归比较每个属性的值\r\n if (!deepEqual(obj1[key], obj2[key])) {\r\n return false;\r\n }\r\n }\r\n \r\n return true;\r\n }\r\n \r\n // 比较基本类型的值\r\n return obj1 === obj2;\r\n}\r\n\r\nfunction deepArrayEqual(arr1, arr2) {\r\n // 检查数组长度是否相同\r\n if (arr1.length !== arr2.length) {\r\n return false;\r\n }\r\n \r\n for (let i = 0; i < arr1.length; i++) {\r\n const value1 = arr1[i];\r\n const value2 = arr2[i];\r\n \r\n // 递归比较每个元素的值\r\n if (Array.isArray(value1) && Array.isArray(value2)) {\r\n if (!deepArrayEqual(value1, value2)) {\r\n return false;\r\n }\r\n } else if (typeof value1 === 'object' && typeof value2 === 'object') {\r\n if (!deepEqual(value1, value2)) {\r\n return false;\r\n }\r\n } else {\r\n // 比较基本类型的值\r\n if (value1 !== value2) {\r\n return false;\r\n }\r\n }\r\n }\r\n \r\n return true;\r\n}\r\n```\r\n\r\n使用示例：\r\n\r\n```javascript\r\nconst arr1 = [1, [2, 3], { name: 'John' }];\r\nconst arr2 = [1, [2, 3], { name: 'John' }];\r\nconst arr3 = [1, [2, 3], { name: 'Jane' }];\r\n\r\nconsole.log(deepArrayEqual(arr1, arr2)); // true\r\nconsole.log(deepArrayEqual(arr1, arr3)); // false\r\n```\r\n\r\n在上述示例中，`deepArrayEqual`函数会递归比较两个数组的每个元素的值，包括嵌套的数组和对象。如果两个数组是相等的，则返回`true`，否则返回`false`。注意，该函数不会检查函数、正则表达式、日期等复杂类型的值。\r\n",{"_58":655,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/551/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/551/timeline",{"_58":658,"_60":61,"_62":659,"_64":660,"_66":661,"_68":662,"_70":663,"_72":664,"_74":665,"_76":666,"_78":667,"_111":668,"_124":125,"_126":24,"_127":-5,"_128":671,"_130":672,"_152":145,"_146":674,"_148":675,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":676,"_162":677,"_168":678,"_170":679,"_182":681,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/550","https://api.github.com/repos/pro-collection/interview-question/issues/550/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/550/comments","https://api.github.com/repos/pro-collection/interview-question/issues/550/events","https://github.com/pro-collection/interview-question/issues/550",1884284920,"I_kwDOJGDC6c5wT-f4",550,"[代码实现] JS 中如何实现大对象深度对比【热度: 906】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[669,670],{"_70":427,"_72":428,"_58":429,"_117":430,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":673,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-09-06T15:39:53Z","2023-09-06T15:51:26Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：JS对象对比\n\n在JavaScript中，可以使用递归的方式实现大对象的深度对比。以下是一个示例函数，用于比较两个大对象的每个属性是否相等：\n\n```javascript\nfunction deepEqual(obj1, obj2) {\n // 检查类型是否相同\n if (typeof obj1 !== typeof obj2) {\n return false;\n }\n \n // 检查是否是对象或数组\n if (typeof obj1 === 'object' && obj1 !== null && obj2 !== null) {\n // 检查对象或数组长度是否相同\n if (Object.keys(obj1).length !== Object.keys(obj2).length) {\n return false;\n }\n \n for (let key in obj1) {\n // 递归比较每个属性的值\n if (!deepEqual(obj1[key], obj2[key])) {\n return false;\n }\n }\n \n return true;\n }\n \n // 比较基本类型的值\n return obj1 === obj2;\n}\n```\n\n使用示例：\n\n```javascript\nconst obj1 = {\n name: 'John',\n age: 30,\n address: {\n street: '123 Main St',\n city: 'New York'\n }\n};\n\nconst obj2 = {\n name: 'John',\n age: 30,\n address: {\n street: '123 Main St',\n city: 'New York'\n }\n};\n\nconst obj3 = {\n name: 'Jane',\n age: 25,\n address: {\n street: '456 Park Ave',\n city: 'Los Angeles'\n }\n};\n\nconsole.log(deepEqual(obj1, obj2)); // true\nconsole.log(deepEqual(obj1, obj3)); // false\n```\n\n在上述示例中，`deepEqual`函数会递归比较两个对象的每个属性的值，包括嵌套的对象或数组。如果两个对象是相等的，则返回`true`，否则返回`false`。注意，该函数不会检查函数、正则表达式、日期等复杂类型的值。\n",{"_58":680,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/550/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/550/timeline",{"_58":683,"_60":61,"_62":684,"_64":685,"_66":686,"_68":687,"_70":688,"_72":689,"_74":690,"_76":691,"_78":692,"_111":693,"_124":125,"_126":24,"_127":-5,"_128":696,"_130":697,"_152":145,"_146":699,"_148":700,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":701,"_162":702,"_168":703,"_170":704,"_182":706,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/521","https://api.github.com/repos/pro-collection/interview-question/issues/521/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/521/comments","https://api.github.com/repos/pro-collection/interview-question/issues/521/events","https://github.com/pro-collection/interview-question/issues/521",1858148109,"I_kwDOJGDC6c5uwRcN",521,"[代码实现] 实现一个可以用for...of遍历的对象【热度: 653】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[694,695],{"_70":563,"_72":564,"_58":565,"_117":566,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":698,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-08-20T14:41:49Z","2023-09-06T15:51:38Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：for...in遍历、for...of遍历\n\n普通对象因为没有迭代器，所以无法使用for...of遍历，一般使用for...in或者Object.keys()来遍历\n\n但是如果我们手动给对象设置一个迭代器，对象也是可以使用for...of来遍历的;\n\n```js\nvar obj = {\n a:1,\n b:2,\n c:3\n}\n\nobj.__proto__[Symbol.iterator] = function* objectIterator() {\n for (let key in this) {\n if (obj.hasOwnProperty(key)) {\n yield [key, this[key]]\n }\n }\n}\n\nfor(let v of obj){\n console.log(v);\n}\n//['a',1]\n//['b',2]\n//['c',3]\n```\n",{"_58":705,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/521/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/521/timeline",{"_58":708,"_60":61,"_62":709,"_64":710,"_66":711,"_68":712,"_70":713,"_72":714,"_74":715,"_76":716,"_78":717,"_111":718,"_124":125,"_126":24,"_127":-5,"_128":720,"_130":721,"_152":145,"_146":723,"_148":724,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":725,"_162":726,"_168":727,"_170":728,"_182":730,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/500","https://api.github.com/repos/pro-collection/interview-question/issues/500/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/500/comments","https://api.github.com/repos/pro-collection/interview-question/issues/500/events","https://github.com/pro-collection/interview-question/issues/500",1824478586,"I_kwDOJGDC6c5sv1V6",500,"[代码实现] 根据 path 来解析数组，生成多维度的数组对象",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[719],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":722,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-07-27T14:18:05Z","2023-09-06T15:51:41Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"请手写一个函数，将下面的树形结构，进行转换：\r\n\r\n输入数据结构\r\n```js\r\nconst data = [\r\n { id: 0, label: '测试 - 0', path: 'demo.info' },\r\n { id: 1, label: '测试 - 1', path: 'demo.info' },\r\n { id: 2, label: '测试 - 2', path: 'common.base' },\r\n { id: 3, label: '测试 - 3', path: 'common.base' },\r\n { id: 4, label: '测试 - 4', path: 'demo.info' },\r\n { id: 5, label: '测试 - 5', path: 'demo.info' },\r\n { id: 6, label: '测试 - 6', path: 'common' },\r\n { id: 7, label: '测试 - 7', path: 'common' },\r\n { id: 8, label: '测试 - 8', path: 'common.address' },\r\n { id: 9, label: '测试 - 9', path: 'common.address' },\r\n { id: 10, label: '测试 - 10', path: 'demo.info' },\r\n { id: 11, label: '测试 - 11', path: 'demo.sence' },\r\n { id: 12, label: '测试 - 12', path: 'demo.sence' },\r\n { id: 13, label: '测试 - 13', path: 'demo.hash' },\r\n { id: 14, label: '测试 - 14', path: 'demo.hash' },\r\n { id: 15, label: '测试 - 15', path: 'demo.hash' },\r\n { id: 16, label: '测试 - 16', path: 'demo' },\r\n { id: 17, label: '测试 - 17', path: 'demo' },\r\n { id: 18, label: '测试 - 18', path: 'demo.info' },\r\n { id: 19, label: '测试 - 19', path: 'demo.info' }\r\n];\r\n```\r\n\r\n输出数据结构\r\n```json\r\n[\r\n {\r\n \"value\": \"demo\",\r\n \"label\": \"Demo\",\r\n \"children\": [\r\n {\r\n \"value\": \"info\",\r\n \"label\": \"Info\",\r\n \"children\": [\r\n {\r\n \"value\": 0,\r\n \"label\": \"测试 - 0\"\r\n },\r\n {\r\n \"value\": 1,\r\n \"label\": \"测试 - 1\"\r\n },\r\n {\r\n \"value\": 4,\r\n \"label\": \"测试 - 4\"\r\n },\r\n {\r\n \"value\": 5,\r\n \"label\": \"测试 - 5\"\r\n },\r\n {\r\n \"value\": 10,\r\n \"label\": \"测试 - 10\"\r\n },\r\n {\r\n \"value\": 18,\r\n \"label\": \"测试 - 18\"\r\n },\r\n {\r\n \"value\": 19,\r\n \"label\": \"测试 - 19\"\r\n }\r\n ]\r\n },\r\n {\r\n \"value\": \"sence\",\r\n \"label\": \"Sence\",\r\n \"children\": [\r\n {\r\n \"value\": 11,\r\n \"label\": \"测试 - 11\"\r\n },\r\n {\r\n \"value\": 12,\r\n \"label\": \"测试 - 12\"\r\n }\r\n ]\r\n },\r\n {\r\n \"value\": \"hash\",\r\n \"label\": \"Hash\",\r\n \"children\": [\r\n {\r\n \"value\": 13,\r\n \"label\": \"测试 - 13\"\r\n },\r\n {\r\n \"value\": 14,\r\n \"label\": \"测试 - 14\"\r\n },\r\n {\r\n \"value\": 15,\r\n \"label\": \"测试 - 15\"\r\n }\r\n ]\r\n },\r\n {\r\n \"value\": 16,\r\n \"label\": \"测试 - 16\"\r\n },\r\n {\r\n \"value\": 17,\r\n \"label\": \"测试 - 17\"\r\n }\r\n ]\r\n },\r\n {\r\n \"value\": \"common\",\r\n \"label\": \"Common\",\r\n \"children\": [\r\n {\r\n \"value\": \"base\",\r\n \"label\": \"Base\",\r\n \"children\": [\r\n {\r\n \"value\": 2,\r\n \"label\": \"测试 - 2\"\r\n },\r\n {\r\n \"value\": 3,\r\n \"label\": \"测试 - 3\"\r\n }\r\n ]\r\n },\r\n {\r\n \"value\": 6,\r\n \"label\": \"测试 - 6\"\r\n },\r\n {\r\n \"value\": 7,\r\n \"label\": \"测试 - 7\"\r\n },\r\n {\r\n \"value\": \"address\",\r\n \"label\": \"Address\",\r\n \"children\": [\r\n {\r\n \"value\": 8,\r\n \"label\": \"测试 - 8\"\r\n },\r\n {\r\n \"value\": 9,\r\n \"label\": \"测试 - 9\"\r\n }\r\n ]\r\n }\r\n ]\r\n }\r\n]\r\n```\r\n\r\n**实现如下**：\r\n```js\r\nfunction convertToThreeDimensionalArray(data) {\r\n const result = [];\r\n\r\n // Create a map to store the path hierarchy\r\n const pathMap = new Map();\r\n\r\n // Iterate through the data\r\n for (let i = 0; i < data.length; i++) {\r\n const item = data[i];\r\n const pathArr = item.path.split('.'); // Split the path into an array of sub-paths\r\n\r\n let parent = result;\r\n for (let j = 0; j < pathArr.length; j++) {\r\n const subPath = pathArr[j];\r\n\r\n // Check if the subPath exists in the parent\r\n let child = parent.find(obj => obj.value === subPath);\r\n\r\n if (!child) {\r\n // Create a new child object\r\n child = {\r\n value: subPath,\r\n label: capitalizeFirstLetter(subPath),\r\n children: [],\r\n };\r\n\r\n // Add the child object to the parent\r\n parent.push(child);\r\n }\r\n\r\n // Update the parent to be the child's children array\r\n parent = child.children;\r\n }\r\n\r\n // Add the item to the final child array\r\n parent.push({\r\n value: item.id,\r\n label: item.label,\r\n });\r\n }\r\n\r\n return result;\r\n}\r\n\r\nfunction capitalizeFirstLetter(string) {\r\n return string.charAt(0).toUpperCase() + string.slice(1);\r\n}\r\n\r\nconst threeDimensionalArray = convertToThreeDimensionalArray(data);\r\nconsole.log(threeDimensionalArray);\r\n````",{"_58":729,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/500/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/500/timeline",{"_58":732,"_60":61,"_62":733,"_64":734,"_66":735,"_68":736,"_70":737,"_72":738,"_74":739,"_76":740,"_78":741,"_111":742,"_124":125,"_126":24,"_127":-5,"_128":745,"_130":746,"_152":145,"_146":748,"_148":749,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":750,"_162":751,"_168":752,"_170":753,"_182":755,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/492","https://api.github.com/repos/pro-collection/interview-question/issues/492/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/492/comments","https://api.github.com/repos/pro-collection/interview-question/issues/492/events","https://github.com/pro-collection/interview-question/issues/492",1822652943,"I_kwDOJGDC6c5so3oP",492,"[代码实现] 实现管道函数【热度: 540】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[743,744],{"_70":480,"_72":481,"_58":482,"_117":483,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":747,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-07-26T15:22:44Z","2023-09-06T15:51:44Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：JS 管道函数、JS 管道函数实现\n\n管道函数是一种函数编程的概念，它可以将多个函数串联起来，将前一个函数的输出作为后一个函数的输入。以下是一个简单的实现示例：\n\n```javascript\n// 简化版的管道函数实现\nfunction pipe(...fns) {\n return function(input) {\n return fns.reduce((output, fn) => fn(output), input);\n };\n}\n\n// 示例函数\nfunction addOne(num) {\n return num + 1;\n}\n\nfunction double(num) {\n return num * 2;\n}\n\nfunction square(num) {\n return num ** 2;\n}\n\n// 创建一个管道函数\nconst myPipe = pipe(addOne, double, square);\n\n// 使用管道函数进行计算\nconst result = myPipe(2); // 2 -> addOne -> 3 -> double -> 6 -> square -> 36\n\nconsole.log(result); // 输出 36\n```\n\n在上述示例中，我们首先定义了三个简单的示例函数：addOne、double和square。然后，通过调用pipe函数，将这三个函数串联起来创建了一个管道函数myPipe。最后，我们可以通过调用myPipe函数并传入初始值2，得到最终的计算结果36。\n\n在管道函数的实现中，使用了ES6的扩展运算符（...）和Array的reduce方法。reduce方法接受一个累加器函数和初始值，并将累加器函数应用于数组的每个元素，返回最终的累积结果。在这里，累加器函数将前一个函数的输出作为后一个函数的输入，从而实现了函数的串联。\n",{"_58":754,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/492/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/492/timeline",{"_58":757,"_60":61,"_62":758,"_64":759,"_66":760,"_68":761,"_70":762,"_72":763,"_74":764,"_76":765,"_78":766,"_111":767,"_124":125,"_126":24,"_127":-5,"_128":774,"_130":775,"_152":145,"_146":777,"_148":778,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":779,"_162":780,"_168":781,"_170":782,"_182":784,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/461","https://api.github.com/repos/pro-collection/interview-question/issues/461/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/461/comments","https://api.github.com/repos/pro-collection/interview-question/issues/461/events","https://github.com/pro-collection/interview-question/issues/461",1757137572,"I_kwDOJGDC6c5ou8qk",461,"[代码实现] 实现数组的flat方法，支持深度层级参数",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[768,773],{"_70":769,"_72":770,"_58":771,"_117":772,"_119":401,"_121":24,"_122":402},5316900032,"LA_kwDOJGDC6c8AAAABPOl0wA","https://api.github.com/repos/pro-collection/interview-question/labels/%E4%BA%AC%E4%B8%9C","京东",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":776,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-06-14T15:13:38Z","2023-09-06T15:52:11Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"可以通过传入一个深度参数来限制 flat 方法的递归深度。实现如下：\n\n```\nfunction flat(arr, depth = 1) {\n let res = [];\n for (let i = 0; i < arr.length; i++) {\n if (Array.isArray(arr[i]) && depth > 0) {\n res = res.concat(flat(arr[i], depth - 1));\n } else {\n res.push(arr[i]);\n }\n }\n return res;\n}\n```\n\n这里在原有的 flat 方法基础上增加了一个 depth 参数，每递归一层，深度就减一，当深度为 0 时就不再递归。\n",{"_58":783,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/461/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/461/timeline",{"_58":786,"_60":61,"_62":787,"_64":788,"_66":789,"_68":790,"_70":791,"_72":792,"_74":793,"_76":794,"_78":795,"_111":796,"_124":125,"_126":24,"_127":-5,"_128":803,"_130":804,"_152":145,"_146":806,"_148":807,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":808,"_162":809,"_168":810,"_170":811,"_182":813,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/460","https://api.github.com/repos/pro-collection/interview-question/issues/460/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/460/comments","https://api.github.com/repos/pro-collection/interview-question/issues/460/events","https://github.com/pro-collection/interview-question/issues/460",1755257972,"I_kwDOJGDC6c5onxx0",460,"[代码实现] 手写实现 instanceof【热度: 535】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[797,802],{"_70":798,"_72":799,"_58":800,"_117":801,"_119":401,"_121":24,"_122":402},5597035813,"LA_kwDOJGDC6c8AAAABTZv9JQ","https://api.github.com/repos/pro-collection/interview-question/labels/PDD","PDD",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":270,"_68":271,"_62":272,"_70":273,"_72":274,"_74":187,"_76":275,"_122":276,"_140":805,"_142":278,"_144":145,"_124":125,"_146":279,"_148":280,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-06-13T16:18:14Z","2023-09-06T15:52:15Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：instanceof原理、instanceof实现、instanceof手写\n\ninstanceof 运算符用于检测一个对象是否是某个构造函数的实例。其作用是判断一个对象是否属于某个类（或其父类）的实例，类似于类的继承关系，如果是则返回 true，否则返回 false。通常情况下，用于判断一个对象的类型或类别。可以结合构造函数和原型链来理解。\n\n示例代码：\n\n```javascript\nfunction Person(name) {\n this.name = name;\n}\n\nconst person = new Person(\"张三\");\nconsole.log(person instanceof Person); // Output: true\nconsole.log(person instanceof Object); // Output: true\nconsole.log(person instanceof Array); // Output: false\n```\n\n在上面的示例中，我们通过 `new` 关键字创建了一个 Person 类的实例 `person`。然后我们使用 `instanceof` 运算符检测 `person` 对象是否是 `Person` 类的实例，结果为 true。同样地，我们也可以检测 `person` 对象是否是 `Object` 类的实例，结果也为 true，因为 `Person` 类是 `Object` 类的子类。而 `Array` 类则是 `Object` 类的子类，但不是 `Person` 类的子类，因此检测 `person` 对象是否是 `Array` 类的实例，结果为 false。\n\n**手写实现**\n\ninstanceof 运算符用于检测一个对象是否是某个构造函数的实例。可以通过以下方式手写实现 instanceof 运算符。\n\n```javascript\nfunction myInstanceof(obj, constructor) {\n let proto = Object.getPrototypeOf(obj);\n while(proto) {\n if(proto === constructor.prototype) {\n return true;\n }\n proto = Object.getPrototypeOf(proto);\n }\n return false;\n}\n\n// Example usage\nconst arr = [1, 2, 3];\nconsole.log(myInstanceof(arr, Array)); // Output: true\nconsole.log(myInstanceof(arr, Object)); // Output: true\nconsole.log(myInstanceof(arr, RegExp)); // Output: false\n```\n\n该实现方式获取传入对象的原型对象，并逐层向上搜索其原型链，直到找到目标构造函数的原型对象或者原型链到达最顶层 Object.prototype。如果找到目标构造函数的原型对象，则返回 true，否则返回 false。\n\n",{"_58":812,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/460/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/460/timeline",{"_58":815,"_60":61,"_62":816,"_64":817,"_66":818,"_68":819,"_70":820,"_72":821,"_74":822,"_76":823,"_78":824,"_111":825,"_124":125,"_126":24,"_127":-5,"_128":828,"_130":829,"_152":145,"_146":831,"_148":832,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":833,"_162":834,"_168":835,"_170":836,"_182":838,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/459","https://api.github.com/repos/pro-collection/interview-question/issues/459/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/459/comments","https://api.github.com/repos/pro-collection/interview-question/issues/459/events","https://github.com/pro-collection/interview-question/issues/459",1755252543,"I_kwDOJGDC6c5onwc_",459,"[代码实现] 手写实现 Object.create【热度: 179】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[826,827],{"_70":397,"_72":398,"_58":399,"_117":400,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":270,"_68":271,"_62":272,"_70":273,"_72":274,"_74":187,"_76":275,"_122":276,"_140":830,"_142":278,"_144":145,"_124":125,"_146":279,"_148":280,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-06-13T16:15:06Z","2023-09-06T15:52:19Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：Object.create实现、Object.create手写\n\nObject.create() 方法可以用于创建一个新对象，使其原型与指定的对象完全相同。可以通过以下方式手写实现 Object.create() 方法。\n\n```javascript\nfunction createObject(proto) {\n function F() {}\n F.prototype = proto;\n return new F();\n}\n\n// Example usage\nconst person = {\n firstName: 'John',\n lastName: 'Doe',\n fullName: function() {\n return this.firstName + ' ' + this.lastName;\n }\n};\n\nconst anotherPerson = createObject(person);\nanotherPerson.firstName = 'Jane';\nconsole.log(anotherPerson.fullName()); // Output: \"Jane Doe\"\n```\n\n该实现方式创建了一个名为 F 的空函数，将其原型设置为传入的 proto 对象，然后返回一个新创建的 F 函数对象。这个新对象的原型与传入的 proto 对象相同，从而实现了 Object.create() 的功能。\n",{"_58":837,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/459/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/459/timeline",{"_58":840,"_60":61,"_62":841,"_64":842,"_66":843,"_68":844,"_70":845,"_72":846,"_74":847,"_76":848,"_78":849,"_111":850,"_124":125,"_126":24,"_127":-5,"_128":853,"_130":854,"_152":145,"_146":856,"_148":857,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":858,"_162":859,"_168":860,"_170":861,"_182":863,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/448","https://api.github.com/repos/pro-collection/interview-question/issues/448/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/448/comments","https://api.github.com/repos/pro-collection/interview-question/issues/448/events","https://github.com/pro-collection/interview-question/issues/448",1753047359,"I_kwDOJGDC6c5ofWE_",448,"[代码实现] 手写实现一个缓存函数 memoize【热度: 787】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[851,852],{"_70":397,"_72":398,"_58":399,"_117":400,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":855,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-06-12T15:45:47Z","2023-09-06T15:52:23Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"**关键词**：缓存函数实现、memoize函数\n\n用于创建一个带有缓存功能的函数。下面是一个简化版本的手写实现，展示了如何自己实现 `memoize` 函数：\n\n```javascript\nfunction memoize(func) {\n const cache = {};\n\n return function (...args) {\n const key = JSON.stringify(args);\n\n if (cache[key]) {\n return cache[key];\n }\n\n const result = func.apply(this, args);\n cache[key] = result;\n\n return result;\n };\n}\n\n// 示例用法\nconst expensiveFunction = memoize(function (n) {\n console.log('Computing...');\n return n * 2;\n});\n\nconsole.log(expensiveFunction(5)); // 第一次调用，输出：Computing... 10\nconsole.log(expensiveFunction(5)); // 第二次调用，直接从缓存中获取结果，输出：10\nconsole.log(expensiveFunction(10)); // 新的参数，再次计算并缓存结果，输出：Computing... 20\nconsole.log(expensiveFunction(10)); // 再次调用，直接从缓存中获取结果，输出：20\n```\n\n上述代码中的 `memoize` 函数接受一个函数 `func` 作为参数，并返回一个新的函数。返回的函数具有缓存的能力，即根据参数的不同缓存计算结果。\n\n在返回的函数内部，首先将传入的参数 `args` 转换成一个唯一的字符串 `key`，以便作为缓存对象 `cache` 然后检查 `cache` 对象中是否存在对应的缓存结果，如果存在直接返回缓存结果，否则执行原始函数 `func` 并将结果缓存起来。\n\n通过这种方式，对于相同的参数，后续的调用将直接从缓存中获取结果，而不会再次执行函数。这样可以避免重复计算，提高函数的性能。\n\n在示例中，我们创建了一个名为 `expensiveFunction` 的函数，并使用 `memoize` 进行包装。第一次调用时，函数会执行计算，并输出 `\"Computing...\"`，结果为 10。第二次调用时，函数直接从缓存中获取结果，无需再次计算。最后两次调用分别使用了不同的参数，会触发新的计算并缓存结果。\n\n需要注意的是，这个手写的 `memoize` 函数是一个简化版本，仅适用于参数为基本类型的情况。对于参数为复杂类型（如对象、数组等）的情况，需要使用更复杂的缓存键值生成方法，以确保正确的缓存行为。此外，实际的 Lodash 库中的 `memoize` 函数还提供了其他选项和功能，例如自定义缓存键生成函数、缓存过期时间等。\n",{"_58":862,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/448/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/448/timeline",{"_58":865,"_60":61,"_62":866,"_64":867,"_66":868,"_68":869,"_70":870,"_72":871,"_74":872,"_76":873,"_78":874,"_111":875,"_124":125,"_126":24,"_127":-5,"_128":883,"_130":884,"_152":187,"_146":886,"_148":887,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":888,"_162":889,"_168":890,"_170":891,"_182":893,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/393","https://api.github.com/repos/pro-collection/interview-question/issues/393/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/393/comments","https://api.github.com/repos/pro-collection/interview-question/issues/393/events","https://github.com/pro-collection/interview-question/issues/393",1732575475,"I_kwDOJGDC6c5nRQDz",393,"实现一个JS 函数，解析 url 参数，返回一个对象",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[876,877,882],{"_70":480,"_72":481,"_58":482,"_117":483,"_119":401,"_121":24,"_122":402},{"_70":878,"_72":879,"_58":880,"_117":881,"_119":401,"_121":24,"_122":402},5748783891,"LA_kwDOJGDC6c8AAAABVqd7Ew","https://api.github.com/repos/pro-collection/interview-question/labels/%E6%BB%B4%E6%BB%B4","滴滴",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":885,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-05-30T16:13:53Z","2023-09-13T06:18:18Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"### 基础版本\n\n下面是一个简单的 JavaScript 函数，用于解析 URL 参数并返回一个包含参数键值对的对象：\n\n```javascript\nfunction parseUrlParams(url) {\n const params = {};\n const queryString = url.split('?')[1];\n\n if (queryString) {\n const pairs = queryString.split('&');\n pairs.forEach(pair => {\n const [key, value] = pair.split('=');\n params[key] = decodeURIComponent(value);\n });\n }\n\n return params;\n}\n```\n\n这个函数接受一个 URL 字符串作为参数，并返回解析后的参数对象。例如：\n\n```javascript\nconst url = 'https://example.com?name=John&age=30&city=New%20York';\nconst params = parseUrlParams(url);\n\nconsole.log(params);\n// Output: { name: \"John\", age: \"30\", city: \"New York\" }\n```\n\n这个函数的实现思路是先从 URL 字符串中提取查询字符串部分，然后将查询字符串按照 `&` 分割成键值对数组。接着遍历键值对数组，将每个键值对按照 `=` 分割，然后将键和值存储到结果对象 `params` 中，注意要对值进行 URL 解码以处理特殊字符。最后返回解析后的参数对象。\n\n\n### 进阶 - 支持json字符串参数\n\n如果要支持复杂的 JSON 字符串作为查询参数，可以使用 `JSON.parse()` 方法解析 JSON 字符串，并在解析后的对象中处理参数。\n\n下面是一个修改后的函数，支持解析复杂的 JSON 字符串作为查询参数：\n\n```javascript\nfunction parseUrlParams(url) {\n const params = {};\n const queryString = url.split('?')[1];\n\n if (queryString) {\n const pairs = queryString.split('&');\n pairs.forEach(pair => {\n const [key, value] = pair.split('=');\n const decodedValue = decodeURIComponent(value);\n\n try {\n params[key] = JSON.parse(decodedValue);\n } catch (error) {\n // 如果解析 JSON 失败，则将原始字符串存储到参数对象中\n params[key] = decodedValue;\n }\n });\n }\n\n return params;\n}\n```\n\n现在，如果查询参数是一个 JSON 字符串，它将被解析为相应的 JavaScript 对象，并作为参数对象的值。如果解析失败（例如，不是有效的 JSON 字符串），则将保留原始字符串作为值存储在参数对象中。\n\n以下是一个示例：\n\n```javascript\nconst url = 'https://example.com?name=John&age=30&address={\"city\":\"New York\",\"zipcode\":10001}';\nconst params = parseUrlParams(url);\n\nconsole.log(params);\n// Output: { name: \"John\", age: \"30\", address: { city: \"New York\", zipcode: 10001 } }\n```\n\n### 再次进阶-支持更复杂的场景，比如嵌套对象，数组\n\n下面是修改后的函数，支持解析复杂的查询参数，包括嵌套对象和数组：\n\n```javascript\nfunction parseUrlParams(url) {\n const params = {};\n const queryString = url.split('?')[1];\n\n if (queryString) {\n const pairs = queryString.split('&');\n pairs.forEach(pair => {\n const [key, value] = pair.split('=');\n const decodedValue = decodeURIComponent(value);\n\n const keys = key.split('.');\n let current = params;\n\n for (let i = 0; i < keys.length; i++) {\n const nestedKey = keys[i];\n const isArray = /\\[\\]$/.test(nestedKey);\n\n if (isArray) {\n const arrayKey = nestedKey.slice(0, -2);\n\n if (!current[arrayKey]) {\n current[arrayKey] = [];\n }\n\n if (i === keys.length - 1) {\n current[arrayKey].push(parseValue(decodedValue));\n } else {\n const newIndex = current[arrayKey].length;\n if (!current[arrayKey][newIndex]) {\n current[arrayKey][newIndex] = {};\n }\n current = current[arrayKey][newIndex];\n }\n } else {\n if (i === keys.length - 1) {\n current[nestedKey] = parseValue(decodedValue);\n } else {\n if (!current[nestedKey]) {\n current[nestedKey] = {};\n }\n current = current[nestedKey];\n }\n }\n }\n });\n }\n\n return params;\n}\n\nfunction parseValue(value) {\n try {\n return JSON.parse(value);\n } catch (error) {\n // 解析失败，则返回原始值\n return value;\n }\n}\n```\n\n现在，该函数可以正确解析包含嵌套对象和数组的查询参数。\n\n以下是一个示例：\n\n```javascript\nconst url = 'https://example.com?name=John&age=30&address.city=New%20York&address.zipcode=10001&tags[]=tag1&tags[]=tag2';\nconst params = parseUrlParams(url);\n\nconsole.log(params);\n// Output: { name: \"John\", age: \"30\", address: { city: \"New York\", zipcode: 10001 }, tags: [\"tag1\", \"tag2\"] }\n```\n\n在这个修改后的函数中，当遇到嵌套对象时，它会递归创建相应的对象属性。当遇到数组时，它会创建一个数组，并将值添加到数组中。\n\n",{"_58":892,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/393/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/393/timeline",{"_58":895,"_60":61,"_62":896,"_64":897,"_66":898,"_68":899,"_70":900,"_72":901,"_74":902,"_76":903,"_78":904,"_111":905,"_124":125,"_126":24,"_127":-5,"_128":907,"_130":908,"_152":145,"_146":910,"_148":911,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":912,"_162":913,"_168":914,"_170":915,"_182":917,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/296","https://api.github.com/repos/pro-collection/interview-question/issues/296/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/296/comments","https://api.github.com/repos/pro-collection/interview-question/issues/296/events","https://github.com/pro-collection/interview-question/issues/296",1673409124,"I_kwDOJGDC6c5jvjJk",296,"[代码实现] 数字千分化的实现方式有哪些？用代码实现一下【热度: 3,309】",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[906],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":909,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-04-18T15:48:05Z","2023-09-06T15:52:29Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"数字千分化是指将数字按照千位分隔符进行分割，使其更容易被人类阅读。在 JavaScript 中，可以通过多种方式实现数字千分化，以下是其中的几种方式：\n\n1. 使用正则表达式\n\n```javascript\nfunction formatNumber(num) {\n return num.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\n}\n\nconsole.log(formatNumber(123456789)); // 输出 123,456,789\n```\n\n2. 使用 Intl.NumberFormat\n\n```javascript\nfunction formatNumber(num) {\n return new Intl.NumberFormat().format(num);\n}\n\nconsole.log(formatNumber(123456789)); // 输出 123,456,789（在大多数环境中）\n```\n\n3. 使用自带千分位分隔符的 toLocaleString\n\n```javascript\nfunction formatNumber(num) {\n return num.toLocaleString();\n}\n\nconsole.log(formatNumber(123456789)); // 输出 123,456,789（在大多数环境中）\n```\n\n这些方法都可以实现数字千分化，具体选择哪种方法，可以根据实际需求和代码环境进行选择。",{"_58":916,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/296/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/296/timeline",{"_58":919,"_60":61,"_62":920,"_64":921,"_66":922,"_68":923,"_70":924,"_72":925,"_74":926,"_76":927,"_78":928,"_111":929,"_124":125,"_126":24,"_127":-5,"_128":931,"_130":932,"_152":145,"_146":934,"_148":935,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":936,"_162":937,"_168":938,"_170":939,"_182":941,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/279","https://api.github.com/repos/pro-collection/interview-question/issues/279/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/279/comments","https://api.github.com/repos/pro-collection/interview-question/issues/279/events","https://github.com/pro-collection/interview-question/issues/279",1664633718,"I_kwDOJGDC6c5jOEt2",279,"[代码实现] 简单实现一个洋葱模式中间件",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[930],{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":210,"_68":211,"_62":212,"_70":213,"_72":214,"_74":215,"_76":216,"_122":217,"_140":933,"_142":219,"_144":145,"_124":125,"_146":220,"_148":221,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-04-12T14:02:02Z","2023-09-06T15:52:33Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"洋葱模型是一种常用的中间件模型，例如在 Koa 框架中就广泛应用了这种模型。这种模型的特点是请求被传递到下一个中间件之前，需要先经过当前中间件处理，然后再逐层返回。\n\n下面是一个简单的洋葱模型的示例代码：\n\n```javascript\nfunction middleware1(next) {\n return function(ctx) {\n console.log('middleware1 before');\n next(ctx);\n console.log('middleware1 after');\n }\n}\n\nfunction middleware2(next) {\n return function(ctx) {\n console.log('middleware2 before');\n next(ctx);\n console.log('middleware2 after');\n }\n}\n\nfunction middleware3(next) {\n return function(ctx) {\n console.log('middleware3 before');\n next(ctx);\n console.log('middleware3 after');\n }\n}\n\nfunction compose(middlewares) {\n return function(ctx) {\n function dispatch(i) {\n if (i === middlewares.length) {\n return;\n }\n const middleware = middlewares[i];\n const next = dispatch.bind(null, i + 1);\n middleware(next)(ctx);\n }\n dispatch(0);\n }\n}\n\nconst middlewares = [middleware1, middleware2, middleware3];\nconst composed = compose(middlewares);\ncomposed({});\n```\n\n这个示例中有三个中间件函数 `middleware1`、`middleware2` 和 `middleware3`，它们都是接受一个 `next` 函数作为参数的高阶函数。当这个中间件被执行时，它将接受一个 `ctx` 对象作为参数，并且调用 `next(ctx)` 将请求传递给下一个中间件。\n\n`compose` 函数接受一个中间件函数数组作为参数，返回一个新的函数，这个函数可以将请求传递给第一个中间件函数。每个中间件函数都将接收一个 `next` 函数作为参数，并返回一个新的函数，这个新的函数将接收 `ctx` 对象作为参数，并且在调用 `next(ctx)` 之前和之后都会执行一些操作。当 `next(ctx)` 被调用时，请求将被传递到下一个中间件函数。\n\n在 `composed` 函数中，我们将一个空的 `ctx` 对象作为参数传递给第一个中间件函数。`dispatch` 函数递归地调用中间件数组中的每一个中间件函数，并将 `ctx` 对象和下一个中间件函数作为参数传递。当最后一个中间件函数完成处理时，递归调用结束，请求处理完成。\n",{"_58":940,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/279/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/279/timeline",{"_58":943,"_60":61,"_62":944,"_64":945,"_66":946,"_68":947,"_70":948,"_72":949,"_74":950,"_76":951,"_78":952,"_111":953,"_124":125,"_126":24,"_127":-5,"_128":962,"_130":963,"_152":246,"_146":965,"_148":966,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":967,"_162":968,"_168":969,"_170":970,"_182":972,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/264","https://api.github.com/repos/pro-collection/interview-question/issues/264/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/264/comments","https://api.github.com/repos/pro-collection/interview-question/issues/264/events","https://github.com/pro-collection/interview-question/issues/264",1659560115,"I_kwDOJGDC6c5i6uCz",264,"请实现一个 add 函数，满足以下功能",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[954,961],{"_70":955,"_72":956,"_58":957,"_117":958,"_119":959,"_121":24,"_122":960},5232521368,"LA_kwDOJGDC6c8AAAABN-HwmA","https://api.github.com/repos/pro-collection/interview-question/labels/JavaScript","JavaScript","A4D8FB","JavaScript 语法部分",{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":964,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-04-08T15:42:13Z","2023-10-13T04:25:20Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"### 题目如下\r\n\r\n```\r\nadd(1).getValue(); \t// 1\r\nadd(1)(2).getValue(); \t// 3\r\nadd(1)(2)(3).getValue()； // 6\r\nadd(1)(2, 3).getValue(); // 6\r\nadd(1, 2)(3).getValue(); // 6\r\nadd(1, 2, 3).getValue(); // 6\r\n```\r\n\r\n### 解法\r\n\r\n\r\n```js\r\nfunction add(...args) {\r\n function innerAdd(...innerArgs) {\r\n args.push(...innerArgs);\r\n return innerAdd;\r\n }\r\n\r\n innerAdd.getValue = function() {\r\n return args.reduce((acc, curr) => acc + curr, 0);\r\n };\r\n\r\n return innerAdd;\r\n}\r\n\r\n\r\n// console.log(add(1)(2).getValue()); // 输出: 3\r\n```\r\n\r\n",{"_58":971,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/264/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/264/timeline",{"_58":974,"_60":61,"_62":975,"_64":976,"_66":977,"_68":978,"_70":979,"_72":980,"_74":981,"_76":982,"_78":983,"_111":984,"_124":125,"_126":24,"_127":-5,"_128":988,"_130":989,"_152":187,"_146":991,"_148":992,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":993,"_162":994,"_168":995,"_170":996,"_182":998,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/222","https://api.github.com/repos/pro-collection/interview-question/issues/222/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/222/comments","https://api.github.com/repos/pro-collection/interview-question/issues/222/events","https://github.com/pro-collection/interview-question/issues/222",1644202166,"I_kwDOJGDC6c5iAIi2",222,"给定两个数组，写一个方法来计算它们的交集？",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[985,986,987],{"_70":955,"_72":956,"_58":957,"_117":958,"_119":959,"_121":24,"_122":960},{"_70":563,"_72":564,"_58":565,"_117":566,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":132,"_68":133,"_62":134,"_70":135,"_72":136,"_74":137,"_76":138,"_122":139,"_140":990,"_142":143,"_144":145,"_124":125,"_146":147,"_148":149,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-03-28T15:30:22Z","2025-07-22T04:21:24Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"可以使用 ES6 的 Set 数据结构来实现数组交集。\n\n首先，将一个数组转化为 Set，然后遍历另一个数组，将数组中存在于 Set 中的元素存入结果数组中。\n\n以下是一个示例代码：\n\n```javascript\nfunction intersection(nums1, nums2) {\n const set1 = new Set(nums1);\n const res = [];\n\n for (let num of nums2) {\n if (set1.has(num)) {\n res.push(num);\n }\n }\n\n return res;\n}\n```\n\n使用示例：\n\n```javascript\nconst nums1 = [1, 2, 2, 1];\nconst nums2 = [2, 2];\n\nconsole.log(intersection(nums1, nums2)); // [2]\n```\n\n该算法的时间复杂度为 O(m+n)，其中 m 和 n 分别为两个数组的长度。",{"_58":997,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/222/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/222/timeline",{"_58":1000,"_60":61,"_62":1001,"_64":1002,"_66":1003,"_68":1004,"_70":1005,"_72":1006,"_74":1007,"_76":1008,"_78":1009,"_111":1010,"_124":125,"_126":24,"_127":-5,"_128":1015,"_130":1016,"_152":145,"_146":1018,"_148":1019,"_151":-5,"_154":155,"_106":-5,"_156":-5,"_157":1020,"_162":1021,"_168":1022,"_170":1023,"_182":1025,"_184":-5,"_185":-5,"_186":187},"https://api.github.com/repos/pro-collection/interview-question/issues/200","https://api.github.com/repos/pro-collection/interview-question/issues/200/labels{/name}","https://api.github.com/repos/pro-collection/interview-question/issues/200/comments","https://api.github.com/repos/pro-collection/interview-question/issues/200/events","https://github.com/pro-collection/interview-question/issues/200",1640861842,"I_kwDOJGDC6c5hzZCS",200,"手写订阅-发布模式",{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},[1011,1012,1013,1014],{"_70":955,"_72":956,"_58":957,"_117":958,"_119":959,"_121":24,"_122":960},{"_70":592,"_72":593,"_58":594,"_117":595,"_119":401,"_121":24,"_122":402},{"_70":509,"_72":510,"_58":511,"_117":512,"_119":401,"_121":24,"_122":402},{"_70":114,"_72":115,"_58":116,"_117":118,"_119":120,"_121":24,"_122":123},[],{"_58":210,"_68":211,"_62":212,"_70":213,"_72":214,"_74":215,"_76":216,"_122":217,"_140":1017,"_142":219,"_144":145,"_124":125,"_146":220,"_148":221,"_150":-5,"_151":-5},{"_80":81,"_70":82,"_72":83,"_84":85,"_86":28,"_58":87,"_68":88,"_89":90,"_91":92,"_93":94,"_95":96,"_97":98,"_99":100,"_101":102,"_66":103,"_104":105,"_106":107,"_108":109,"_110":24},"2023-03-26T10:56:48Z","2023-09-25T11:48:11Z",{"_159":145,"_160":145,"_161":145},{"_164":145,"_165":145,"_166":145,"_167":145},"订阅-发布模式是一种常用的设计模式，它可以实现对象间的解耦，让它们不需要相互知道对方的存在，只需要关注自己需要订阅的事件即可。当一个对象的状态发生变化时，它可以发布一个事件通知其他对象，其他对象可以订阅该事件，当事件发生时得到通知并执行相应的处理。\n\n在 JavaScript 中，订阅-发布模式也被称为事件模型。事件模型由两个主要组件组成：事件触发器和事件监听器。事件触发器负责触发事件，而事件监听器则负责监听事件并执行相应的回调函数。\n\n下面是一个简单的实现订阅-发布模式的例子：\n\n```javascript\nclass EventEmitter {\n constructor() {\n this._events = {};\n }\n\n on(event, listener) {\n if (!this._events[event]) {\n this._events[event] = [];\n }\n this._events[event].push(listener);\n }\n\n emit(event, ...args) {\n if (this._events[event]) {\n this._events[event].forEach((listener) => listener(...args));\n }\n }\n\n off(event, listener) {\n if (this._events[event]) {\n this._events[event] = this._events[event].filter((l) => l !== listener);\n }\n }\n}\n```\n\n这个实现包括三个方法：\n\n* `on(event, listener)`：订阅事件，当事件被触发时执行监听器 `listener`；\n* `emit(event, ...args)`：触发事件，并将参数 `...args` 传递给监听器；\n* `off(event, listener)`：取消订阅事件，不再执行监听器 `listener`。\n\n使用方法如下：\n\n```javascript\nconst emitter = new EventEmitter();\n\n// 订阅事件\nemitter.on(\"event\", (arg1, arg2) => {\n console.log(`event: ${arg1}, ${arg2}`);\n});\n\n// 触发事件\nemitter.emit(\"event\", \"hello\", \"world\");\n\n// 取消订阅事件\nemitter.off(\"event\");\n```\n\n以上代码将输出：\n\n```csharp\ncsharpCopy codeevent: hello, world\n```\n\n订阅-发布模式在事件驱动的系统中非常常见，例如浏览器中的 DOM 事件、Node.js 中的异步 IO 事件等。",{"_58":1024,"_173":145,"_174":145,"_175":145,"_176":145,"_177":145,"_178":145,"_179":145,"_180":145,"_181":145},"https://api.github.com/repos/pro-collection/interview-question/issues/200/reactions","https://api.github.com/repos/pro-collection/interview-question/issues/200/timeline","pagination",{"_1028":187,"_159":137},"value","actionData","errors"]