网站文章只被收录网站首页,网站描述怎么写利于seo,怎样把自己的产品放到网上销售,软装设计公司简介深入理解JavaScript中的简单类型#xff08;基本数据类型#xff09;与复杂类型#xff08;引用数据类型#xff09;如何在内存中存储对于编写高效、无误的代码至关重要。本文将探讨这两种类型的差异#xff0c;以及它们在内存中的存储机制——栈#xff08;Stack#x…深入理解JavaScript中的简单类型基本数据类型与复杂类型引用数据类型如何在内存中存储对于编写高效、无误的代码至关重要。本文将探讨这两种类型的差异以及它们在内存中的存储机制——栈Stack和堆Heap并通过实例说明这些概念的实际应用。
内存基础栈与堆
栈Stack
栈是一种后进先出LIFO, Last In First Out的数据结构通常用于存储函数调用信息和局部变量。由于其结构特性栈操作非常快速且直接访问栈顶元素的时间复杂度为O(1)。
特点 存储简单类型值。每个线程拥有独立的栈空间。固定大小分配速度快。
堆Heap
堆是一种动态分配的内存区域适合于存储大小不固定的对象或需要长期存在的数据。与栈不同堆上的数据没有特定的顺序因此访问速度较慢但灵活性更高。
特点 存储复杂类型值。所有线程共享同一块堆内存。动态分配管理相对复杂。 简单类型 vs 复杂类型
简单类型基本数据类型
JavaScript中有六种简单类型
undefinednullbooleannumberstringsymbol (ES6新增)
特性 按值传递当简单类型的值被作为参数传递给函数时实际上是创建了一个副本这意味着对参数的任何修改都不会影响原始值。 function changeValue(x) {x 10;
}
let a 5;
changeValue(a);
console.log(a); // 输出: 5 存储位置简单类型的值直接存储在栈中占用固定大小的空间。
复杂类型引用数据类型
常见的复杂类型包括
ObjectArrayFunction其他自定义对象
特性 按引用传递当一个复杂类型的值被作为参数传递给函数时传递的是该对象的引用地址而不是副本。因此在函数内部对该对象所做的任何更改都会反映到原始对象上。 function modifyObject(obj) {obj.name World;
}
let obj { name: Hello };
modifyObject(obj);
console.log(obj.name); // 输出: World 存储位置复杂类型的值实际存储在堆中而栈中仅保存指向堆内存的引用地址。 实际案例分析
案例1简单类型的比较
let num1 10;
let num2 10;
console.log(num1 num2); // 输出: truelet str1 test;
let str2 test;
console.log(str1 str2); // 输出: true
在这个例子中num1和num2、str1和str2都存储了相同的值并且因为它们是简单类型所以比较结果为true。
案例2复杂类型的比较
let arr1 [1, 2, 3];
let arr2 [1, 2, 3];
console.log(arr1 arr2); // 输出: falselet obj1 { key: value };
let obj2 obj1;
console.log(obj1 obj2); // 输出: true
这里arr1和arr2虽然包含相同的内容但由于它们是不同的对象实例各自的引用地址不同所以比较结果为false。而obj1和obj2指向同一个对象因此比较结果为true。
案例3浅拷贝 vs 深拷贝
由于复杂类型是按引用传递的直接赋值不会复制对象本身而是复制了引用。为了创建对象的独立副本我们需要使用深拷贝技术。
let original { a: 1, b: { c: 2 } };
let shallowCopy Object.assign({}, original);
let deepCopy JSON.parse(JSON.stringify(original));original.b.c 3;console.log(shallowCopy.b.c); // 输出: 3
console.log(deepCopy.b.c); // 输出: 2
此示例展示了浅拷贝shallowCopy只复制了顶层属性的引用而深拷贝deepCopy则完全复制了整个对象树。 总结
感谢您的阅读如果你有任何问题或想分享自己的经验请在评论区留言交流
