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

刷题 | 牛客 - js中等10题（更ing）1/54知识点解答

article 2026/1/19 16:14:13

知识点汇总：

Array.from(要转换的对象, [mapFn], [thisArg ])：将类数组对象（Array-like）/可迭代对象（Iterable）转为真正的数组。

第二参 mapFn 是类似 Array.prototype.map 的回调函数，加工每一项；第三参，是执行 mapFn 时的 this 指向。

用途：① 将类数组对象、字符串、arguments 转为数组对象；② 给mapFn（第二个参回调函数）做转换；③ 创建指定长度的新数组（Array.from({ length: 5 }, (_, i) => i + 1);）（用于快速创建包含连续数字的数组）

类数组对象，如 document.querySelectorAll(' ')、arguments

sort排序：

array.sort((a, b) => {
return a - b; // 数值从小到大排。返回-1，a 在 b前面；返回1，a 在 b 后面。
});

等价于

array.sort((a,b) => {
return a > b ? 1 : -1;
})

arr.sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase())); 字符串排序（不分大小写）。

array.sort((a, b) => a.id.localeCompare(b.id)); 用 localeCompare（字符串排序）

arr.sort().reverse(); 倒序排列：先正序，再反转。

element.outerHTML：获取/设置 元素本身连同内容/整个元素本身（含自身标签） 的 HTML 字符串。用新的 html 字符串替换整个元素本身（含标签）

element.innerHTML：获取/设置 元素内部内容 的 HTML 字符串（不包括自身标签）。（用新的html字符串替换掉元素的内部内容）

按 id 查找：document.getElementById('xx').children;

按元素查找：document.querySelectorAll('xx')

★ JS0 列表内容排序再渲染

描述

场景描述：在一个 HTML 页面中，有一个无序列表（ul），其中包含了一些项目（li）。每个项目都有一个文本内容和一个唯一的 ID。你需要编写一个 JavaScript 函数来提取列表中所有项目的文本内容，并将它们按照 ID 进行排序，然后将排序后的文本内容重新渲染回去。

代码实现：补全sortAndReturnTextContent函数，实现功能

运行sortAndReturnTextContent函数前

运行sortAndReturnTextContent函数后

解答：

★ 法一：Array.from() 类数组转数组 + sort((a,b) => a>b?1:-1) 排序 + innerHTML/outerHTML 写成html

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"></head><body><ul id="myList"><li id="item1">项目 1</li><li id="item3">项目 3</li><li id="item2">项目 2</li><li id="item4">项目 4</li></ul><script>function sortAndReturnTextContent() {const items = document.getElementById('myList').children;// 在此补全代码const itemsArr = Array.from(items).sort((a,b) => {return a.id > b.id ? 1 : -1;})document.getElementById('myList').innerHTML = itemsArr.map(item => item.outerHTML);}sortAndReturnTextContent()</script>

详解：
const items = document.getElementById('myList').children;
document.getElementById('myList')：获取 <ul id="myList"> 元素。

.children：获取该元素的所有子元素（即所有 <li> 元素），类型是 HTMLCollection，不是数组。

📝 注意：HTMLCollection 是类数组结构，不能直接使用数组的方法（如 .sort()）。
const itemsArr = Array.from(items).sort((a,b) => {return a.id > b.id ? 1 : -1;
})
Array.from(items)：将类数组的 HTMLCollection / 可迭代的对象 Iterable 转换为真正的数组。（可选：第二个参数是类似 Array.prototype.map 的回调，第三个参数是执行函数时的 this指向）

.sort(...)：对数组进行排序。

(a, b) => a.id > b.id ? 1 : -1：

比较两个元素 a 和 b 的 id 字符串。

如果 a.id > b.id，说明 a 应该排在后面，返回 1。

否则返回 -1，说明 a 应该排在前面。

这样实现了按 字典序升序排序。

知识点：

Array.from() ：将类数组对象（Array-like）/可迭代对象（Iterable）转为真正的数组。 | 或创建指定长度的新数组

（真正的数组，即可以使用数组的方法，如.map()、.filter()、sore()等）

语法：
Array.from(arrayLike, mapFn, thisArg)
参数：
arrayLike   必需，要转换的类数组或可迭代对象。
mapFn   可选，类似 Array.prototype.map 的回调函数，用于加工每一项。
thisArg   可选，执行 mapFn 时的 this 指向。

Array.from 的常见用例

总结：① 将类数组对象、字符串、arguments 转为数组对象；② 给mapFn做转换（第二个回调函数进行处理）；③ 创建指定长度的新数组（Array.from({ length: 5 }, (_, i) => i + 1);）（用于快速创建包含连续数字的数组）

类数组对象，如 document.querySelectorAll(' ')、arguments

1️⃣ 把类数组对象转为数组
const divs = document.querySelectorAll('div');  // NodeList，不是真正的数组
const arr = Array.from(divs);  // 变成数组，可以用 map、filter 等
console.log(Array.isArray(arr));  // true
2️⃣ 把字符串变成字符数组
const str = "hello";
const chars = Array.from(str);  // ['h', 'e', 'l', 'l', 'o']
3️⃣ 搭配 mapFn 做转换

const nums = Array.from([1, 2, 3], x => x * 2); // [2, 4, 6]

相当于：

[1, 2, 3].map(x => x * 2)

4️⃣ 从 arguments 转数组
function test() {const args = Array.from(arguments);console.log(args); // 类数组 → 真数组
}
test(1, 2, 3);
5️⃣ 创建指定长度的新数组（结合 mapFn）
const arr = Array.from({ length: 5 }, (_, i) => i + 1); // [1, 2, 3, 4, 5]
总结：用来快速创建包含连续数字的数组

注：

{ length: 5 }，是一个对象，表示一个伪数组（只定义了 length 为 5）。Array.from() 会根据这个长度创建一个包含 5 个元素的数组，初始值为 undefined。

(_, i) => i + 1，是映射函数：

_ ：表示当前元素的值（此处用不到，所以用 _ 忽略）。

i：表示当前元素的索引（从 0 到 4）。

函数的返回值是 i + 1，也就是将索引加 1。

即，对于长度为 5 的伪数组，它的索引分别是 0、1、2、3、4。

将 i + 1 映射到每个索引，就得到：[0+1, 1+1, 2+1, 3+1, 4+1] => [1, 2, 3, 4, 5]

Array.sort([ ... ]) 排序算法

用法：

arr.sort((a, b) => {return a - b;    // 数值从小到大排。返回-1，a 在 b前面；返回1，a 在 b 后面。
});

// 字符串排序（不分大小写）
words. Sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()));    // localeCompare字符串排序。// 倒序排列
arr.sort().reverse(); // 先正序，再反转

✅ 为什么返回 1 表示 a 在后？

这是浏览器或引擎内部排序算法规定的：

返回值为负数 -1：a < b → a 在前，b 在后

返回值为正数 1：a > b → a 在后，b 在前

返回值为 0：a 与 b 相等，位置不变

排序算法（内部实现）：—— JavaScript 引擎会根据不同场景使用不同排序算法（如 V8）：

引擎排序算法
Chrome/V8 插入排序 + 快排
Firefox Merge Sort（归并）

⚠️ 不同浏览器实现不同，但基本都遵循“稳定排序”和性能优化。

引擎	排序算法
Chrome/V8	插入排序 + 快排
Firefox	Merge Sort（归并）

🚩小技巧：用 localeCompare（字符串排序）—— array.sort((a, b) => a.id.localeCompare(b.id));

array.sort((a, b) => a.id.localeCompare(b.id));

这句也可以实现按字符串 id 从小到大排序。

Array.map( ) 对数组的每一项进行操作，返回一个新的数组。

innerHTML 和 outerHTML

element.innerHTML：读取时：返回该元素“内部”的 HTML 字符串。赋值时：用新的 HTML 字符串替换掉“元素的内部内容”。

element.outerHTML：读取时：返回“整个元素本身（包括自身标签）”的 HTML 字符串。赋值时：用新的 HTML 字符串，替换整个元素本身（含标签）

属性作用描述
outerHTML 获取/设置 元素本身连同内容 的 HTML 字符串
innerHTML 获取/设置 元素内部内容 的 HTML 字符串（不包括自身标签）

🆚 innerHTML vs outerHTML 区别对比：

功能 innerHTML outerHTML
获取内容返回“子元素+文本”的 HTML 返回“整个元素+子元素”的 HTML
设置内容替换“元素的内部内容” 替换“整个元素本身（含标签）”
用途常用于更新内容块 常用于整体替换节点

属性	作用描述
`outerHTML`	获取/设置元素本身连同内容的 HTML 字符串
`innerHTML`	获取/设置元素内部内容的 HTML 字符串（不包括自身标签）

功能	innerHTML	outerHTML
获取内容	返回“子元素+文本”的 HTML	返回“整个元素+子元素”的 HTML
设置内容	替换“元素的内部内容”	替换“整个元素本身（含标签）”
用途	常用于更新内容块	常用于整体替换节点

安全性问题（XSS），二者都可以插入可执行的脚本，在处理用户输入时，推荐使用 DOM API 手动创建元素节点

查找dom元素

按 id 查找：document.getElementById('xx').children;

按元素查找：document.querySelectorAll('xx')

JS1 直角三角形

描述

请补全JavaScript代码，要求在页面上渲染出一个直角三角形，三角形换行要求使用"br"实现。三角形如下：
*
**
***

解答

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"></head><body><div class='triangle'></div><script>var triangle = document.querySelector('.triangle');// 补全代码let result = ''let str = '';for(let i = 0;i < 3;i++){str += '*';result += str + '<br />';}triangle.innerHTML = result;</script></body>
</html>

知识点

`document.querySelector('.triangle')`

用于获取 HTML 中类名为 triangle 的元素。
返回的是第一个匹配该选择器的元素。

`innerHTML`

将 HTML 字符串设置为元素的内容。
使用 <br /> 可以产生换行效果。（在<br /> 是 HTML 标签，赋值给 innerHTML 时，没加引号，会被识别为未定义变量或语法错误。——》triangle.innerHTML = str + '<br />';）
最好一次性赋值，否则会影响性能。

JS2 文件扩展名

描述

请补全JavaScript代码，要求以字符串的形式返回文件名扩展名，文件名参数为"filename"。

解答

            const _getExFilename = (filename) => {// 补全代码const fileArr = filename.split('.');// return '.' + fileArr[1];   //问题：假设不止一个点，可能存在问题 return '.' + fileArr[fileArr.length - 1]       }

知识点

数组.split('分隔符')，按分隔符对字符串进行分割成数组

JS3 分隔符

描述

请补全JavaScript代码，要求返回参数数字的千分位分隔符字符串。

示例1

输入：

_comma(12300)

输出：

'12,300'

解答

            function _comma(number) {let str = number.toString();return  str.replace(/(\d)(?=(?:\d{3})+$)/g, '$1,');}

详解：


这是核心部分，使用正则表达式 + `replace` 方法来插入逗号。---### 🧠 正则详解：`/(\d)(?=(?:\d{3})+$)/g`#### 1. **`(\d)`**
表示“一个数字”，并捕获这个数字（用括号捕获方便后续引用）。#### 2. **`(?=...)`**：正向肯定预查（lookahead）
意思是：只匹配**后面**满足某种条件的内容，但**不消耗字符**（只判断后面是否满足，不包括在结果中）。#### 3. **`(?:\d{3})+`**
这是一个非捕获组，表示“每组三位数字”，比如 `456`, `789` 之类的。#### 4. **`$`**
表示字符串末尾，所以正则的意思是：这个数字后面跟着一组或多组完整的三位数字，并且是直到字符串末尾。#### 5. **组合解释：`(\d)(?=(?:\d{3})+$)`**
匹配一个数字，**它的后面必须是若干组三位数，并且一直到末尾为止**。  
比如：- "1**234567**" → `1` 后面是 `234567`，可分成 2 组三位：✅
- "12**34567**" → `2` 后面是 `34567`，5 位，不是完整的三组：❌#### 6. **`g`**
全局匹配，匹配所有符合条件的位置，而不只是第一个。---### 💥 替换部分：`'$1,'`- `$1` 是对捕获组 `(\d)` 的引用，也就是前面匹配到的那个数字。
- `'$1,'` 表示用“这个数字+一个逗号”替换原始字符。---### 🔄 举个例子：`_comma(1234567)`- 转成字符串后：`"1234567"`
- 正则将匹配以下位置：- `1` → 后面是 `234567`，可以分两组三位 → ✅- `2` → 后面是 `34567`，不满三组 → ❌- `3` → 后面是 `4567`，也不满 → ❌- `4` → 后面是 `567`，正好一组 → ✅匹配到的数字是 `1` 和 `4`，于是：

知识点

刷题 | 牛客 - js中等10题（更ing）1/54知识点解答

知识点汇总： Array.from(要转换的对象, [mapFn], [thisArg ])：将类数组对象（Array-like）/可迭代对象（Iterable）转为真正的数组。第二参 mapFn 是类似 Array.prototype.map 的回调函数，加工…...

编程日记 2025/12/22 20:43:35

Ubuntu 20.04.6编译安装COMFAST CF-AX90无线网卡驱动

目录 0 前言 1 CF-AX90无线网卡驱动 1.1 驱动下载 1.2 驱动准备 2 编译安装驱动 2.1 拷贝驱动依赖到系统 2.2 驱动安装编译 3 重启 0 前言 COMFAST CF-AX90或者说AIC8800D80的Linux版本驱动不支持高版本的linux内核，实测目前仅支持最高5.15的内核。Ubuntu2…...

编程日记 2025/12/22 23:13:46

将python项目打包成Windows后台服务

前文，我开发了一个基于windows11与本地deepseek实现的语音助手，之前是通过CMD直接执行项目的main.py文件。但是这样不适合移植，现在想将其生成一个exe文件，以及部署成windows的后台服务。关于语音助手的开发与发布，可以看的CSDN文章：一个基于windows11与本地deepseek实…...

编程日记 2025/12/2 4:49:59

PPT无法编辑怎么办？原因及解决方法全解析

在日常办公中，我们经常会遇到需要编辑PPT的情况。然而，有时我们会发现PPT文件无法编辑，这可能由多种原因引起。今天我们来看看PPT无法编辑的几种常见原因，并提供实用的解决方法，帮助你轻松应对。原因1：文…...

编程日记 2026/1/12 10:30:18

安全用电基础知识及隐患排查重点

安全用电是电气安全的一个重要方面，作为普通人员，必须学会基础的用电知识和技巧，才能保障自己和家庭的安全。以下是安全用电的基础知识及隐患排查重点： 一、基础知识 1.电压：单位为伏特（V）&a…...

编程日记 2026/1/15 9:08:30

Laravel 使用通义灵码 - AI 辅助开发提升效率

一、引言 Laravel 是 PHP 常用的一种后端开发框架，遵循 MVC（模型 - 视图 - 控制器）架构，以简洁、优雅的语法和强大的功能著称，旨在提升开发效率并简化复杂任务的实现。然而，它的开发习惯可能与传统的 PHP …...

编程日记 2026/1/7 4:51:23

签到功能---实现签到接口

文章目录概要整体架构流程技术细节小结概要需求分析以及接口设计由KEY的结构可知，要签到，就必须知道是谁在哪一天签到，也就是两个信息： 当前用户当前时间这两个信息我们都可以自己获取，因此签到时&#xff…...

编程日记 2025/12/23 0:20:05

JavaScript爬虫基础篇：HTTP 请求与响应

在互联网的世界里，数据无处不在。无论是新闻资讯、商品信息，还是社交媒体动态，这些数据都以各种形式存储在服务器上。而爬虫，就是我们获取这些数据的得力助手。今天，我们就来聊聊爬虫的基础——HTTP 请求与响应&#x…...

编程日记 2025/12/24 5:47:21

Python中的count()方法

文章目录 Python中的count()方法基本语法在不同数据类型中的使用1. 列表(List)中的count()2. 元组(Tuple)中的count()3. 字符串(String)中的count() 高级用法1. 指定搜索范围2. 统计复杂元素注意事项 Python中的count()方法前言：count()是Python中用于序列类型&a…...

编程日记 2025/12/5 2:27:14

LWIP_MQTT连接ONENET

前言： 使用正点原子STM32F407, LWIP,MQTT demo,验证LwIP的MQTT连接ONENET物联网平台,测试整个链路是否畅通，后面再详细分析LWIP移植和MQTT协议的使用。 26 基于 MQTT 协议连接 OneNET 服务器本章主要介绍 lwIP 如何通过 MQTT 协议将设备连接到 OneNET…...

编程日记 2025/12/22 20:00:41

代码随想录刷题|Day20（组合总数，组合总数2、分割回文串）

回溯算法 Part02 组合总数力扣题目链接代码随想录链接视频讲解题目描述： 给你一个无重复元素的整数数组 candidates 和一个目标整数 target ，找出 candidates 中可以使数字和为目标数 target 的所有不同组合 ，并以列表形式返回。你…...

编程日记 2026/1/18 13:24:54

文件描述符（File Descriptor, FD）详解及利用方法

文件描述符（FD）是 Linux/Unix 系统中用于访问文件、管道、套接字等 I/O 资源的整数标识符。每个进程默认打开 3 个标准文件描述符： FD名称默认绑定设备用途0stdin键盘标准输入（读取数据）1stdout终端屏幕标准输出&…...

编程日记 2026/1/15 21:24:22

Minecraft盔甲机制详解（1.9之后）

Minecraft的盔甲有很多种，但是评判盔甲的好坏，通常玩家会使用一个变量来评判——护甲值护甲值的机制很简单，一格护甲值 （半个灰色的衣服图标）最多能提供4%的防御护甲值在不开作弊的生存模式理论上限是20点&#xf…...

编程日记 2025/12/2 0:51:36

ArcGIS Desktop使用入门（四）——9版本与10版本区别

系列文章目录 ArcGIS Desktop使用入门（一）软件初认识 ArcGIS Desktop使用入门（二）常用工具条——标准工具 ArcGIS Desktop使用入门（二）常用工具条——编辑器 ArcGIS Desktop使用入门（二&#x…...

编程日记 2026/1/16 13:34:15

R语言之环境清理

有时候 R 环境中残留的变量可能会导致警告，可以尝试清理工作空间并重新加载数据。警告信息: In mget(objectNames, envir ns, inherits TRUE) : 重新评估被中断的许诺 # 观察前6行 head(iris)# 观察数据结构 str(iris)# 探知数据的极值和分位数，以及…...

编程日记 2026/1/7 7:01:51

javaSE————网络编程套接字

网络编程套接字~~~~~ 好久没更新啦，蓝桥杯爆掉了，从今天开始爆更嗷； 1，网络编程基础为啥要有网络编程呢，我们进行网络通信就是为了获取丰富的网络资源，说实话真的很神奇，想想我们躺在床上&a…...

编程日记 2026/1/8 2:08:53

FreeRTOS二值信号量详解与实战教程

FreeRTOS二值信号量详解与实战教程 📚 作者推荐：想系统学习FreeRTOS嵌入式开发？请访问我的FreeRTOS开源学习库，内含从入门到精通的完整教程和实例代码！ 1. 二值信号量核心概念解析二值信号量(Binary Semaphore)是Fre…...

编程日记 2025/12/31 16:02:50

Java命名规则

在 Java 项目中，命名规则遵循一定的约定俗成规范，目的是提高代码可读性和团队协作效率。以下是 Java 项目命名的核心规则和常见实践： 一、项目整体命名项目名使用小写字母短横线（kebab-case&#xff09…...

编程日记 2025/12/1 9:28:40

赛灵思 XCVU440-2FLGA2892E XilinxFPGA Virtex UltraScale

XCVU440-2FLGA2892E 属于 Xilinx Virtex UltraScale 系列，是面向高端应用的旗舰 FPGA 器件。该系列产品以出色的高并行处理能力、丰富的逻辑资源和高速互联能力闻名，广泛用于高性能计算、数字信号处理等对计算能力和带宽要求极高的场景。采用先进的 20n…...

编程日记 2025/12/21 10:58:55

Spring Cloud Alibaba微服务-微服务介绍和搭建

1. 课程介绍单体服务中有订单，用户，库存， 两个缺陷： a. 是以应用的维度进行负载均衡，资源占用大 b. 当其中一个模块宕机，整个应用就不能用了； nacos；ribbon，loadBa…...

编程日记 2026/1/8 14:00:54

KALI安装JAVA8和切换JDK版本

一、安装JDK1.8 1、直接使用下面的地址下载java 1.8： https://repo.huaweicloud.com/java/jdk/8u202-b08/jdk-8u202-linux-x64.tar.gz 2、建立目录，将下载的jdk的安装包复制过去并进行解压 sudo mkdir -p /usr/local/java cp jdk-8u202-linux-x64.t…...

编程日记 2026/1/8 18:56:13

C语言中冒泡排序和快速排序的区别

冒泡排序和快速排序都是常见的排序算法，但它们在原理、效率和应用场景等方面存在显著区别。以下是两者的详细对比： 一、算法原理 1. 冒泡排序原理：通过重复遍历数组，比较相邻元素的大小，并在必要时交换它们的位置。…...

编程日记 2025/12/4 15:47:35

今日行情明日机会——20250417

指数目前在区间内缩量震荡 2025年4月17日涨停主要行业方向分析一、核心主线方向化工（产能优化涨价预期） • 涨停家数：11家（最强方向）。 • 代表标的： ◦ 红宝丽（2连板）&#xff…...

编程日记 2025/12/21 11:02:03

C# 对列表中的元素的多个属性进行排序

目录前言一、OrderBy、OrderByDescending、ThenBy、ThenByDescending二、Sort 前言在开发过程中，我们经常需要根据列表中的元素的某个属性进行排序，下面我们将简单介绍常用的排序函数。例如此处有一个类，拥有的元素为编号和值 public …...

编程日记 2025/12/1 20:10:21

QML 信号与槽

QML 信号与槽 QML 是 Qt 框架中用于构建现代化、流畅用户界面的声明式语言，其信号与槽（Signals and Slots）机制是实现组件间通信和交互的核心特性。与 C 的信号与槽类似，QML 的信号与槽提供了一种松耦合的方式，允许界…...

编程日记 2025/12/1 9:57:21

一篇讲完自动化测试基础-Python【万字详细讲解】12

✨博客主页： https://blog.csdn.net/m0_63815035?typeblog 💗《博客内容》：.NET、Java.测试开发、Python、Android、Go、Node、Android前端小程序等相关领域知识 📢博客专栏： https://blog.csdn.net/m0_63815035/cat…...

编程日记 2025/12/22 20:40:42

极限编程（XP）简介及其价值观与最佳实践

目录一、什么是极限编程（XP）二、极限编程的核心价值观1. 沟通2. 简单3. 反馈4. 勇气三、极限编程的12个最佳实践1. 结对编程2. 40小时工作制3. 简单设计4. 代码规范5. 测试驱动开发（TDD）6. 系统隐喻7. 持续集成8. 重构9. 客户在…...

编程日记 2025/12/22 20:42:57

四层板的蛇形走线技巧：原理、策略与应用

在四层板的设计过程中，蛇形走线是一种常见且重要的布线方式。它能够满足特定的设计需求，如调整信号线长度、实现等长布线等，但如果使用不当，也可能会带来一些负面影响，如增加信号衰减、引入电磁干扰等。以下将详细探讨…...

编程日记 2025/12/22 20:44:11

面向对象—有理数类的设计

目录 1.代码呈现 1.1编写toString、equals方法 1.2测试代码 1.3有理数类的代码 2.论述题 3.有理类设计 1.代码呈现 1.1编写toString、equals方法 (1)toString方法 Overridepublic String toString(){if(this.v20){return "Undefined";}return this.v1 "/…...

编程日记 2025/12/22 22:12:35

408数据结构绪论刷题001

答案：D 解析： • A选项：数据元素是组成数据对象的基本单位 ，它只是数据的基本个体，不能完整定义数据结构，所以A选项错误。 • B选项：数据对象是性质相同的数据元素的集合，仅仅描述…...

编程日记 2026/1/17 13:16:44

知识点汇总：

★ JS0 列表内容排序再渲染

描述

★ 法一：Array.from() 类数组转数组 + sort((a,b) => a>b?1:-1) 排序 + innerHTML/outerHTML 写成html

知识点：

Array.from() ：将类数组对象（Array-like）/可迭代对象（Iterable）转为真正的数组。 | 或 创建指定长度的新数组

Array.from 的常见用例

1️⃣ 把类数组对象转为数组

3️⃣ 搭配 mapFn 做转换

5️⃣ 创建指定长度的新数组（结合 mapFn）

Array.sort([ ... ]) 排序算法

✅ 为什么返回 1 表示 a 在后？

🚩小技巧：用 localeCompare（字符串排序）—— array.sort((a, b) => a.id.localeCompare(b.id));

innerHTML 和 outerHTML

JS1 直角三角形

描述

document.querySelector('.triangle')

innerHTML

JS2 文件扩展名

描述

JS3 分隔符

描述

示例1

相关文章：

Array.from() ：将类数组对象（Array-like）/可迭代对象（Iterable）转为真正的数组。 | 或创建指定长度的新数组

3️⃣ 搭配 `mapFn` 做转换

5️⃣ 创建指定长度的新数组（结合 `mapFn`）

✅ 为什么返回 `1` 表示 a 在后？

🚩小技巧：用 `localeCompare`（字符串排序）—— `array.sort((a, b) => a.id.localeCompare(b.id));`

`document.querySelector('.triangle')`

`innerHTML`