变量作用域与内存(下)

js 变量作用域与内存(下)

🙌执行上下文与作用域

执行上下文简称上下文,变量或者函数的上下文决定了它可以访问那些数据,每一个上下文都有一个活动对象,上下文定义的变量和函数都存在与这个对象上,全局上下文也就是 window 对象。var 定义的全局变量都会成功为 window 的对象的属性和方法。当前上下文在其说有的代码执行完毕后会被销毁。

每一个函数都有自己的上下文,当执行流进入函数的时候,函数的上下文会被添加到全局上下文的栈上面,当这个函数执行完毕后,函数上下文会被弹出栈并将控制权返回给之前执行的上下文

在上下文中的代码执行中,会创建变量的作用域链,他决定了各级上下文中的代码在访问变量和函数的时序,作用域链中的下一个变量对象来自包含上一个上下文,在下一个对象来自下一个包含上下文,全局上下文始终是最后有一个变量对象

javascript 复制代码
var color = "blue";

function changecolor(){

  let authercolor = "red";

  function swapcolor(){

    let temp = authercolor;

    authercolor = color;

    color = temp;

    //这里可以访问 color authercolor temp

  }

  //这个可以访问 color authercolor 但访问不到temp

  swapcolor()

}

changecolor() //这里只能访问color

👀作用域链增强

上下文只要有全局上下文和函数上下文两种,某些语句会导致在作用域链的前端临时添加一个上下文,这个上下文在执行后会被删除

  • try/catch语句的catch块

  • with语句

对于with语句来说,会向作用域链最前端添加指定对象;对于catch而言会创建一个新的变量对象;

javascript 复制代码
function buildUrl(){

  let qs = "xxxxxx";

  with(location){

    var url = href + qs;

  }

  return val;

}

在上的代码中,with语句中会发现href没有定义,实际上with语句传入了lacaltion对象,而href变量也就是location.href,with语句在作用域链的前端添加了location活动对象,在变量搜索的时候会从location对象开始。在with语句var定义的变量会被当作函数上下文中的变量

✨js的垃圾回收

javascript是使用垃圾回收语言,也就是在代码的运行时环境管理内存,在js中只要是使用标记清理法来释放内存,垃圾回收在各个浏览器的执行频率有所不同

#####🐱‍👤🐱‍👤 标记清理法

当垃圾回收程序运行的时候会标记内存中的所有变量(标记的方法有很多种),然后在消除所有在上下文中的变量的标记,剩下的带有标记的变量就是需要清除的变量,因为在此之后的上下文已经访问不到了这些变量。

🐱‍🐉🐱‍🐉内存管理

🤔😆合理解除对象的引用
javascript 复制代码
function create(name){

  let lacal = new Object();

  lacal.name = name;

  return local

}

let global = create("xxx");

global = null

在上面的代码中,在调用函数create后赋值给global变量中,当这个变量不会再使用的时候需要将变量赋值为null,这样不会让变量立马被回收,但是会加快变量的回收时机,因为垃圾回收程序是周期性的执行,当垃圾回收程序代码检测到这个变量的引用为空,就会回收此变量。

🤳使用const和let声明

因为const 与 let 声明是块级作用域,函数上下文执行完毕后,会加快垃圾会回收,这与上一个的思路是一样的

🎂🌹内存泄露

意外的声明过多的全局变量容易造成内存泄漏,导致垃圾回收程序无法回收变量,

定时器一直引用着外部变量,导致变量无法回收

javascript 复制代码
let name = "djy";

setInterval(()=>{

  cansol.log(name);

},100);

上面代码定时器内部一直引用着name,垃圾回收程序不会回收name变量

闭包:

javascript 复制代码
let outher = function(){

  let name = "djy";

  return function(){

    return name;

}

这会导致分配给name的内存泄露,创建了一个内部闭包,只要auther函数存在就不能清理name,因为闭包一直引用着它

✨✨✨✨总结✨✨✨

对js的内存管理,变量更加熟悉,强力推荐这本书《javascript 高级程序设计》

相关推荐
长天一色6 分钟前
【ECMAScript 从入门到进阶教程】第三部分:高级主题(高级函数与范式,元编程,正则表达式,性能优化)
服务器·开发语言·前端·javascript·性能优化·ecmascript
NiNg_1_23426 分钟前
Vue3 Pinia持久化存储
开发语言·javascript·ecmascript
读心悦27 分钟前
如何在 Axios 中封装事件中心EventEmitter
javascript·http
神之王楠1 小时前
如何通过js加载css和html
javascript·css·html
余生H1 小时前
前端的全栈混合之路Meteor篇:关于前后端分离及与各框架的对比
前端·javascript·node.js·全栈
流烟默1 小时前
Vue中watch监听属性的一些应用总结
前端·javascript·vue.js·watch
茶卡盐佑星_2 小时前
meta标签作用/SEO优化
前端·javascript·html
与衫2 小时前
掌握嵌套子查询:复杂 SQL 中 * 列的准确表列关系
android·javascript·sql
金灰2 小时前
HTML5--裸体回顾
java·开发语言·前端·javascript·html·html5
Promise5202 小时前
总结汇总小工具
前端·javascript