2、空合并 空合并运算符 ?? 如果左侧为空，则返回右侧。否则，它返回左边的值。这很有用，因为它省略了冗长的 if 检查。 空合并的语法是： someValue ??...// false 5、传播 你可以使用扩展运算符 ... 将一个数组的元素扩展到另一个数组中。...你可以通过将数组转换为集合，然后将集合中的值添加回数组来删除数组的重复项。...这是有效的，因为集合是唯一的项目集合。 换句话说，一个集合中不能有两个相同的值。因此，将数组转换为集合会删除引擎盖下的重复项。...10、对象属性分配 如果你希望对象键与值具有相同的名称，则可以省略对象文字。
这意味着删除任何重复的值。 因此，要从数组中删除重复项，你可以将其转换为集合，然后再转换回数组。...让我解释一下它是如何工作的： 1)、new Set(numbers)从数字列表中创建一个集合。创建集合会自动删除所有重复值。 2）、展开运算符...将任何可迭代对象转换为数组。...这意味着将集合转换回数组。[...new Set(numbers)] 3、 较短的 If-Else 的空合并 这也是 if-else 的简写。...你可以使用看涨合并，而不是使用 if-else 构造来检查值是否为空。该nullish合并操作 ??，如果没有定义左侧返回右侧。...你是否希望对象键与值具有相同的名称？
目录 前言 实战案例 变量解构赋值和扩展运算符的运用 巧用三元运算符替代简单的条件判断 善用可选链运算符、空值合并运算符做空值判断 数组的遍历 结语 前言 你好，我是喵喵侠。...强制转换成布尔值就好了；如果本身就是布尔值，则不需要转换。 善用可选链运算符、空值合并运算符做空值判断 假设我们有一个需求，检查一个变量是否为空，如果为空则赋值默认值，这个需求也是非常常见。...如果要判断一个对象的某个属性，是否是null或者undefined，可以结合可选链运算符（?.）、空值合并运算符（??）...可选链运算符、空值合并运算符这两个都非常好用，感兴趣的话，可以看看MDN官方文档： 可选链运算符（?.） - JavaScript | MDN 空值合并运算符（??）...- JavaScript | MDN 数组的遍历 在前端开发中，遍历数组和对象是常见操作。使用更简洁高效的遍历方法，可以提高代码的可读性和性能。
=运算符同时执行这两个操作：检查空合并值并将其分配为1。...但是，您仍然可以很轻松地获得很酷的强制参数行为。 10.用!!将任何值转换为布尔值！ 在类似于双按位NOT运算符的注释中，可以使用双逻辑NOT运算符将任何值转换为布尔值。 !!...传播合并 使用spread运算符，您可以简化将数组和对象合并为一行代码的任务，而无需调用任何其他方法： const arr1 = [1,2,3,4] const arr2 = [5,6,7] const...，则合并此类对象将导致属性被覆盖。...但是，数组不会发生相同的情况，将添加重复的值，如果您也想避免这种情况，则必须使用Set 。
这就是为什么我们可以在每次迭代中将indexOf()方法返回的索引与当索索引进行比较，以确定当前项是否重复。 确保数组的长度 在处理网格结构时，如果原始数据每行的长度不相等，就需要重新创建该数据。...使用...运算符合并对象或数组中的对象 同样使用ES的...运算符可以替代人工操作，合并对象或者合并数组中的对象。...key 在过去，我们首先必须声明一个对象，然后在需要动态属性名的情况下分配一个属性。...转换为布尔值 布尔值除了true和false之外，JavaScript还可以将所有其他值视为“真实的”或“虚假的”。...操作符转换布尔值 有时候我们需要对一个变量查检其是否存在或者检查值是否有一个有效值，如果存在就返回true值。为了做这样的验证，我们可以使用!!操作符来实现是非常的方便与简单。对于变量可以使用!!
将 null 或 undefined 转换为默认对象： 要将 null 或 undefined 转换为默认对象，可以将逻辑 OR 运算符与空对象文字结合使用： const result = variable...检查值是否为 null、undefined或 NaN： 将 null、未定义和 NaN 检查与逻辑 OR 运算符结合起来： if (variable === null || typeof variable...空合并运算符： 空值合并运算符 (??) 提供了一种简洁的方法来为 null 或未定义的变量提供默认值： const result = variable ?? defaultValue; 15....将 null 或 undefined 转换为布尔值： 要将 null 或 undefined 转换为布尔值，可以使用逻辑 NOT 运算符 (!)： const result = !!...将 NaN 转换为布尔值： 要将 NaN 转换为布尔值，可以使用 isNaN() 函数和逻辑 NOT 运算符： const result = !isNaN(value); 17.
等于自身处理不同 Object.assign 用于对象的合并将源对象的所有可枚举属性复制到目标对象 参数处理 只有一个参数时直接返回该参数 参数不是对象会先转成对象然后返回 第一个参数为...，需要开发者手动指定 for...of 循环 内部调用的是数据结构的 Symbol.iterator 方法 数组 扩展运算符 将一个数组转为用逗号分隔的参数序列 Array.of 将一组值，转换为数组...），然后返回当前数组 查找 find 找出第一个符合条件的数组成员 未找到返回 undefined findIndex 返回第一个符合条件的数组成员的位置 未找到返回 -1 includes...结构没有键名，只有键值keys 方法和 values 方法的行为完全一致 WeakSet WeakSet 结构与 Set 类似都是不重复的值的集合 注意点 成员只能是对象不能是其他类型...key 返回一个布尔值表示删除是否成功 运算符 指数运算符 ** （ES2016） 右结合 从最右边开始计算 链判断运算符 ?.
在每个示例中，我首先解决一个较长形式的任务，你可能也会使用它。然后，我再介绍一种更简洁的技巧方法来做完全相同的事情。 现在，让我们开始吧！...2、 空合并 空合并运算符 ?? ，如果左侧未定义，则返回右侧。..."Nothing found") 3、可选链 如果你使用运算符访问对象的属性，但未定义该属性，则会引发错误。这是使用可选链接的地方。 如果你使用可选链运算符？...// false 5、扩展运算符 你可以使用扩展运算符 (...) 将一个数组的元素“扩展”到另一个数组中。...11、对象属性分配 如果你希望对象键与值具有相同的名称，则可以省略对象文字： const name = "Luis", city = "Paris", age = 43, favoriteFood =
，通过将值传递给它来将值转换为布尔值。...count 否则，它保留 count 的原始值。 05、多值匹配 对于多个值的匹配，可以将所有值放入一个数组中，然后使用indexOf()方法进行检查。...12、对象属性 ES6 提供了一种更简单的方法来为对象分配属性。如果变量名与对象的键名相同，则可以使用缩写表示法进行赋值。...concat() 函数不同，可以使用展开运算符将一个数组插入到另一个数组中的任意位置。...）： let a = 5; let b = 10; [a, b] = [b, a]; 这里我们创建一个包含两个元素[b, a]的数组，然后，使用数组解构赋值将值分别赋给变量a和b。
01-随机获取布尔值 此函数将使用Math.random()方法返回布尔值（真或假）。 Math.random创建一个介于0和1之间的随机数，然后我们检查它是否大于或小于0.5。...(数组去重) 从数组中删除所有重复值的非常简单的方法。...此函数将数组转换为Set，然后返回数组。...navigator.clipboard.writeText(text); }; 13-合并多个数组的不同方法 有两种合并数组的方法。...另一个使用扩展运算符（…）。 PS：我们也可以使用“设置”对象从最终数组中复制任何内容。
expr1 : expr2 结构返回表达式结果 嵌套时从右向左结合，可用括号明确优先级 与模板字符串结合可实现动态内容生成 2. 空值合并 + 可选链 const price = product?....数组去重进阶 const uniqByID = [...new Map(arr.map(item => [item.id, item])).values()]; 使用场景： 根据对象属性去重 合并重复数据的最后出现版本...方法详解： map 将数组转为 [key, value] 格式 Map 对象自动覆盖重复键 values() 获取去重后的对象集合 4....通过双重取反转为布尔值 四、函数与参数处理 6....& 按位与运算检查权限 | 按位或运算添加权限 七、浏览器 API 整合 9.
name; 反转字符串 将一个字符串进行翻转操作，返回翻转后的字符串 const reverse = str => str.split('').reverse().join(''); reverse...().toString(36).slice(2); //函数调用 randomString(); 数组去重 用于移除数组中的重复项 const unique = (arr) => [...new Set...(arr)]; console.log(unique([1, 2, 2, 2, 3, 4, 4, 5, 6, 6])); 数组对象去重 去除重复的对象，对象的key值和value值都分别相等，才叫相同对象...当我们需要合并数据，并且去除重复值时，你是不是要用for循环？...ES6的扩展运算符一行就能搞定！！！
ES6 的内置对象扩展 1.1 Array 的扩展方法（★★） 扩展运算符（展开语法） 扩展运算符可以将数组或者对象转为用逗号分隔的参数序列 let ary = [1, 2, 3]; ...ary...// 1, 2, 3 console.log(...ary); // 1 2 3,相当于下面的代码 console.log(1,2,3); 扩展运算符可以应用于合并数组 // 方法一 let...let oDivs = document.getElementsByTagName('div'); oDivs = [...oDivs]; 构造函数方法：Array.from() 将伪数组或可遍历对象转换为真正的数组...它类似于数组，但是成员的值都是唯一的，没有重复的值。...结构的实例与数组一样，也拥有forEach方法，用于对每个成员执行某种操作，没有返回值。
'李四','王五']; ES6的内置对象扩展 Array的扩展方法 扩展运算符(展开语法) 扩展运算符可以将数组或者对象转换成用逗号分隔的参数序列 没有逗号是因为,console.log(......arg)相当于console.log(1,2,3),但是逗号被console.log当成了参数分隔符,因此没有了逗号 扩展运算符用于数组合并: 也可以数组追加数组: 利用扩展运算符将伪数组转换成真正的数组...: Array.from( ) 将伪数组或可遍历对象转换成真正的数组 Array.find( ) 用于找出第一个符合条件的数组成员,如果没有找到就返回undefined String扩展方法...:表示参数字符串是否在原字符串的头部,返回布尔值 endsWith:表示参数字符串是否在原字符串的尾部,返回布尔值 repeat( )方法 repeat方法将原字符重复n次,返回一个新字符串...ES6提供了新的数据结构Set,它类似于数组,但是成员的值都是唯一的,没有重复的值.可以用来去重. Set本身是一个构造函数,用来生成Set数据结构.
2、合并数组 你可以使用传播运算符（...）将一个数组的元素扩展为另一个数组，例如： const numbers = [10, 20, 30, 40];const allNumbers = [...numbers...9, 9];const uniqueNumbers = [...new Set(numbers)];console.log(uniqueNumbers); 输出： [1, 20, 3, 9] 4、将任何内容转换为布尔值...其他一切都是真实的。 正因为如此，在JavaScript中，你可以将任何值转换为true和false与一元运算符（!）： const bool1 = !...(sentence); 输出： I'm 41 years old 9、将字符串拆分为数组 要将字符串拆分为数组，可以使用扩展运算符（...）： const str = "Test"const strAsArr...允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。” — MDN Web文档 假设你有一个data对象，并且想要安全地访问data.test.value。
repeat方法返回一个新字符串，表示将原字符串重复n次。 trimStart()消除字符串头部的空格，trimEnd()消除尾部的空格。 4....数组的扩展 Array.prototype.includes方法返回一个布尔值，表示某个数组是否包含给定的值，与字符串的includes方法类似。...Array.from方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括 ES6 新增的数据结构 Set 和 Map）。...，Array.from会返回一个一模一样的新数组： Array.from([1, 2, 3]) // [1, 2, 3] 扩展运算符 替代函数的apply方法 将数组转为函数的参数： // ES5...对象的新增方法 Object.is() 用来比较两个值是否严格相等，与严格比较运算符（===）的行为基本一致。
扩展运算符可以将数组或者对象转为用逗号分隔的参数序列 let ary = [1, 2, 3]; ...ary // 1, 2, 3 此参数序列的逗号在console.log() 中被视为参数分隔符...，不打印出来(log方法可打印多个参数，参数间以逗号分隔) console.log(...ary); // 结果 1 2 3,相当于下面的代码 console.log(1,2,3); 扩展运算符可以应用于合并数组...let ary2 = [3, 4, 5]; let ary3 = [...ary1, ...ary2]; //[1,2,3,3,4,5] // 方法二 ary1.push(...ary2); 将类数组或可遍历对象转换为真正的数组...let oDivs = document.getElementsByTagName('div'); oDivs = [...oDivs]; 构造函数方法：Array.from() 将伪数组或可遍历对象转换为真正的数组...它类似于数组，但是成员的值都是唯一的，没有重复的值。 Set本身是一个构造函数，用来生成 Set 数据结构 const s = new Set(); Set函数可以接受一个数组作为参数，用来初始化。
每个ECMAScript版本都采用不同的方式枚举对象。让我们检查一下。 该Object.keys()方法返回给定对象自己的可枚举属性名称的数组，并以与普通循环相同的顺序进行迭代。...） let result = array.abc === undefined; 9、如何在JavaScript中合并两个数组并删除重复项？...当我们想检查对象的特定属性是否未定义时，我们可以直接使用if条件和===运算符进行检查。...在大多数情况下，我们确实检查数组的长度，但是，如果要检查对象的长度怎么办？以下两种方法是获取对象长度的最佳方法。...我们如何将字符串转换为对象数组以在我们的应用程序中使用？
，该数组包含输入数组的重复元素。...为了解决由于数组长度增长而导致的无限循环问题，可以在进入循环之前将数组的初始长度存储在一个变量中。然后，可以使用这个初始长度作为循环迭代的限制。...这样，循环只会针对数组中的原始元素进行，并不会受到由于添加重复项而导致数组增长的影响。...JavaScript如何处理对象转换为基本值，例如字符串、数字或布尔值。...这个算法会考虑比较值的类型并进行必要的转换。 在我们的情况中，让我们把 x 记作 []，y 记作 ![]。我们检查了 x 和 y 的类型，并发现 x 是对象，y 是布尔值。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
云直播
实时音视频
