es6赋值解构

本文主要探讨ES6中的解构赋值特性,包括如何遍历对象并利用解构赋值进行高效操作,以及解构赋值在字符串API中的应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、遍历对象

let o=[x:1,y:2]
for (const [name,value] of Object.entries(o)){

console.log(name,value) //x 1,y 2

2、操作字符串的丰富API

let s='Hello,world'

1、取得字符串的一部分

s.substring(1,4)    //'ell' ,第2~4个字符

s.slice(1,4)       //'ell' ,第2~4个字符

s.slice(-3)           // 'rld',最后三个字符
 
s.split(',')       //['Hello','world']   从定界符处拆开

2、搜索字符串

s.indexOf('l')  // 2     第一个字母l的位置    2 表示下标
  
s.indexOf('l',3) //3    位置3后面的第一个‘l’,的位置

s.indexOf('zz')  // -1     s并不包含子串 'zz'

s.lastIndexOf('l')  // 10  最后一个字母 l 的位置

//ES6及之后的版本中的布尔值搜索函数

s.replace('llo','ya')  //'heya,world'

s.toLowerCase()  //'hello,world'

s.toUpperCase()   //'HELLO,WORLD'

s.normalize()  //Unicode NFC   归一化,ES6新增

s.normalize('NFD')  //NFD 归一化  

////访问字符串中的个别(16位值)字符

s.charAt(O)//=> "H":第一个字符

s.charAt(s.length-1)//=> "d":最后一个字符

s.charCodeAt(O)//=> 72:指定位置的16位数值

s.codePointAt(O)//=> 72: ES6,适用于码点大于16位的情形

//ES2017新增的字符串填充函数

"x".padStart(3)=> " x":在左侧添加空格,让字符串长度变成3

"x".padEnd(3)=> "x ":在右侧添加空格,让字符串长度变成3

"x".padStart(3, "*")=> "**x":在左侧添加星号,让字符串长度变成3

"x".padEnd(3, "-")=> "x--":在右侧添加破折号,让字符串长度变成3

//删除空格函数  trim()  是ES5就有的,其他是ES209怎加的

' test '.trim()    //  'test'删除开头和末尾的空格

' test '.trimStart()  //'test '删除左侧空格 也叫trimLeft

' test '.trimEnd()  //删除右侧空格 也叫tirmRight

//未分类字符串方法 

s.concat('!')  //'Hello,world!'  可以用+ 操作符代替

'<>'.repeat(5)  //'<><><><><>'  拼接n次 ES6新增



 

### ES6 对象解构赋值 #### 基本语法 对象的解构赋值允许提取对象中的属性并将其分配给变量。基本形式如下: ```javascript let obj = { prop1: "value1", prop2: 42 }; let { prop1, prop2 } = obj; console.log(prop1); // 输出:"value1" console.log(prop2); // 输出:42 ``` 此操作会创建两个新变量 `prop1` 和 `prop2`, 它们的初始值分别对应于对象 `obj` 中相应键对应的值[^1]。 #### 设置默认值 当尝试从不存在或未定义的对象属性获取值时,可以通过指定默认值来处理这种情况: ```javascript let userSettings = { theme: 'dark', }; // 使用默认参数 let { theme = 'light', fontSize = 16 } = userSettings; console.log(theme); // dark (来自实际数据) console.log(fontSize); // 16 (使用了默认设置) ``` 这里展示了如何为可能缺失的配置项提供合理的回退选项[^2]. #### 属性重命名 有时希望使用的局部变量名称不同于原始对象内的键名,在这种情况下可以采用别名机制完成映射关系建立: ```javascript const person = { firstName: 'John', lastName: 'Doe' }; let { firstName: name, lastName: surname } = person; console.log(name); // John console.log(surname); // Doe ``` 上述代码片段说明了即使原对象字段名为 `firstName` 和 `lastName`, 可以通过冒号后的部分自定义新的绑定目标名字[^3]. #### 处理剩余属性 对于那些不参与直接匹配却仍然存在于源对象里的其他成员,则可通过扩展运算符(`...`)捕获它们形成一个新的独立实体: ```javascript var sourceObj = { id: 7, title: "A Tale of Two Cities", author: "Charles Dickens", yearPublished: 1859 }; let {id, ...bookInfo} = sourceObj; console.log(id); // 7 console.log(bookInfo.title);// A Tale of Two Cities console.log(bookInfo.author); // Charles Dickens console.log(bookInfo.yearPublished); // 1859 ``` 这段例子表明除了显式声明过的 `id` 字段外,其余所有条目都被收集到了 `bookInfo` 这个新对象里去了.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值