js map 操作符 获取index

### Python 中 `map()` 的使用方法 `map()` 是一种内置函数，用于将指定的函数应用于可迭代对象中的每一个元素，并返回一个新的迭代器。其语法如下： ```python map(function, iterable, ...) ``` 其中： - `function`: 要应用到每个元素上的函数。 - `iterable`: 可迭代的对象。 #### 示例 1：简单的平方计算 下面是一个简单示例，展示如何使用 `map()` 对列表中的每个元素求平方[^1]。 ```python numbers = [1, 2, 3, 4] def square(x): return x ** 2 squares = map(square, numbers) print(list(squares)) # 输出: [1, 4, 9, 16] ``` #### 示例 2：使用 Lambda 表达式 可以简化上述代码，通过使用匿名函数（lambda）实现相同的功能。 ```python numbers = [1, 2, 3, 4] squares = map(lambda x: x ** 2, numbers) print(list(squares)) # 输出: [1, 4, 9, 16] ``` --- ### RxJava 中 `map()` 的使用方法 在 RxJava 中，`map()` 操作符的作用是对原始 Observable 发射的数据项逐一进行转换并生成新的数据流。它本质上创建了一个新的 `MapObservable` 来处理这些数据，并将其传递给订阅者观察者[^2]。 #### 示例：字符串长度统计 假设有一个字符串序列，我们希望获取它们各自的长度。 ```java import io.reactivex.rxjava3.core.Observable; Observable<String> source = Observable.just("apple", "banana", "cherry"); source.map(String::length).subscribe(System.out::println); // 输出: // 5 // 6 // 6 ``` --- ### JavaScript 中 `Map` 和 `Array.prototype.map()` 的区别与用法 JavaScript 提供了两种主要形式的 `map` 方法：一个是集合类 `Map` 数据结构，另一个是数组原型链上的 `.map()` 函数。 #### 集合类 `Map` `Map` 是 ES6 引入的一种键值对存储方式，支持任意类型的键和值[^3]。 ##### 基本用法 ```javascript const map = new Map(); map.set('name', 'Alice'); console.log(map.get('name')); // Alice console.log(map.size); // 1 ``` #### 数组方法 `.map()` `.map()` 类似于 Python 的 `map()`，但它会直接返回一个新数组而不是迭代器[^4]。 ##### 合并两个不同数组 以下例子展示了如何将两个数组合并成一个包含复合对象的新数组。 ```javascript const arrayA = [{ id: 1 }, { id: 2 }]; const arrayB = ['image1.jpg', 'image2.jpg']; const result = arrayA.map((item, index) => ({ ...item, image: arrayB[index], })); console.log(result); /* 输出: [ { id: 1, image: 'image1.jpg' }, { id: 2, image: 'image2.jpg' } ] */ ``` ---

### JavaScript 中使用 10 个占位符的示例 在 JavaScript 编程中，占位符是一种常见的方式，用于替代未定义或暂时不需要使用的参数、变量或其他数据片段。以下是十种常见的占位符用法及其示例： #### 1. **箭头函数中的下划线 `_` 占位** 当某些参数无需显式使用时，可以用 `_` 表示忽略该参数[^1]。 ```javascript const array = [1, 2, 3]; array.map((_, index) => console.log(index)); ``` #### 2. **模板字符串中的 `${}` 占位** 模板字符串允许通过 `${variable}` 插入动态值[^4]。 ```javascript const name = "Alice"; console.log(`Hello, ${name}!`); ``` #### 3. **正则表达式中的捕获组 `()` 占位** 正则表达式的括号可以捕获匹配的部分，即使不使用它们也需保留占位[^5]。 ```javascript const regex = /(\w+) (\w+)/; const match = regex.exec("John Doe"); if (match) { console.log(match[1], match[2]); } ``` #### 4. **解构赋值中的省略占位** 在对象或数组解构时，可跳过部分字段而不影响其他字段解析。 ```javascript const [a, , b] = [1, 2, 3]; // 忽略第二个元素 console.log(a, b); // 输出: 1, 3 ``` #### 5. **默认参数中的占位** 设置默认值作为占位，避免因缺少实参而报错。 ```javascript function greet(name = "Guest") { return `Hello, ${name}`; } console.log(greet()); // Hello, Guest ``` #### 6. **REST 参数收集多余项** 使用 REST 参数语法 (`...args`) 收集剩余参数作为一个数组。 ```javascript function sum(...numbers) { return numbers.reduce((acc, num) => acc + num, 0); } console.log(sum(1, 2, 3)); // 输出: 6 ``` #### 7. **SPREAD 运算符展开集合** 将数组或对象扩展成独立成员传递给另一个结构。 ```javascript const arr1 = [1, 2]; const arr2 = [...arr1, 3, 4]; console.log(arr2); // 输出: [1, 2, 3, 4] ``` #### 8. **立即执行函数表达式 IIFE 的匿名占位** IIFE 不需要命名即可运行局部作用域代码块。 ```javascript (() => { const message = "This is private."; console.log(message); })(); ``` #### 9. **Promise 构造器中的 resolve/reject 替代物** 虽然 Promise 需要传入两个回调，但在简单场景下可用无操作代替其中之一。 ```javascript new Promise(resolve => setTimeout(() => resolve("Done"), 1000)) .then(result => console.log(result)); ``` #### 10. **Webpack 加载器选项插值 `{interpolate}`** 在 Webpack 配置文件中，特定加载器支持内部占位替换逻辑[^5]。 ```javascript module.exports = { module: { rules: [ { test: /\.html$/, use: { loader: 'html-loader', options: { interpolate: true } } } ] } }; ``` --- ### 总结 以上列举了多种类型的占位符应用实例，涵盖了从基础语法到高级框架配置的不同层面。每一种都有其独特的作用范围和最佳实践。