前端常见的数据结构整理及应用

一定要及时查看巩固!


后进先出
在这里插入图片描述
javaScript中Array数组模拟栈:

var arr = [1, 2, 3, 4, 5];
arr.push(6); // 存入数据 arr -> [1, 2, 3, 4, 5, 6]
arr.pop();   // 取出数据 arr -> [1, 2, 3, 4, 5]


"无序"的key-value"键值对"存储方式,堆的存取方式跟顺序没有关系,不局限出入口
在这里插入图片描述
队列
先进先出
在这里插入图片描述
JavaScript中Array数组模拟队列:

var arr = [1, 2, 3, 4, 5];
// 队尾in
arr.push(6);    // 存入 arr -> [1, 2, 3, 4, 5, 6]
// 队头out
arr.shift();    // 取出 arr -> [2, 3, 4, 5, 6]

在js中的应用:函数调用栈、内存处理(栈和堆,基础类型存在栈、引用类型存在堆)
1.代码运行方式–函数调用栈

程序执行进入一个执行环境时,它的执行上下文就会被创建,并被推入执行栈中(入栈);
程序执行完成时,它的执行上下文就会被销毁,并从栈顶被推出(出栈),控制权交由下一个执行上下文
因为JS执行中最先进入全局环境,所以处于"栈底的永远是全局环境的执行上下文"。而处于"栈顶的是当前正在执行函数的执行上下文",当函数调用完成后,它就会从栈顶被推出(理想的情况下,闭包会阻止该操作,闭包后续文章深入详解)

function foo () {
    function bar () {
        return 'I am bar';
    }
    return bar();
}
foo();

在这里插入图片描述
解释:代码先进行到全局环境,创建全局执行上下文,将全局执行上下文推到栈底。然后执行foo(),进入到foo函数的执行环境,创建foo的执行上下文,把这个执行上下文推到栈中,然后执行bar(),进入到bar函数的执行环境,创建他的执行环境,然后推入到栈中(最顶端的位置),然后执行bar()的代码,执行完,bar的执行上下文被销毁,在执行foo的代码,执行完在销毁,全局执行上下问需要等到网页关闭后销毁。

执行上下文的生命周期
1.创建阶段(进入执行上下文)
2.执行阶段(代码执行)
创建阶段:函数被调用时,进入函数环境,为其创建一个执行上下文,此时进入创建阶段
执行阶段:执行函数中代码时,此时执行上下文进入执行阶段

创建阶段的操作
1.创建变量对象

  • 函数环境会初始化创建Arguments对象(并赋值)
  • 函数声明(并赋值)
  • 变量声明,函数表达式声明(未赋值)

2.确定this指向(this由调用者确定)
3.确定作用域(词法环境决定,哪里声明定义,就在哪里确定)

执行阶段的操作
1.变量对象赋值 激活了叫做活动对象
变量赋值
函数表达式赋值
2.调用函数
3.顺序执行其它代码

变量对象和活动对象的区别:
当进入到一个执行上下文后,这个变量对象才会被激活,所以叫活动对象(AO),这时候活动对象上的各种属性才能被访问。其实是一个东西,进入到执行上下文后,变量对象呗激活,就变成了活动对象。
“创建阶段对函数声明做赋值,变量及函数表达式仅做声明,真正的赋值操作要等到执行上下文代码执行阶段”。

函数声明,变量声明,函数表达式的优先级:函数声明优先 > 变量,函数表达式

执行上下文的数量限制(堆栈溢出)
执行上下文可存在多个,虽然没有明确的数量限制,但如果超出栈分配的空间,会造成堆栈溢出。常见于递归调用,没有终止条件造成死循环的场景。

内存存储(栈、堆)
JavaScript中变量类型有两种:
基础类型(Undefined, Null, Boolean, Number, String, Symbol)一共6种
引用类型(Object、array)

基础类型的值保存在栈中,这些类型的值有固定大小,“按值来访问”;
引用类型的值保存在堆中,栈中存储的是引用类型的引用地址(地址指针),“按引用访问”,引用类型的值没有固定大小,可扩展(一个对象我们可以添加多个属性)

在这里插入图片描述
“浅拷贝:栈存储拷贝”
“深拷贝:栈堆存储拷贝”

将一个变量的值赋值给另一个变量,相当于在栈内存中创建了一个新的内存空间,然后从栈中复制值,存储到这个新空间中。对于基本类型,栈中存储的就是它自身的值,所以新内存空间存储的也是一个值。直接改变新变量的值,不会影响到旧变量的值,因为他们值存储的内存空间不同。
而对于引用类型来说,同样是复制栈中存储的值。但是栈存储的只是其引用地址,其具体的值存储在堆中。变量复制仅复制栈中存储的值,不会复制堆中存储的值,所以新变量在栈中的值是一个地址指针

函数传参数是按值传递
而参数传递过程其实同样是变量复制的过程,所以它是按值传递, 传递参数是对象时,变量复制仅复制的栈存储(浅拷贝),所以修改对象属性会造成外部变量对象的修改。

var person = {
 age: 27
};
function foo (person) {
  person.age = 29;
}
foo(person);
person.age // 29;

垃圾回收机制

javaScript中有自动垃圾回收机制,会通过标记清除的算法识别哪些变量对象不再使用,对其进行销毁。开发者也可在代码中手动设置变量值为null(a = null)进行标记清除,让其失去引用,以便下一次垃圾回收时进行有效回收。
垃圾回收算法除了"标记清除",还有一种"引用计数"。

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值