编程技术文章分享与教程

网站首页 > 技术文章 正文

JavaScript对象与其复制清除方法简析

hmc789 2024-11-19 05:00:26 技术文章 1 ℃


var obj{
属性1:属性值1, // 属性名=>key 不能重复
属性2:属性值2, // 属性值=>value 是该属性的唯一值 (键值对数据 键=>key 值=>value 有键必有值)
}

var obj{
a:1,
b:2,
c:3,
}
console.log(obj.a); //打印对象obj下属性a的value值
123456

obj.d=obj.a + obj.b; // 创建并给obj的d属性赋值,不需要var

document.write(); console.log(); // 带括号的 => 函数(方法)
input.value; // 不带括号 => 属性

obj [“a”]=30; // obj [ key ]=value; 等价于 obj . a =30; (点语法内不能使用变量,不加引号)

var names="a";
var v=20;
var obj={
            [names]:v
        }
12345

属性名就是字符串var obj={a:v}
当属性名是变量时,需要[]将变量包含
[ ] 内key要求属性名必须是字符型或symbol型,所以必须要有 " "
凡是字符,加了"“就是字符类型的字符串,不加”“就是变量名
只有在对象中属性名特殊,没有”"的属性名是字符串,有[]的属性名是变量

var a = "ab";
var b=9;
obj [a] =30; // a是一个变量,相当于将"ab"字符串作为obj的属性名
obj[b]=20; // 如果变量内的值不是字符型,则会隐式转换成字符型作为属性名 将变量b中的数字9隐式转换为字符“9”并作为obj的属性名
console.log(obj.c); //obj对象内没有c属性,打印结果为undefined

 var obj={};
        var o={a:1};
        obj[o]=20;
        var o1={a:3};
        console.log(obj[o1]);//o和o1是变量,被带入时转换为字符串[object Object];20
        console.log(obj.o1);//o1是字符,obj没有o1的属性;undefined



var n;
var m;
obj[n]=10;
console.log(obj[m]); //打印结果为10 
12345678910111213141516171819

因为变量n为undefined,隐式转换成字符“undefined”,obj[n] =>obj[“undefined”] =10
obj[m] => obj[“undefined”]
对象被强转为字符串会变成 " [ object object ] "

栈、堆
栈数据读取写入速度快,但存储内容较少
读取和写入速度慢,但存储内容多
字符型,数值型,布尔型,undefined 都存在栈中
对象,函数存在堆中
当点击对象前面的箭头时,才去堆中对应的地址取出数据
引用地址就是指堆中对象存储的地址

对了,在这里说一下,我目前是在职web前端开发,如果你现在正在学习前端,了解前端,渴望成为一名合格的web前端开发工程师,在入门学习前端的过程当中有遇见任何关于学习方法,学习路线,学习效率等方面的问题,都可以随时关注并私信我:前端,我都会根据大家的问题给出针对性的建议,缺乏基础入门的视频教程也可以直接来找我,我这边有最新的web前端基础精讲视频教程, 还有我做web前端技术这段时间整理的一些学习手册,面试题,开发工具,PDF文档书籍教程,都可以直接分享给大家。

var o={a:1};
        var o1=o;//将o对象的引用地址赋值给o1
        o1.a=10;//因为o1和o是同一个对象,因此修改o1的属性就相当于修改了o的属性
        console.log(o);//10

var o={a:1};
        var o1=o;
        o={b:2}; //重新改变新地址,o1与o不指向同一个地址
        o.a=20;
        console.log(o1); // {a:1}
        console.log(o);  // {b:2,a:20}
1234567891011

内存泄漏
当对象不再使用,但对象的引用列表中并没有清除引用关系时,对象依旧会存在于堆中,占用内存,不会被垃圾回收车回收,造成内存泄漏
对象被存储在堆中,如果堆中对象不断增加就会造成卡顿
对于处理内存中不需要的数据,我们叫做垃圾回收
当设置变量为null,可以将该对象引用列表中这个引用变量清除
当垃圾回收车过来的时候发现堆中该对象引用列表是空的时候就会将其清除
而栈中数据,一旦该变量不再使用,就会被清理掉

var i={a:1}; // 变量 i 内存放着对象{a:1} 的地址
var j=i; // 变量 j 内也存着对象{a:1}的地址   变量 i 和 j 都指向对象{a:1}
//如果此时,想要给变量 j 重新赋值,则先需要在对象{a:1}的引用地址中删除 j 对这个对象的引用,在重新赋值
i = null; // 取消引用,释放对象占用的内存
i = 2; // 重新赋值

var obj={
            a:1,
            b:2,
            c:3,
            d:4,
            e:undefined
        }
        console.log("e" in obj);//判断e是不是obj的属性名;true
1234567891011121314

遍历复制对象

var o={f:10,g:20};
        for(var prop in obj){
            o[prop]=obj[prop];
        }
console.log(o);
12345

js中的对象遍历是根据对象属性添加的先后来遍历,对象遍历是有顺序的

Object.assign()方法复制对象

var o={f:10,g:20};
        var obj={}
        o=Object.assign(o,obj);
        console.log(o);
1234

JSON方法复制对象

var str=JSON.stringify(obj);
       console.log(str);
12

这种固定样式类型的字符串,叫做JSON字符串,JSON类型

var obj={b:2}
        console.log(obj);// {b:2},展开后a:1100;b:2;
        var str=JSON.stringify(obj);
       	console.log(str);
        obj.a=10;
        obj.a++;
        obj.a*=100;

        var s='{"b":2}';
        var o=JSON.parse(s);//将JSON字符串转换为对象
        console.log(o);// {b:2}
1234567891011

浅复制与深复制

var  obj={
            a:1,
            b:2,
            c:{
                d:10,
                e:20
            }
        }
//浅复制
        var o1={};
        for(var prop in obj){
            o1[prop]=obj[prop];
        }
        var o1=obj;
        obj.a=10;
        obj.c.d=100;
        console.log(o1,obj);//obj与o1一起改变
 // 深复制
        var o1=JSON.parse(JSON.stringify(obj));//先转化为JSON字符串,然后再转换为对象进行复制
        obj.c.d=100;
        console.log(o1,obj);// 改变obj不会影响O1
123456789101112131415161718192021

对象清除

var o={a:1};
        o.b=10;
        delete o.a;//删除属性
        console.log(o); {b:10}



原文链接:https://blog.csdn.net/weixin_46869765/article/details/108942658

作者:哪有那么可爱的小蝈蝈

标签列表
最新留言