正文 

当前位置： 首页 > IT > java教程

javascript对象的底层数据结构是什么(代码片段)

四点水的点滴记录 四点水的点滴记录     2022-12-09     113

关键词：

上一篇文章归纳了javascript的数据类型，归根到底数据类型就分为两类，一种是基础类型，一种是引用类型。如果还没有看的同学这里附上超链接《JavaScript规定了几种语言类型》

基本类型

  • 内容：String、Number、Boolean、Undefined、Null、Symbol、BigInt
  • 特点：值不可变，无属性无方法，保存在栈内存中、值比较。
String是一个特殊的基本类型，可以被当成引用类型使用
let a = 'strObject';
a = a.substring(3,9);
console.log(a); // Object

引用类型

  • 内容：除了上面的 7 种基本数据类型外，剩下的就是引用类型，统称为Object类型
  • 特点：引用类型的值同时保存在栈内存和堆内存中的对象。栈区内存保存变量标识符，堆内存存储对象的地址

ps：差异：基本类型的值是不可变的，比较是值的比较，引用类型的值是可变的，比较是引用的比较；

const a = '我是a';
let b = a;
console.log(a===b); // true
b = '我现在改了';
console.log(a); // 我是a
console.log(b); // 我现在改了
console.log(a===b); // false
/** =================== **/
const c = 
	name: '张三'

const d = c;
const e = name: '李四'
d.name = '李四';
console.log(c); // name: "李四",引用类型的赋值其实是对象保存在栈区地址指针的赋值，因此两个变量指向同一个对象，任何的操作都会相互影响。
console.log(d); // name: "李四"
console.log(e); // name: "李四"
console.log(c===d); // true
console.log(d===e); // false，虽然看起来相同，但是两个对象存在堆内存的地址是不相同的，所以返回的是false;

现在我们来了解下什么是堆，什么又是栈。

堆（heap）

  • 堆内存的简称，动态分配内存，内存大小不一，不是自动释放。
  • 队列优先,先进先出，方便存储和开辟内存空间。

栈（stack）

  • 栈内存的简称，自动分配相对固定大小的内存空间，并由系统自动释放。基本类型存储在栈内存的好处就是，内存可以及时的得到回收。
  • 线性结构，后进先出，便于管理。

ps：看完堆和栈的简单介绍，我们再来看下对于数据结构相关的一个问题浅拷贝和深拷贝

浅拷贝

只复制了第一层属性，复制对象是基本类型。

// 浅拷贝的方法
const a = 
	name: '张三'

// Object.assign或=
const b = Object.assign(a);// name: '张三'
b.name = '李四';
console.log(a.name); // 李四
const c = b;
c.name = '王五'
console.log(a.name); // 王五
console.log(b.name); // 王五

深拷贝

对属性中所有引用类型的值，遍历到是基本类型的值为止，利用递归来实现深拷贝。

// Object.assign和扩展符针对对象值都是基本类型
const a = 
	name: '张三';

const b = Object.assign(, a); // 或者...a
b.name = '李四';
console.log(a.name);// 张三
// 递归循环
function clone(obj)
    let _obj = Array.isArray(obj) ? [] : ;
    if(obj && typeof obj === "object")
        for(key in obj)
            if(obj.hasOwnProperty(key))
                // 判断obj子元素是否为对象，如果是，递归复制
                if(obj[key] && typeof obj[key] === "object")
                    _obj[key] = clone(obj[key]);
                 else 
                    // 如果不是，简单复制
                    _obj[key] = obj[key];
                
            
        
    
    return _obj;
;
const c = clone(a);
c.name = '王五';
console.log(a.name); // 张三

结尾附上一个有趣的问题typeof(null)，打印出来的是object，原因JavaScript中的数据在底层是以二进制存储，比如null所有存储值都是0，但是底层的判断机制，只要前三位为0，就会判定为object；

ps：文末附上汇总文章链接《一名【合格】前端工程师的自检清单【持续更新】》

javascript对象的底层数据结构是什么(代码片段)

上一篇文章归纳了javascript的数据类型，归根到底数据类型就分为两类，一种是基础类型，一种是引用类型。如果还没有看的同学这里附上超链接《JavaScript规定了几种语言类型》基本类型内容：String、Number、Boolean... 查看详情

synchronized底层实现学习(代码片段)

...们就开始synchronized原理的探索之旅吧(*>﹏<*)。 1.对象锁是什么 　　不同于ReentrantLock的显式加锁，synchronized的加锁方式属于隐式加锁，从代码中看我们只知道当线程执行到被synchronized包围的代码块时会获取锁，那这把... 查看详情

杂谈从底层看锁的实现(代码片段)

...象，才能进入临界区。锁的本质是什么？锁的本质是一个数据结构（或者说是一个对象），这个对象内保留着描述锁所需要的必要信息。如当前锁是否已被占用，被哪个线程占用。而锁的一些工具，函数库，实际上就是对一个锁... 查看详情

在底层，Javascript 对象是哈希表吗？ [复制]

】在底层，Javascript对象是哈希表吗？[复制]【英文标题】：Underthehood,areJavascriptobjectshashtables?[duplicate]【发布时间】：2012-05-0216:09:35【问题描述】：我想知道对象是如何在Javascript引擎（V8、Spidermonkey等）的底层实现的。它们真的... 查看详情

object.defineproperty（）以及vue中双数据绑定的底层原理(代码片段)

 Object是在javascript中一个被我们经常使用的类型，而且JS中的所有对象都是继承自Object对象的。虽说我们平时只是简单地使用了Object对象来存储数据，并没有使用到太多其他功能，但是Object对象其实包含了很多很有用的属性和... 查看详情

javascript--map数据结构(代码片段)

文章目录什么是MapMap和对象的区别Map实例的属性和方法set()get()has()delete()clear()forEach()size属性Map构造函数二维数组SetMapMap注意事项Map的应用操作DOM什么是MapMap和对象类似都是键值对的集合。Map和对象的区别对象一般用字符串当键... 查看详情

javascript中，数据类型和对象的关系（区别）

javascript中，数据类型有string类型，Boolean类型，而对象中，又有string对象，Boolean对象，把我搞糊涂了？到底两者是什么关系的？求解！我是初学者1.如果你是初学,那你就把string类型和string对象当成同一个东西.例如vara='abc';v... 查看详情

什么是函数的数据类型：函数还是对象？在 JavaScript 中

】什么是函数的数据类型：函数还是对象？在JavaScript中【英文标题】：WhatisFunction\'sDataType:functionorobject?inJavaScript【发布时间】：2016-05-1304:05:50【问题描述】：MDN说：六种原语数据类型：布尔值空未定义号码字符串符号（ECMAScript... 查看详情

javascript数组对象的浅拷贝与深拷贝深浅拷贝的区别＋图解原理(代码片段)

JavaScript数组对象的浅拷贝和深拷贝知识回调（不懂就看这儿！）场景复现底层知识与原理1.关于内存（图解）2.关于数据类型3.关于赋值的原理深拷贝与浅拷贝浅拷贝实现原理（图解）深拷贝实现原理&#x... 查看详情

go切片(代码片段)

切片是什么？一种数据结构，类似数组，围绕动态数组的概念而设计，可按需自动改变大小。切片内部实现？切片基于数组实现，底层是数组（故底层的内存是连续分配，可根据索引获取数据，可迭代以及垃圾回收），自身非常... 查看详情

javascript对象(代码片段)

前期整理的JavaScript内容22篇附在文章末尾一、对象1.1什么是对象？现实生活中：万物皆对象，对象是一个具体的事物，看得见摸得着的实物。例如，一本书、一辆汽车、一个人可以是“对象”，一个数据库... 查看详情

你应该知道的javascript是什么?(代码片段)

本文由乐字节Java课程赞助主要内容JavaScript简介?JavaScript是一种具有面向对象能力的、解释型的程序设计语言。更具体一点，它是基于对象和事件驱动并具有相对安全性的客户端脚本语言。它的主要目的是，验证发往服务器端的... 查看详情

你应该知道的javascript是什么?(代码片段)

本文由乐字节Java课程赞助主要内容JavaScript简介?JavaScript是一种具有面向对象能力的、解释型的程序设计语言。更具体一点，它是基于对象和事件驱动并具有相对安全性的客户端脚本语言。它的主要目的是，验证发往服务器端的... 查看详情

java集合--hashmap底层实现hashmap的长度为什么是2的幂次方concurrenthashmap和hashtableconcurrenthashmap线程安全的实现(代码片段)

1.HashMap底层实现Map存储键值对的数据结构是数组+链表的结构，结合了数组查询数据快和链表增删数据快的优点；用Entry[]存储键值对，Entry为类类型，类里面有四个属性：hash、K、V、next，分别存储哈希值... 查看详情

javascript性能优化3——浏览器执行javascript时底层的堆栈操作(代码片段)

目录一、堆栈准备二、堆栈机制1.基本数据类型2.对象类型修改同属性新赋值复杂样例分析3.函数堆栈处理函数创建函数执行步骤4.闭包堆栈处理一、堆栈准备JS执行环境（比如现在常见的就是V8）：代码最终是会被转为... 查看详情

什么是javascript对象？

对象是JavaScript的基本数据类型。对象是一种复合值：它将很多值（原始值或者其他对象）聚合在一起，可通过名字访问这些值。对象也可看做是属性的无序集合，每个属性都是一个名/值对。属性名是字符串，因此我们可以把对... 查看详情

javascript是什么？

JavaScript是脚本语言JavaScript是一种轻量级的编程语言。JavaScript是可插入HTML页面的编程代码。JavaScript插入HTML页面后，可由全部的现代浏览器运行。JavaScript非常easy学习。javascript是什么？JavaScript一门解释型(不是编译型)脚本语言,... 查看详情

ios开发：对block使用的一次研究总结(代码片段)

...知其所以然。Block是什么？Block可以封装一个匿名函数为对象，并捕获上下文所需的数据，并传给目标对象在适当的时候回调。我们使用Block的目的其实就是回调传值，那我们去看看Block的底层，再深入了解一下Block。Block的底层Blo... 查看详情