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

JS中的字符串、数组、对象

article 2025/9/12 9:10:43

（一）字符串和数组互相转换

（二）字符串和对象互相转换

（三）遍历数组和遍历对象

1. 遍历数组：for循环 / forEach

2. 遍历对象：for（let k in obj）

注：这里不用for循环遍历对象，有两个原因！！

一是对象没有像数组一样的length属性，无法确定长度，

二是对象里面是无序的键值对，没有索引号下标index。

（四）数组解构和对象解构

1. 数组解构

注：1）若左侧变量多，右侧单元值少，则多余的变量会被赋值为undefined。

2）若左侧变量少，右侧单元值多，则可以用剩余参数来解决，剩余参数返回的是一个真数组。

3）要避免undefined传递单元值，则需要设置默认值，只有单元值为undefined时默认值才生效。

例如const [ a = '手机'，b = '小米' ] = [ ' 华为 ' ]

此时a的值为' 华为 '，b的值为'小米'

4）按需导入，可以忽略某些返回值。

例如 const [ a , , c , d ] = [ 1, 2 , 3 , 4 ]

此时a的值为1，c的值为3，d的值为4

5）多维数组解构。

例如const [ a , [b , c ] ] = [ 1, [ 2 , 3 ] ]

此时a的值为1，b的值为2，c的值为3

2. 对象解构

注：1）给解构的变量名重新命名

const { name:uname , age } = user

此处的name是原变量名，uname是新变量名

2）数组对象解构

const pig = [ { uname : '佩奇'，age：18 } ]

解构：const [ { uname，age } ] = pig

3）多级对象解构

const pig = {

name：‘佩奇’，

family：{

mother：‘猪妈妈’，

father：‘猪爸爸’，

sister：‘乔治’

}，

age：6

}

解构：const { name, family:{ mother,father,sister }, age } = pig

4）Json对象解构

Json对象：属性名和属性值都用双引号引起来了。

const msg = {
"code": 200,
"msg": "获取新闻列表成功",
"data": [
{
"id": 1,
"title": "5G商用自己，三大运用商收入下降",
"count": 58
},
{
"id": 2,
"title": "国际媒体头条速览",
"count": 56
},
{
"id": 3,
"title": "乌克兰和俄罗斯持续冲突",
"count": 1669
},

]
}

（1）只解构data里面的数据：const { data } = msg

（2）把data选出来作为参数传递给函数：

function render ( { data } ) {
console.log(data)
}
render ( msg )

（3）为防止msg里面的data名字混淆，要求渲染函数里面的数据名改为 myData：

function render ( { data: myData } ) {
console.log(myData)
}
render ( msg )