1e:I[522016,["/_next/static/chunks/008crbu1wvww1.js","/_next/static/chunks/0xv-p7xxdjggv.js","/_next/static/chunks/2rkbnaa60chl0.js","/_next/static/chunks/34nljeldfxvso.js","/_next/static/chunks/3s-91zfhxfz_i.js","/_next/static/chunks/2euoam2_hqd-3.js","/_next/static/chunks/15ht1na675f92.js","/_next/static/chunks/0a42hv2eax_wy.js","/_next/static/chunks/37u8i-n86sk1y.js","/_next/static/chunks/1v5gem7vh1mpz.js","/_next/static/chunks/34t_zvjz0u54e.js","/_next/static/chunks/3w1a7ko-uze7n.js","/_next/static/chunks/2szcdqofrz1rc.js","/_next/static/chunks/3h_1a4ylwg9l-.js"],""] 1f:I[282628,["/_next/static/chunks/008crbu1wvww1.js","/_next/static/chunks/0xv-p7xxdjggv.js","/_next/static/chunks/2rkbnaa60chl0.js","/_next/static/chunks/34nljeldfxvso.js","/_next/static/chunks/3s-91zfhxfz_i.js","/_next/static/chunks/2euoam2_hqd-3.js","/_next/static/chunks/15ht1na675f92.js","/_next/static/chunks/0a42hv2eax_wy.js","/_next/static/chunks/37u8i-n86sk1y.js","/_next/static/chunks/1v5gem7vh1mpz.js","/_next/static/chunks/34t_zvjz0u54e.js","/_next/static/chunks/3w1a7ko-uze7n.js","/_next/static/chunks/2szcdqofrz1rc.js","/_next/static/chunks/3h_1a4ylwg9l-.js"],"Category"] 20:I[332505,["/_next/static/chunks/008crbu1wvww1.js","/_next/static/chunks/0xv-p7xxdjggv.js","/_next/static/chunks/2rkbnaa60chl0.js","/_next/static/chunks/34nljeldfxvso.js","/_next/static/chunks/3s-91zfhxfz_i.js","/_next/static/chunks/2euoam2_hqd-3.js","/_next/static/chunks/15ht1na675f92.js","/_next/static/chunks/0a42hv2eax_wy.js","/_next/static/chunks/37u8i-n86sk1y.js","/_next/static/chunks/1v5gem7vh1mpz.js","/_next/static/chunks/34t_zvjz0u54e.js","/_next/static/chunks/3w1a7ko-uze7n.js","/_next/static/chunks/2szcdqofrz1rc.js","/_next/static/chunks/3h_1a4ylwg9l-.js"],"BackButton"] 21:I[388078,["/_next/static/chunks/008crbu1wvww1.js","/_next/static/chunks/0xv-p7xxdjggv.js","/_next/static/chunks/2rkbnaa60chl0.js","/_next/static/chunks/34nljeldfxvso.js","/_next/static/chunks/3s-91zfhxfz_i.js","/_next/static/chunks/2euoam2_hqd-3.js","/_next/static/chunks/15ht1na675f92.js","/_next/static/chunks/0a42hv2eax_wy.js","/_next/static/chunks/37u8i-n86sk1y.js","/_next/static/chunks/1v5gem7vh1mpz.js","/_next/static/chunks/34t_zvjz0u54e.js","/_next/static/chunks/3w1a7ko-uze7n.js","/_next/static/chunks/2szcdqofrz1rc.js","/_next/static/chunks/3h_1a4ylwg9l-.js"],"ActionButton"] :HL["https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&h=650&w=940","image"] :HL["/favicon.svg","image"] 22:T4a9,将文本中的汉字转换为 Unicode 表示形式。 ```javascript function convertToUnicode(text) { var unicodeText = ''; for (var i = 0; i < text.length; i++) { var charCode = text.charCodeAt(i); if (charCode > 127) { unicodeText += '\\u' + charCode.toString(16).toUpperCase(); } else { unicodeText += text.charAt(i); } } return unicodeText; } var inputText = '这是一段测试文本。'; var unicodeText = convertToUnicode(inputText); console.log(unicodeText); ``` 还原：使用 JavaScript 的 `unescape` 函数，将 Unicode 转义序列还原为相应的字符。： ```javascript function convertFromUnicode(unicodeText) { var text = ''; var matches = unicodeText.match(/\\u[\dA-Fa-f]{4}|./g); for (var i = 0; i < matches.length; i++) { if (matches[i].substring(0, 2) === '\\u') { text += String.fromCharCode(parseInt(matches[i].substring(2), 16)); } else { text += matches[i]; } } return text; } var unicodeText = '\\u8FD9\\u662F\\u4E00\\u6BB5\\u6D4B\\u8BD5\\u6587\\u672C\\u3002'; var originalText = convertFromUnicode(unicodeText); console.log(originalText); ``` 23:T2214,## innerText 和 textContent | | innerText | textContent | |-----------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 定义 | 非标准属性 | 标准属性 | | 返回内容 | 元素及其后代元素的可见文本内容 | 元素及其后代元素的所有文本内容，包括隐藏元素和脚本生成的内容 | | 受 CSS 样式
影响 | 会受 CSS 样式的影响（例如 `text-transform`） | 否 | | 保留空白字符
和换行符 | 是 | 否 | ## htmlcollection ## designmode + [The WHATWG Blog — The Road to HTML 5: contentEditable](https://blog.whatwg.org/the-road-to-html-5-contenteditable) + https://css-tricks.com/the-browser-can-remember-edited-content/ `designMode` 和 `contenteditable` 都是 HTML 属性，用于控制元素的可编辑性，但它们有以下区别： **1. 应用范围：** - `designMode` 是一个 **文档级** 属性，应用于整个 HTML 文档。它用于启用或禁用整个文档的编辑模式。 - `contenteditable` 是一个 **元素级** 属性，应用于单个 HTML 元素。它用于启用或禁用该元素的可编辑性。 **2. 功能：** - `designMode` 提供更高级的编辑功能，允许用户使用浏览器提供的编辑工具（如格式化工具栏）来编辑内容。它通常用于富文本编辑器。 - `contenteditable` 提供更基本的编辑功能，允许用户直接在元素中输入和编辑文本。它通常用于简单的文本编辑或用户输入。 **3. 使用场景：** - `designMode` 通常用于创建富文本编辑器，例如在线文档编辑器、博客编辑器等。 - `contenteditable` 通常用于创建简单的文本输入框、评论区、在线聊天等。 **4. 代码示例：** ```html DesignMode vs ContentEditable

DesignMode Example

This is a div with designMode enabled.

ContentEditable Example

This is a div with contenteditable enabled.

``` **总结：** - `designMode` 用于整个文档的编辑模式，提供更高级的编辑功能。 - `contenteditable` 用于单个元素的可编辑性，提供更基本的编辑功能。 ## 事件 currentTarget 和 target 在JavaScript的事件处理中，`target`和`currentTarget`是两个非常重要的属性，它们在事件对象中表示不同的概念： 1. **target**：这个属性表示事件实际触发的元素，即事件最初被触发的那个元素。无论事件如何传播（捕获或冒泡阶段），`target`总是指向最初的事件源。 2. **currentTarget**：这个属性表示事件当前正在被处理的元素。在事件冒泡或捕获的过程中，每个元素节点都可能是`currentTarget`。换句话说，`currentTarget`是当前正在调用事件处理程序的那个元素。简单来说，`target`是事件开始的地方，而`currentTarget`是事件当前所在的地方。举个例子来说明它们的区别：假设你有以下HTML结构： ```html

``` 并且你为父元素`#parent`注册了一个点击事件监听器： ```javascript document.getElementById('parent').addEventListener('click', function(event) { console.log('currentTarget (当前处理的元素): ', event.currentTarget); // 会输出 div#parent console.log('target (事件触发的元素): ', event.target); // 会输出 button#child }); ``` 当点击按钮时，控制台会输出： ``` currentTarget (当前处理的元素): div#parent target (事件触发的元素): button#child ``` 在这个例子中，尽管事件监听器是注册在父元素`#parent`上，但事件实际上是由子元素`#child`（按钮）触发的。因此，`event.target`是`button`元素，而`event.currentTarget`是`div`元素，因为事件处理程序是在`div`上调用的。 ## Bubbling and capturing > https://javascript.info/bubbling-and-capturing When an event happens – the most nested element where it happens gets labeled as the “target element” (`event.target`). - Then the event moves down from the document root to `event.target`, calling handlers assigned with `addEventListener(..., true)` on the way (`true` is a shorthand for `{capture: true}`). - Then handlers are called on the target element itself. - Then the event bubbles up from `event.target` to the root, calling handlers assigned using `on`, HTML attributes and `addEventListener` without the 3rd argument or with the 3rd argument `false/{capture:false}`. Each handler can access `event` object properties: - `event.target` – the deepest element that originated the event. - `event.currentTarget` (=`this`) – the current element that handles the event (the one that has the handler on it) - `event.eventPhase` – the current phase (capturing=1, target=2, bubbling=3). Any event handler can stop the event by calling `event.stopPropagation()`, but that’s not recommended, because we can’t really be sure we won’t need it above, maybe for completely different things. The capturing phase is used very rarely, usually we handle events on bubbling. And there’s a logical explanation for that. In real world, when an accident happens, local authorities react first. They know best the area where it happened. Then higher-level authorities if needed. The same for event handlers. The code that set the handler on a particular element knows maximum details about the element and what it does. A handler on a particular `` may be suited for that exactly ``, it knows everything about it, so it should get the chance first. Then its immediate parent also knows about the context, but a little bit less, and so on till the very top element that handles general concepts and runs the last one. Bubbling and capturing lay the foundation for “event delegation” – an extremely powerful event handling pattern that we study in the next chapter. 24:T7bf,data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wAARCABkAGQDASIAAhEBAxEB/8QAGQAAAgMBAAAAAAAAAAAAAAAAAAIBAwQF/8QANBAAAQMCBAUBBQcFAAAAAAAAAQACEQMhBBIxQRMiUWFxgRQykbHBBUJScoKh4SNikqLR/8QAGQEAAwEBAQAAAAAAAAAAAAAAAAECAwQF/8QAIBEBAQACAgEFAQAAAAAAAAAAAAECEQMSMQQTFCFRQv/aAAwDAQACEQMRAD8A7zjUAlrWmTu6PolbUrB+Q02yYiHTP7K5xEBX4LDEVeK4XLRl7arxOHj7138mXWNdBppUQ1tPM7e+pV4c4WCloj0TRaei9STU047doa9w1H7qTU7FKZKrq1GMbmc4DsmQGKy05NGqL6ZQTr5VTsaw6hwG9lhr4l1QkNJa3p1VIfsbKpiW2rEVw5pyF2X8pWUVREgOP6SrA4E3IS6F1wbn5rSTRJDhbldf+0pgZ0Dv8SoBTTKYTfofghRcIQCU2ceuGxyi7l0qIy1nOO7R9VRhaPCYZPM657K1rIxPEkzkDSNtSfquPhw6Yaa55dq1goLoEbJZndZcbieGwtBhzt+y1kQMVjRS5WXcVzn1HPcXvKJG9+6gxqtZJEkLp3ARE3ie6gvg2v6JcjXVm1ZcHNBAANr9QqCwFGZrWPc98BskkjZS0wFNIkDKXEx1TCadWnUptqU3h7XgFpG4TTeyIH3Yjwi7X3AIhIJkoRI/CEIDoNtdAd/WLY+6DM9ymygpJAxZaTfhg663csFLCYYuVXqGtVLje9vC6OLqinRPXZci9ytMIVSXGEpPeVGu8oaCLlaEnTZM0AXlAbuU0CEBEw6ERzHpP1VmQFghVAAabE/NIHa7ummdBKrYN1aDHZPYS020QpFQReEJB0y3Y6LFjfsgYzGUcbTxdTD1cOxzW5WAgze/baF0g2Z6LPjK4w9EkGS6QPhCxhuZiqzqtXLMhtjbVUE7ApM1yTupHVbSahJgazdFIVi0GoKQd0YSR8SEWbf5JZPEmSRlEDvJTC+OXUSpykCVWJ8InbVAWZ4Iy38JC07SLnZHMCBEeU1+yAVrS0WeT0ls/VMQ46PA8s/lQ3OM2YsIzHLA1G3qrMw0sgEyO/H/AK/yhNmb0CEB2q1VtGm4vMEBcGvXdXqZnabDorMZinYqqbkMHuhZ4LtBPVTjjoIGpKkEkwk92c5A8qt2LY33QXHroFSMuTHDzWgCNSq8wFdwJgBgNzpcrI7FVHaOy+Aqi3NVBMnl3Pcqurmy9XP5jp8eiAOcE+ZQazCPfA9VibT8JsgARqM/lZ/jWMTSFnOmFDsZTH3S4LKWghEQIT1EX1Oa8YwGeQphihbk/dZcsKWlGoXyOT9bfa29D6IWQuaNXAHuUJaV8jNokAG6z1MVlkUxJ6rO+o6q68x0CduHqm4YR5MJak8tM+fLL6whHOdVOZxk91Ipjcq32StoWiO5Tew1iAbJ9p+ub2+S/eqqDRshoBqn8o+ZVrsHUbefgqhTqNxZadDS38lPtKXTKeYsBUkjqk5g67fgpJGyEJ1CCEt9ijMQEA0IFioBTC4sgCJ2B9EKY7oQbS2myjApsaJMTqVkxuNrUftOhhWluSrSc8ki4IOyELlr2sZJPpaXVHNjiubDQZAF9Oy10WF7AeI4eIQhBp4JDr1qh7W/4hmGovqurFhzloYTndoPWxuUISMDDU6ZIaX/AKnE/NRXoUo9wIQrxtZcmM14YHNDKkAJXMa6JaNZQhdDyL5RAEJixpgEAoQmE8No0aPgEIQkW3//2Q==25:T7bf,data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wAARCABkAGQDASIAAhEBAxEB/8QAGQAAAgMBAAAAAAAAAAAAAAAAAAIBAwQF/8QANBAAAQMCBAUBBQcFAAAAAAAAAQACEQMhBBIxQRMiUWFxgRQykbHBBUJScoKh4SNikqLR/8QAGQEAAwEBAQAAAAAAAAAAAAAAAAECAwQF/8QAIBEBAQACAgEFAQAAAAAAAAAAAAECEQMSMQQTFCFRQv/aAAwDAQACEQMRAD8A7zjUAlrWmTu6PolbUrB+Q02yYiHTP7K5xEBX4LDEVeK4XLRl7arxOHj7138mXWNdBppUQ1tPM7e+pV4c4WCloj0TRaei9STU047doa9w1H7qTU7FKZKrq1GMbmc4DsmQGKy05NGqL6ZQTr5VTsaw6hwG9lhr4l1QkNJa3p1VIfsbKpiW2rEVw5pyF2X8pWUVREgOP6SrA4E3IS6F1wbn5rSTRJDhbldf+0pgZ0Dv8SoBTTKYTfofghRcIQCU2ceuGxyi7l0qIy1nOO7R9VRhaPCYZPM657K1rIxPEkzkDSNtSfquPhw6Yaa55dq1goLoEbJZndZcbieGwtBhzt+y1kQMVjRS5WXcVzn1HPcXvKJG9+6gxqtZJEkLp3ARE3ie6gvg2v6JcjXVm1ZcHNBAANr9QqCwFGZrWPc98BskkjZS0wFNIkDKXEx1TCadWnUptqU3h7XgFpG4TTeyIH3Yjwi7X3AIhIJkoRI/CEIDoNtdAd/WLY+6DM9ymygpJAxZaTfhg663csFLCYYuVXqGtVLje9vC6OLqinRPXZci9ytMIVSXGEpPeVGu8oaCLlaEnTZM0AXlAbuU0CEBEw6ERzHpP1VmQFghVAAabE/NIHa7ummdBKrYN1aDHZPYS020QpFQReEJB0y3Y6LFjfsgYzGUcbTxdTD1cOxzW5WAgze/baF0g2Z6LPjK4w9EkGS6QPhCxhuZiqzqtXLMhtjbVUE7ApM1yTupHVbSahJgazdFIVi0GoKQd0YSR8SEWbf5JZPEmSRlEDvJTC+OXUSpykCVWJ8InbVAWZ4Iy38JC07SLnZHMCBEeU1+yAVrS0WeT0ls/VMQ46PA8s/lQ3OM2YsIzHLA1G3qrMw0sgEyO/H/AK/yhNmb0CEB2q1VtGm4vMEBcGvXdXqZnabDorMZinYqqbkMHuhZ4LtBPVTjjoIGpKkEkwk92c5A8qt2LY33QXHroFSMuTHDzWgCNSq8wFdwJgBgNzpcrI7FVHaOy+Aqi3NVBMnl3Pcqurmy9XP5jp8eiAOcE+ZQazCPfA9VibT8JsgARqM/lZ/jWMTSFnOmFDsZTH3S4LKWghEQIT1EX1Oa8YwGeQphihbk/dZcsKWlGoXyOT9bfa29D6IWQuaNXAHuUJaV8jNokAG6z1MVlkUxJ6rO+o6q68x0CduHqm4YR5MJak8tM+fLL6whHOdVOZxk91Ipjcq32StoWiO5Tew1iAbJ9p+ub2+S/eqqDRshoBqn8o+ZVrsHUbefgqhTqNxZadDS38lPtKXTKeYsBUkjqk5g67fgpJGyEJ1CCEt9ijMQEA0IFioBTC4sgCJ2B9EKY7oQbS2myjApsaJMTqVkxuNrUftOhhWluSrSc8ki4IOyELlr2sZJPpaXVHNjiubDQZAF9Oy10WF7AeI4eIQhBp4JDr1qh7W/4hmGovqurFhzloYTndoPWxuUISMDDU6ZIaX/AKnE/NRXoUo9wIQrxtZcmM14YHNDKkAJXMa6JaNZQhdDyL5RAEJixpgEAoQmE8No0aPgEIQkW3//2Q==26:Tf91,简单的脚本示例，它将 Markdown 文件中的所有一级标题（`#` 开头）转换为二级标题（`##` 开头），依此类推。 + 定义了一个正则表达式`headingsRegex`，用来匹配Markdown中的标题。正则表达式中的`(^#{1,6})`匹配从一级到六级的标题，`\s*`匹配标题后的空白字符，`(.*)`匹配标题内容。 + `replaceHeading`函数接收匹配到的标题，计算其级别，并生成新的标题前缀，然后返回新的标题。 + 使用`String.prototype.replace`方法和定义的替换函数来替换Markdown文本中的所有标题。请注意，这个脚本是一个简单的示例，它假设Markdown文本格式良好，并且没有考虑嵌套标题或其他复杂情况。在实际使用中可能需要根据具体情况调整正则表达式和替换逻辑。 ```javascript // 假设 markdownText 是你的Markdown文本内容 let markdownText = `# 这是一级标题一些文本内容... ## 这是二级标题一些文本内容... ### 这是三级标题一些文本内容... `; // 使用正则表达式匹配所有的Markdown标题 const headingsRegex = /(^#{1,6})\s+(.*)/gm; // 替换函数，将匹配到的标题提升一个级别 function replaceHeading(match, prefix, content) { const level = prefix.length; const newPrefix = '#'.repeat(level + 1); return `${newPrefix} ${content}`; } // 替换Markdown文本中的所有标题 markdownText = markdownText.replace(headingsRegex, replaceHeading); console.log(markdownText); ``` ## 一种创建 n 个元素数组的方法使用 `String.prototype.repeat` ，创建字符串，再分割为数组。其实写起来跟用 Array.from 也差不多，不会节省多少代码 ```js `1`.repeat(10).split(""); ``` ```js Array.from({length:10}); ``` ## 负向先行断言使用负向先行断言（negative lookahead）可以实现匹配以`#`开头但`#`前面不能有空格的Markdown标题。负向先行断言的语法是 `(?!...)`，其中`...`是我们要排除的模式。下面是使用负向先行断言的正则表达式，用于匹配Markdown标题： ```regex ^(?!\s)(#{1,6})(.*) ``` 这个正则表达式的组成部分解释如下： - `^` 表示行的开始。 - `(?!\s)` 是负向先行断言，表示`#`前面不能有空格字符。 - `(#{1,6})` 表示匹配1到6个`#`字符，对应Markdown中的一级到六级标题。 - `(.*)` 表示匹配任意数量的任意字符，直到行尾。在Node.js中使用这个正则表达式来匹配Markdown文件中的标题： ```javascript const fs = require('fs'); const path = require('path'); // 使用负向先行断言的正则表达式匹配Markdown标题 const headerRegex = /^（?!\s）(#{1,6})(.*)$/gm; // 读取Markdown文件内容 const markdownFilePath = path.join(__dirname, 'path/to/your/markdown.md'); fs.readFile(markdownFilePath, 'utf8', (err, markdownContent) => { if (err) { console.error('Error reading file:', err); return; } // 使用正则表达式匹配所有标题 const headers = markdownContent.match(headerRegex); if (headers) { headers.forEach((header, index) => { // 移除行首的#和空格，获取标题文本 const trimmedHeader = header.replace(/^(#+)[ \t]?/, ''); console.log(`Title ${index + 1}: ${trimmedHeader}`); }); } else { console.log('No headers found.'); } }); ``` 请注意，在JavaScript中，正则表达式的某些字符需要被转义，例如括号`()`和感叹号`!`。在上面的代码中，我使用了`（?!\s）`来转义这些字符。然而，实际上在JavaScript正则表达式中，你只需要使用`(?!\s)`即可，不需要额外的转义。将`'path/to/your/markdown.md'`替换为你的Markdown文件的实际路径。这段代码会读取Markdown文件，使用正则表达式匹配所有符合要求的标题，并打印出它们的文本内容。 27:T53e,```js // 高亮显示数字 function highlightNumbers(element) { // 获取元素节点的文本内容 let text = element.data; if(!text) return; // 使用正则表达式匹配数字 let regex = /[\p{N}\u4e00一二三四五六七八九十]/ug; let matches = text.match(regex); if (matches) { // 遍历匹配到的数字 for (let i = 0; i < matches.length; i++) { let number = matches[i]; // 创建一个带有高亮样式的元素 let span = document.createElement('span'); span.innerHTML = number; span.style.backgroundColor = 'yellow'; span.style.fontWeight = 'bold'; // 替换文本中的数字为带有高亮样式的元素，重复的也要替换 text = text.replaceAll(number, span.outerHTML); } // 更新元素节点的文本内容 element.parentElement.innerHTML = text; } } function traverseTextNodes(element) { // 检查当前节点是否为文本节点 if (element.nodeType === Node.TEXT_NODE) { highlightNumbers(element) } // 遍历当前节点的子节点 for (let i = 0; i < element.childNodes.length; i++) { const childNode = element.childNodes[i]; // 递归调用遍历函数，处理子节点 traverseTextNodes(childNode); } } traverseTextNodes(document.body); ```28:T113f,## 类空格字符要使用 JavaScript 正则表达式匹配任何像空格的字符，包括换行和制表符，可以使用预定义的字符类。在正则表达式中，`\s` 表示匹配任何空白字符。它包括空格、制表符、换行符和其他 Unicode 空白字符。例如 `/\s{2,}/` 匹配的是连续出现两个或更多个空白字符的内容。其中 `\s` 表示匹配任意空白字符，包括空格、制表符、换行符等。`{2,}` 表示至少匹配两次或更多次。所以这个正则表达式可以用来匹配连续的多个空白字符。另一示例代码： ```javascript const text = "Hello\tworld\nThis is a test."; // 使用正则表达式匹配任何像空格的字符 const regex = /\s/g; const matches = text.match(regex); console.log(matches); // 输出: ['\t', '\n', ' ', ' ', ' '] ``` 如果想要匹配除了空白字符之外的字符，可以使用 `\S`。它表示匹配任何非空白字符。 ## 数值格式化在 JavaScript 中，`toLocaleString()` 方法无法直接控制是否显示千位分隔符。千位分隔符的显示与操作系统的区域设置相关。如果你想要去除千位分隔符，可以使用 `toLocaleString()` 方法的返回值，然后使用 `replace()` 方法将逗号删除。以下是相应的代码示例： ```javascript var number = Number(170152.40).toLocaleString('zh-CN', { maximumFractionDigits: 2, minimumFractionDigits: 2, }); var result = number.replace(/,/g, ''); console.log(result); ``` 这将输出 `170152.40`，没有逗号。 ## 四舍五入在 JavaScript 中，可以使用原生 API 来实现四舍五入求整数的功能。 `Math.round()` 方法会将一个数字四舍五入为最接近的整数。以下是一个示例代码： ```javascript let number = 3.7; let roundedNumber = Math.round(number); console.log(roundedNumber); // 输出 4 ``` ### 小数保留四舍五入 toLocaleString IEEE 754 浮点数舍入采用四舍六入五成双的舍入规则，是为了在舍入过程中尽量减少舍入误差，并在某些情况下更好地接近原始数值。这种舍入规则的原理是基于统计学上的“就近原则”和“平均分配原则”。 1. 就近原则：当需要舍弃的位数等于5时，应该选择最接近的偶数作为舍入结果。这是因为在统计学中，偶数出现的概率与奇数相等，所以选择偶数可以在一定程度上减小舍入误差。 2. 平均分配原则：当需要舍弃的位数小于5时，直接舍弃；当需要舍弃的位数大于5时，直接进位。这样做可以在舍入过程中尽量保持数值的平均分布，减小舍入误差的累积。通过采用四舍六入五成双的舍入规则，IEEE 754 浮点数可以在一定程度上减小舍入误差，并提高数值计算的准确性和可靠性。然而，需要注意的是，这种舍入规则并不适用于所有情况，特定场景下可能需要使用其他舍入规则或自定义实现来满足需求。 ## ?? 和 || | 运算符 | 描述 | | ------ | ------------------------------------------------------------ | | `??` | 空值合并运算符 (nullish coalescing operator)，用于判断一个值是否为 `null` 或 `undefined`，如果是则返回默认值。 | | `\|\|` | 逻辑或运算符 (logical OR operator)，用于判断多个条件中的一个是否为真，如果其中任意一个条件为真，则返回第一个真值。注意逻辑或运算符 (`\|\|`) 在判断真值时，会将除 `false`、`0`、`''`、`null`、`undefined` 和 `NaN` 之外的所有值视为真值。 | ## 整数补足位数要将一个整数补足到12位，你可以使用JavaScript的字符串方法来实现： ```javascript let number = 12345; // 要补足的整数 let paddedNumber = number.toString().padStart(12, '0'); console.log(paddedNumber); // 输出: "0000012345" ``` 将整数`number`转换为字符串，然后使用`padStart()`方法将字符串补足到指定的长度（12位），并在不足的位置插入指定的填充字符（这里是0）。如果原始整数的位数已经超过了指定的长度（12位），则不会进行任何补足操作。 ## 删除对象属性 ```javascript // 删除属性 delete obj.prop2; ``` 1c:[["$","section",null,{"className":"w-full bg-muted-100 dark:bg-muted-900 pt-16","children":["$","div",null,{"className":"w-full max-w-6xl mx-auto","children":["$","div",null,{"className":"py-14 px-4 relative","children":["$","div",null,{"className":"w-full mx-auto grid md:grid-cols-2 gap-2 ","children":[["$","div",null,{"className":"bg-cover bg-center w-full mb-5 md:mb-0 ptablet:px-5 ltablet:px-4","children":["$","img",null,{"src":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&h=650&w=940","alt":"Js Unicode 转义","width":512,"height":373,"className":"max-w-full h-auto lg:max-w-lg mx-auto object-cover md:w-[512px] md:h-[373px] rounded-3xl","loading":"eager"}]}],["$","div",null,{"className":"h-full flex items-center ptablet:px-4 ltablet:px-6 break-words justify-center","children":["$","div",null,{"className":"w-full max-w-lg space-x-2","children":[[["$","$L1e","32",{"href":"/tags/32","children":["$","span",null,{"className":"inline-block font-sans text-xs py-1.5 px-3 mb-4 rounded-lg bg-primary-100 dark:bg-primary-500 text-primary-500 dark:text-white","children":"js"}]}]],["$","h1",null,{"className":"font-heading text-muted-800 dark:text-white font-extrabold text-3xl ltablet:text-4xl lg:text-4xl","children":"Js Unicode 转义"}],["$","p",null,{"className":" font-sans text-base text-muted-500 dark:text-muted-400 max-w-md my-4","style":{"wordBreak":"break-word"},"children":null}],["$","div",null,{"className":"flex items-center justify-start w-full relative","children":[["$","div",null,{"className":"print:invisible","children":["$","$L1f","3",{"href":"/categories/3","name":"技术","iconName":"code"}]}],["$","div",null,{"className":"block ml-auto font-sans text-sm text-muted-400 text-right","children":[["$","div",null,{"children":"更新于 2023-09-27"}],["$","div",null,{"children":["— ",804," 字"]}]]}]]}]]}]}]]}]}]}]}],["$","section",null,{"className":"w-full py-12 px-4 bg-white dark:bg-muted-900","children":["$","div",null,{"className":"w-full max-w-6xl mx-auto","children":["$","div",null,{"className":"w-full flex flex-col lg:flex-row gap-y-8","children":[["$","div",null,{"className":"w-full md:w-2/3 lg:w-3/4 md:mx-auto md:print:w-full","children":["$","div",null,{"className":"w-full md:px-10 text-xl text-muted-800 leading-normal","children":[["$","div",null,{"className":"flex justify-between w-full mb-5 print:hidden","children":[["$","$L20",null,{}],["$","$L21",null,{"post":{"id":121,"content":"$22","type":"normal","excerpt":null,"protected":false,"title":"Js Unicode 转义","slug":null,"toc":null,"meta":null,"created_at":"$D2023-09-27T06:31:59.951Z","updated_at":"$D2023-09-27T06:31:59.951Z","published_at":null,"created_by_id":null,"updated_by_id":null,"cover_image":{"id":5622421,"alt":"Pink chalk drawing on asphalt road","src":{"tiny":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&h=200&w=280","large":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&h=650&w=940","small":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&h=130","medium":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&h=350","large2x":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940","original":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg","portrait":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=1200&w=800","landscape":"https://images.pexels.com/photos/5622421/pexels-photo-5622421.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=627&w=1200"},"url":"https://www.pexels.com/photo/pink-chalk-drawing-on-asphalt-road-5622421/","liked":false,"width":6000,"height":4000,"dataURLs":{"large":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMElEQVR4nGMQFRZtqGuoLK9UV1Zn6GhpvXf7zsc372MiYhk2LV9eUVaRk56jrKAKADpIEKblXDc5AAAAAElFTkSuQmCC","small":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMElEQVR4nGPg5xWoq6mrLK/U0dBh6OnsvHf77sc37wtyChh2rVlbU1VbXFisra4DAD9LETVqFwKtAAAAAElFTkSuQmCC"},"avg_color":"#9A979A","photographer":"Allan Mas","photographer_id":3518065,"photographer_url":"https://www.pexels.com/@allan-mas"},"posts_category_links":[{"id":221,"post_id":121,"category_id":3,"post_order":null,"categories":{"id":3,"name":"技术","meta":{"icon":"code","sortIndex":"7","description":"开发日志"},"created_at":"$D2023-07-05T10:23:36.622Z","updated_at":"$D2023-07-05T10:24:16.649Z","published_at":"$D2023-07-05T10:23:44.543Z","created_by_id":1,"updated_by_id":1}}],"tags_posts_links":[{"id":75,"tag_id":32,"tag_order":null,"post_id":121,"post_order":null,"tags":{"id":32,"name":"js","color":null,"created_at":"$D2023-08-13T09:55:52.681Z","updated_at":"$D2023-08-13T09:56:00.934Z","published_at":"$D2023-08-13T09:56:00.820Z","created_by_id":1,"updated_by_id":1}}],"tags":["$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:post:tags_posts_links:0:tags"],"wordCount":804,"posts":[]},"posts":[{"id":152,"content":"$23","type":"normal","excerpt":null,"protected":false,"title":"DOM 拾遗","slug":null,"toc":null,"meta":null,"created_at":"$D2023-12-07T06:23:04.335Z","updated_at":"$D2024-08-16T01:00:02.684Z","published_at":null,"created_by_id":null,"updated_by_id":null,"cover_image":{"src":{"large":"https://images.pexels.com/photos/11531308/pexels-photo-11531308.jpeg?auto=compress&cs=tinysrgb&h=650&w=940"},"dataURLs":{"blur":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMElEQVR4nGNYP9n3399PBXkF7a0dDI8urQkOjbawcUhIy2SITw1mEOZn0FZjUFUAAG4SDnQOhzbWAAAAAElFTkSuQmCC","small":"$24"}},"posts_category_links":[{"id":291,"post_id":152,"category_id":3,"post_order":null,"categories":{"id":3,"name":"技术","meta":{"icon":"code","sortIndex":"7","description":"开发日志"},"created_at":"$D2023-07-05T10:23:36.622Z","updated_at":"$D2023-07-05T10:24:16.649Z","published_at":"$D2023-07-05T10:23:44.543Z","created_by_id":1,"updated_by_id":1}}],"tags_posts_links":[{"id":121,"tag_id":7,"tag_order":null,"post_id":152,"post_order":null,"tags":{"id":7,"name":"html","color":null,"created_at":"$D2023-04-13T21:54:49.889Z","updated_at":"$D2023-04-13T21:55:58.821Z","published_at":"$D2023-04-13T21:55:58.703Z","created_by_id":1,"updated_by_id":1}},{"id":122,"tag_id":19,"tag_order":null,"post_id":152,"post_order":null,"tags":{"id":19,"name":"DOM","color":null,"created_at":"$D2023-08-01T00:31:58.889Z","updated_at":"$D2023-08-01T11:24:27.999Z","published_at":"$D2023-08-01T11:24:27.899Z","created_by_id":1,"updated_by_id":1}},{"id":123,"tag_id":32,"tag_order":null,"post_id":152,"post_order":null,"tags":{"id":32,"name":"js","color":null,"created_at":"$D2023-08-13T09:55:52.681Z","updated_at":"$D2023-08-13T09:56:00.934Z","published_at":"$D2023-08-13T09:56:00.820Z","created_by_id":1,"updated_by_id":1}}],"tags":["$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:0:tags_posts_links:0:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:0:tags_posts_links:1:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:0:tags_posts_links:2:tags"],"_relevanceScore":30,"url":"$25","blurDataURL":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMElEQVR4nGNYP9n3399PBXkF7a0dDI8urQkOjbawcUhIy2SITw1mEOZn0FZjUFUAAG4SDnQOhzbWAAAAAElFTkSuQmCC"},{"id":221,"content":"$26","type":"normal","excerpt":null,"protected":false,"title":"Markdown 标题转换","slug":null,"toc":null,"meta":null,"created_at":"$D2024-08-07T02:40:00.050Z","updated_at":"$D2024-08-08T08:48:26.248Z","published_at":null,"created_by_id":null,"updated_by_id":null,"cover_image":{"id":6608427,"alt":"Minimalist Image of a Blade of Grass in Snow","src":{"large":"https://images.pexels.com/photos/6608427/pexels-photo-6608427.jpeg?auto=compress&cs=tinysrgb&h=650&w=940"},"url":"https://www.pexels.com/photo/minimalist-image-of-a-blade-of-grass-in-snow-6608427/","liked":false,"width":6720,"height":4480,"dataURLs":{"blur":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMElEQVR4nGPILa8/ef3e+9///aOSGNSNLJPzyo5eueMZGsPAL6XgFRYXl1XEwCUCAHOaD72wU7y/AAAAAElFTkSuQmCC","small":"data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wAARCABkAGQDASIAAhEBAxEB/8QAGgABAQEBAQEBAAAAAAAAAAAAAQACAwQFB//EAC8QAAIBAgUCAwYHAAAAAAAAAAABEQIDBAUSITETQQZhkRQyM0JysVFSY3GhosH/xAAXAQEBAQEAAAAAAAAAAAAAAAAAAQMC/8QAGBEBAQEBAQAAAAAAAAAAAAAAAEERATH/2gAMAwEAAhEDEQA/AP04zLKSg0Z6kx2CC3QRpIGilhLAINU07kkaSCmDMG92ZZFZAXwEFRlojfBBGUKAgNCjxZtcdnJsbcT3pw9x8x8rPTZSpsW6VwqKUvQK6QEIpIIUaRncJA6SDMSy1IYunsDcGXcRh1thG5I5y/xIo6DJgQPNm1CuZNjqPzYa4v6MctudbK8Hd56mHt1etKOt+nqYa7bidduqn1TR4/D1Wrw5lvlhba9KUv8ACVY+hwKZCkVBIjsgIJnOpSbYFGIgoHuQBBFJAImVwaAVyv3Pn5BR0Mnt4edXs9dy1P011JfwfQ7HDB06aLycfHuRH1HPfVjvIbvvAiiozo33NLYgAWBEAMGthIo5PdkddKIDKRoPMpIE5Yb3bq/Wr+50k4Wqa7eIvuql6LlSqT84Sf2Q6segS5WzCAhZGSKEiLzAmBMgEgIgzJSZXAoo0JmSkB0qNnDFOrhpMzIyBoJCSAZKQIgnyRAUMkZkgBkiIIZEiCgSIANLkiAlyPciIrL5AiCBtyREUf/Z"},"avg_color":"#D3DEE5","photographer":"Karolina Kaboompics","photographer_id":2332540,"photographer_url":"https://www.pexels.com/@karolina-grabowska"},"posts_category_links":[{"id":798,"post_id":221,"category_id":3,"post_order":null,"categories":{"id":3,"name":"技术","meta":{"icon":"code","sortIndex":"7","description":"开发日志"},"created_at":"$D2023-07-05T10:23:36.622Z","updated_at":"$D2023-07-05T10:24:16.649Z","published_at":"$D2023-07-05T10:23:44.543Z","created_by_id":1,"updated_by_id":1}}],"tags_posts_links":[{"id":241,"tag_id":27,"tag_order":null,"post_id":221,"post_order":null,"tags":{"id":27,"name":"snippet","color":null,"created_at":"$D2023-08-10T20:06:00.723Z","updated_at":"$D2023-08-10T20:06:00.723Z","published_at":null,"created_by_id":1,"updated_by_id":1}},{"id":242,"tag_id":32,"tag_order":null,"post_id":221,"post_order":null,"tags":{"id":32,"name":"js","color":null,"created_at":"$D2023-08-13T09:55:52.681Z","updated_at":"$D2023-08-13T09:56:00.934Z","published_at":"$D2023-08-13T09:56:00.820Z","created_by_id":1,"updated_by_id":1}},{"id":243,"tag_id":18,"tag_order":null,"post_id":221,"post_order":null,"tags":{"id":18,"name":"正则","color":null,"created_at":"$D2023-08-01T00:05:07.702Z","updated_at":"$D2023-08-01T00:05:07.702Z","published_at":null,"created_by_id":1,"updated_by_id":1}},{"id":244,"tag_id":102,"tag_order":null,"post_id":221,"post_order":null,"tags":{"id":102,"name":"负向先行断言","color":null,"created_at":null,"updated_at":null,"published_at":null,"created_by_id":null,"updated_by_id":null}}],"tags":["$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:1:tags_posts_links:0:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:1:tags_posts_links:1:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:1:tags_posts_links:2:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:1:tags_posts_links:3:tags"],"_relevanceScore":30,"url":"data:image/jpeg;base64,/9j/2wBDAAoHBwgHBgoICAgLCgoLDhgQDg0NDh0VFhEYIx8lJCIfIiEmKzcvJik0KSEiMEExNDk7Pj4+JS5ESUM8SDc9Pjv/2wBDAQoLCw4NDhwQEBw7KCIoOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozv/wAARCABkAGQDASIAAhEBAxEB/8QAGgABAQEBAQEBAAAAAAAAAAAAAQACAwQFB//EAC8QAAIBAgUCAwYHAAAAAAAAAAABEQIDBAUSITETQQZhkRQyM0JysVFSY3GhosH/xAAXAQEBAQEAAAAAAAAAAAAAAAAAAQMC/8QAGBEBAQEBAQAAAAAAAAAAAAAAAEERATH/2gAMAwEAAhEDEQA/AP04zLKSg0Z6kx2CC3QRpIGilhLAINU07kkaSCmDMG92ZZFZAXwEFRlojfBBGUKAgNCjxZtcdnJsbcT3pw9x8x8rPTZSpsW6VwqKUvQK6QEIpIIUaRncJA6SDMSy1IYunsDcGXcRh1thG5I5y/xIo6DJgQPNm1CuZNjqPzYa4v6MctudbK8Hd56mHt1etKOt+nqYa7bidduqn1TR4/D1Wrw5lvlhba9KUv8ACVY+hwKZCkVBIjsgIJnOpSbYFGIgoHuQBBFJAImVwaAVyv3Pn5BR0Mnt4edXs9dy1P011JfwfQ7HDB06aLycfHuRH1HPfVjvIbvvAiiozo33NLYgAWBEAMGthIo5PdkddKIDKRoPMpIE5Yb3bq/Wr+50k4Wqa7eIvuql6LlSqT84Sf2Q6segS5WzCAhZGSKEiLzAmBMgEgIgzJSZXAoo0JmSkB0qNnDFOrhpMzIyBoJCSAZKQIgnyRAUMkZkgBkiIIZEiCgSIANLkiAlyPciIrL5AiCBtyREUf/Z","blurDataURL":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMElEQVR4nGPILa8/ef3e+9///aOSGNSNLJPzyo5eueMZGsPAL6XgFRYXl1XEwCUCAHOaD72wU7y/AAAAAElFTkSuQmCC"},{"id":115,"content":"$27","type":"normal","excerpt":null,"protected":false,"title":"高亮显示 html 元素内的所有数字","slug":null,"toc":null,"meta":null,"created_at":"$D2023-09-21T04:42:31.264Z","updated_at":"$D2024-03-19T14:48:26.298Z","published_at":null,"created_by_id":null,"updated_by_id":null,"cover_image":{"id":9850086,"alt":"Colorful Sewing Threads","src":{"tiny":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&h=200&w=280","large":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg?auto=compress&cs=tinysrgb&h=650&w=940","small":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg?auto=compress&cs=tinysrgb&h=130","medium":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg?auto=compress&cs=tinysrgb&h=350","large2x":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940","original":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg","portrait":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=1200&w=800","landscape":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=627&w=1200"},"url":"https://www.pexels.com/photo/colorful-sewing-threads-9850086/","liked":false,"width":4578,"height":3052,"dataURLs":{"large":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMElEQVR4nGN4c2K5ihjD7t7YmjAdhumloZsmFkeYCs4u9mJQYmLoTLaMtWD4/+M0AChyDuZ9uI8cAAAAAElFTkSuQmCC","small":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMElEQVR4nGP4f2ebPA/D6Tm5EzNtGWZWRBxc0JTsKN+bZssgy8DQmWRV4MH7/9sJAD98D8u/VFPjAAAAAElFTkSuQmCC"},"avg_color":"#86694B","photographer":"Ron Lach","photographer_id":22992178,"photographer_url":"https://www.pexels.com/@ron-lach"},"posts_category_links":[{"id":215,"post_id":115,"category_id":3,"post_order":null,"categories":{"id":3,"name":"技术","meta":{"icon":"code","sortIndex":"7","description":"开发日志"},"created_at":"$D2023-07-05T10:23:36.622Z","updated_at":"$D2023-07-05T10:24:16.649Z","published_at":"$D2023-07-05T10:23:44.543Z","created_by_id":1,"updated_by_id":1}}],"tags_posts_links":[{"id":65,"tag_id":7,"tag_order":null,"post_id":115,"post_order":null,"tags":{"id":7,"name":"html","color":null,"created_at":"$D2023-04-13T21:54:49.889Z","updated_at":"$D2023-04-13T21:55:58.821Z","published_at":"$D2023-04-13T21:55:58.703Z","created_by_id":1,"updated_by_id":1}},{"id":66,"tag_id":19,"tag_order":null,"post_id":115,"post_order":null,"tags":{"id":19,"name":"DOM","color":null,"created_at":"$D2023-08-01T00:31:58.889Z","updated_at":"$D2023-08-01T11:24:27.999Z","published_at":"$D2023-08-01T11:24:27.899Z","created_by_id":1,"updated_by_id":1}},{"id":67,"tag_id":32,"tag_order":null,"post_id":115,"post_order":null,"tags":{"id":32,"name":"js","color":null,"created_at":"$D2023-08-13T09:55:52.681Z","updated_at":"$D2023-08-13T09:56:00.934Z","published_at":"$D2023-08-13T09:56:00.820Z","created_by_id":1,"updated_by_id":1}}],"tags":["$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:2:tags_posts_links:0:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:2:tags_posts_links:1:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:2:tags_posts_links:2:tags"],"_relevanceScore":30,"url":"https://images.pexels.com/photos/9850086/pexels-photo-9850086.jpeg?auto=compress&cs=tinysrgb&h=130","blurDataURL":"$undefined"},{"id":151,"content":"IPv4-mapped IPv6地址。它是一种特殊的IPv6地址表示法，用于将IPv4地址映射到IPv6地址空间中。IPv4-mapped IPv6地址由前缀\"::ffff:\"加上IPv4地址的点分十进制表示组成。它的作用是在IPv6环境中兼容处理IPv4地址。例如，\"::ffff:172.186.1.165\"表示的是IPv4地址172.186.1.165在IPv6环境中的映射。这种格式的地址通常用于IPv6和IPv4之间的转换和兼容性支持。\r\n\r\n\r\n当一个格式化 IPv6 地址并提取其中的 IPv4 地址的TypeScript 示例程序：\r\n\r\n```typescript\r\nfunction formatIPv6Address(ipv6Address: string): string {\r\n // 检查是否为 IPv4-mapped IPv6 地址\r\n if (ipv6Address.startsWith('::ffff:')) {\r\n // 提取 IPv4 地址部分\r\n const ipv4Address = ipv6Address.slice(7);\r\n return ipv4Address;\r\n }\r\n\r\n // 如果不是 IPv4-mapped IPv6 地址，则返回原始 IPv6 地址\r\n return ipv6Address;\r\n}\r\n\r\n// 测试示例\r\nconst ipv6Address1 = '::ffff:172.186.1.165';\r\nconst ipv6Address2 = '2001:0db8:85a3:0000:0000:8a2e:0370:7334';\r\n\r\nconst formattedAddress1 = formatIPv6Address(ipv6Address1);\r\nconst formattedAddress2 = formatIPv6Address(ipv6Address2);\r\n\r\nconsole.log(formattedAddress1); // 输出：172.186.1.165\r\nconsole.log(formattedAddress2); // 输出：2001:0db8:85a3:0000:0000:8a2e:0370:7334\r\n```","type":"normal","excerpt":null,"protected":false,"title":"IPv4-mapped IPv6","slug":null,"toc":null,"meta":null,"created_at":"$D2023-12-07T06:16:50.609Z","updated_at":"$D2023-12-07T14:38:00.000Z","published_at":null,"created_by_id":null,"updated_by_id":null,"cover_image":{"id":4792072,"alt":"Soft blue crocheted animal toy near hook and yarns on cozy sofa at home","src":{"tiny":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&h=200&w=280","large":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg?auto=compress&cs=tinysrgb&h=650&w=940","small":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg?auto=compress&cs=tinysrgb&h=130","medium":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg?auto=compress&cs=tinysrgb&h=350","large2x":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940","original":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg","portrait":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=1200&w=800","landscape":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=627&w=1200"},"url":"https://www.pexels.com/photo/knitted-toy-near-yarns-and-needle-4792072/","liked":false,"width":6016,"height":4016,"dataURLs":{"large":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMklEQVR4nAEnANj/ALu5uDUnIrunpNDMzwBXTkoXAAC/wc3q//8APTYyd3Z1ytLY1NfadKYUV746wSAAAAAASUVORK5CYII=","small":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMklEQVR4nAEnANj/AL67uTgpJLWjns3KywBdVVAYAAC3ucHp/v8ARD05dXJwzdXa0dPWc/sUSC9an/cAAAAASUVORK5CYII="},"avg_color":"#7B7978","photographer":"Anete Lusina","photographer_id":2202476,"photographer_url":"https://www.pexels.com/@anete-lusina"},"posts_category_links":[{"id":290,"post_id":151,"category_id":3,"post_order":null,"categories":{"id":3,"name":"技术","meta":{"icon":"code","sortIndex":"7","description":"开发日志"},"created_at":"$D2023-07-05T10:23:36.622Z","updated_at":"$D2023-07-05T10:24:16.649Z","published_at":"$D2023-07-05T10:23:44.543Z","created_by_id":1,"updated_by_id":1}}],"tags_posts_links":[{"id":118,"tag_id":7,"tag_order":null,"post_id":151,"post_order":null,"tags":{"id":7,"name":"html","color":null,"created_at":"$D2023-04-13T21:54:49.889Z","updated_at":"$D2023-04-13T21:55:58.821Z","published_at":"$D2023-04-13T21:55:58.703Z","created_by_id":1,"updated_by_id":1}},{"id":119,"tag_id":19,"tag_order":null,"post_id":151,"post_order":null,"tags":{"id":19,"name":"DOM","color":null,"created_at":"$D2023-08-01T00:31:58.889Z","updated_at":"$D2023-08-01T11:24:27.999Z","published_at":"$D2023-08-01T11:24:27.899Z","created_by_id":1,"updated_by_id":1}},{"id":120,"tag_id":32,"tag_order":null,"post_id":151,"post_order":null,"tags":{"id":32,"name":"js","color":null,"created_at":"$D2023-08-13T09:55:52.681Z","updated_at":"$D2023-08-13T09:56:00.934Z","published_at":"$D2023-08-13T09:56:00.820Z","created_by_id":1,"updated_by_id":1}}],"tags":["$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:3:tags_posts_links:0:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:3:tags_posts_links:1:tags","$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:3:tags_posts_links:2:tags"],"_relevanceScore":30,"url":"https://images.pexels.com/photos/4792072/pexels-photo-4792072.jpeg?auto=compress&cs=tinysrgb&h=130","blurDataURL":"$undefined"},{"id":64,"content":"$28","type":"normal","excerpt":null,"protected":false,"title":"js 拾遗","slug":null,"toc":null,"meta":null,"created_at":"$D2023-07-24T17:39:00.034Z","updated_at":"$D2023-12-07T02:04:03.614Z","published_at":"$D2023-07-24T17:44:33.928Z","created_by_id":1,"updated_by_id":1,"cover_image":{"id":4792059,"alt":"Pink yarn for knitting on sofa","src":{"tiny":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&h=200&w=280","large":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg?auto=compress&cs=tinysrgb&h=650&w=940","small":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg?auto=compress&cs=tinysrgb&h=130","medium":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg?auto=compress&cs=tinysrgb&h=350","large2x":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940","original":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg","portrait":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=1200&w=800","landscape":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=627&w=1200"},"url":"https://www.pexels.com/photo/pink-yarn-for-knitting-on-sofa-4792059/","liked":false,"width":6016,"height":4016,"dataURLs":{"large":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMklEQVR4nAEnANj/AGZ4fW6Bg1Jla1JMRwDY0tP/+PezqKhLUFQAvaOi07u2gGVlAAYIegQS0Cd/7HgAAAAASUVORK5CYII=","small":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAMklEQVR4nAEnANj/AGR3fWt/glNlaE9KRgDW09T/+/y3ra1OVFUAvqWjzra0hmtpAAYKehMS58PMqO8AAAAASUVORK5CYII="},"avg_color":"#696667","photographer":"Anete Lusina","photographer_id":2202476,"photographer_url":"https://www.pexels.com/@anete-lusina"},"posts_category_links":[{"id":160,"post_id":64,"category_id":3,"post_order":null,"categories":{"id":3,"name":"技术","meta":{"icon":"code","sortIndex":"7","description":"开发日志"},"created_at":"$D2023-07-05T10:23:36.622Z","updated_at":"$D2023-07-05T10:24:16.649Z","published_at":"$D2023-07-05T10:23:44.543Z","created_by_id":1,"updated_by_id":1}}],"tags_posts_links":[{"id":39,"tag_id":32,"tag_order":1,"post_id":64,"post_order":0,"tags":{"id":32,"name":"js","color":null,"created_at":"$D2023-08-13T09:55:52.681Z","updated_at":"$D2023-08-13T09:56:00.934Z","published_at":"$D2023-08-13T09:56:00.820Z","created_by_id":1,"updated_by_id":1}}],"tags":["$1c:1:props:children:props:children:props:children:0:props:children:props:children:0:props:children:1:props:posts:4:tags_posts_links:0:tags"],"_relevanceScore":30,"url":"https://images.pexels.com/photos/4792059/pexels-photo-4792059.jpeg?auto=compress&cs=tinysrgb&h=130","blurDataURL":"$undefined"}],"toc":[]}]]}],false,false,"$L29","$L2a"]}]}],"$L2b"]}]}]}]] 1d:["$","footer",null,{"className":"group relative bg-muted-50 dark:bg-muted-800 text-muted-600 body-font overflow-hidden","children":[["$","div",null,{"className":"relative w-full max-w-7xl px-5 py-24 mx-auto ","children":["$","div",null,{"className":"flex flex-col ptablet:flex-row ltablet:flex-row lg:flex-row gap-6 ptablet:gap-0 ltablet:gap-0 lg:gap-0 flex-wrap md:text-left text-center -mb-10 -mx-4","children":[["$","div",null,{"className":"w-full ptablet:w-1/2 ltablet:w-1/4 lg:w-1/4 flex-shrink-0 md:mx-0 mx-auto text-center md:text-left px-4","children":[["$","a",null,{"className":"flex flex-col md:flex-row gap-3 title-font font-medium items-center md:justify-start justify-center text-muted-800 dark:text-white","children":[["$","img",null,{"className":"h-12","src":"/favicon.svg","alt":"dors logo","width":"48","height":"48"}],["$","span",null,{"className":"font-heading font-bold text-2xl","children":"Dors"}]]}],["$","p",null,{"className":"font-sans text-sm w-full max-w-xs mx-auto md:max-w-[220px] md:mx-0 mt-2 text-muted-500 dark:text-muted-400","children":"Dors 是花野猫开发为知识工作者打造的数字花园应用，包含的博客、个人记事本、及其他实用功能。"}]]}],[["$","div","garden",{"className":"w-full ptablet:w-1/2 ltablet:w-1/4 lg:w-1/4 px-4","children":[["$","h2",null,{"className":"font-heading font-semibold text-muted-800 dark:text-white tracking-widest text-sm mb-3","children":"花园"}],["$","ul",null,{"className":"font-sans list-none space-y-2 mb-10","children":[["$","li","posts",{"children":["$","a",null,{"href":"/posts","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","children":"花坛——博客"}]}],["$","li","books",{"children":["$","a",null,{"href":"/books","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","children":"果园——知识库"}]}]]}]]}],["$","div","workshop",{"className":"w-full ptablet:w-1/2 ltablet:w-1/4 lg:w-1/4 px-4","children":[["$","h2",null,{"className":"font-heading font-semibold text-muted-800 dark:text-white tracking-widest text-sm mb-3","children":"工坊——作者开发的实用工具"}],["$","ul",null,{"className":"font-sans list-none space-y-2 mb-10","children":[["$","li","notes",{"children":["$","a",null,{"href":"/notes","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","children":"小记"}]}],["$","li","split-v",{"children":["$","a",null,{"href":"https://split-v.utities.online/","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","target":"_blank","rel":"noopener noreferrer","children":"秒切——一键按秒分割视频"}]}],["$","li","uni",{"children":["$","a",null,{"href":"https://uni.utities.online/","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","target":"_blank","rel":"noopener noreferrer","children":"中国重点高校地理位置可视化网站"}]}],["$","li","aparecium",{"children":["$","a",null,{"href":"https://aparecium.huayemao.run/","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","target":"_blank","rel":"noopener noreferrer","children":"中国行政区划数据查询平台"}]}],["$","li","excel-renamer",{"children":["$","a",null,{"href":"/excel-renamer","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","children":"excel 重命名工具"}]}]]}]]}],["$","div","misc",{"className":"w-full ptablet:w-1/2 ltablet:w-1/4 lg:w-1/4 px-4","children":[["$","h2",null,{"className":"font-heading font-semibold text-muted-800 dark:text-white tracking-widest text-sm mb-3","children":"misc"}],["$","ul",null,{"className":"font-sans list-none space-y-2 mb-10","children":[["$","li","rules",{"children":["$","a",null,{"href":"/rules-to-save-my-life","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","children":"生活章程"}]}],["$","li","aigc",{"children":["$","a",null,{"href":"/aigc","className":"text-muted-600 dark:text-muted-400 hover:text-primary-500 dark:hover:text-primary-500","children":"画廊"}]}],"$L2c"]}]]}]]]}]}],"$L2d"]}]

Js Unicode 转义

相关内容

DOM 拾遗

相关内容

DOM 拾遗

Markdown 标题转换

高亮显示 html 元素内的所有数字

IPv4-mapped IPv6

js 拾遗

Markdown 标题转换

高亮显示 html 元素内的所有数字

IPv4-mapped IPv6

js 拾遗