JavaScript代码和typescript的地址和数值引用,鸿蒙的深层拷贝
·
怎么判断JavaScript代码的引用
分析下面的两张图
一、JavaScript代码

二、鸿蒙的ets文件代码

了解上面的代码。
map后端的item接的是对象的不能用扩展运算符,在ts文件中只能用返回对象字面量,即是:
{ ... } 本身是一个 对象字面量,

在上面的代码中,由二的那部分鸿蒙的ets文件代码也可以写成

上面的代码是实现深层拷贝,不再引用各自的内存地址引用。
1、主要的实现效果代码:
let arr1 = [12, {id: 1}, {id: 2}];
let arr2 = arr1.map(item =>
{
if (typeof item === 'object' && item !== null)
{
return {
id: item.id
}
}
})
arr1[1].id = 100
console.log("arr2", arr2)
console.log("arr1", arr1)
console.log(arr1 === arr2); // false,对象引用不相同
实现效果:

2、鸿蒙页面代码:
import { router } from '@kit.ArkUI'
interface user1{
id:number
name:string
}
interface address1{
city:string
street:string
}
interface Order {
id: number;
user: user1;
address: address1;
}
@Entry
@Component
struct Test4 {
@State message: string = 'Hello World';
@State me:Order={
id:1,
user:{
id:2,
name:'aaa'
},
address:{
city:'广东',
street:'十三巷'
}
}
@State me1:Order[]=[{
id:3,
user:{
id:2,
name:'aaa'
},
address:{
city:'广东',
street:'十三巷'
}
},
{
id: 21,
user: {
id: 2,
name: 'aaa'
},
address: {
city: '广东',
street: '十三巷'
}
}
]
build() {
Column() {
Text(String(this.me1[0].address.city))
.fontSize(34)
Button('修改城市me1')
.onClick(() => {
// 1. 先改值
this.me1[0].address.city = '四川';
// 2. 再换数组引用,触发 UI 重新收集
this.me1.forEach(item => {
item.id = 999; // 数字
});
interface Order {
id: number;
user: user1;
address: address1;
}
this.me1 = this.me1.map(item => {
return {
id: item.id,
user:item.user,
address:
{
city: item.address.city, street:
item.address.street
}
}as Order;
});
})
}
}
}
运行效果如下:

欢迎关注码文狙击所。

更多推荐


所有评论(0)