第4章 变量、作用域与内存

引言


由于js是一门只有在声明变量后才能明确类型的语言,并且在任意时刻都可以改变数据类型。这也引起了一些问题


原始值与引用值

原始值就是基本数据类型,引言值就是复杂数据类型
变量在赋值的时候。js会判断如果是原始值,访问时就是按值访问。如果是引用值,访问就是按引用访问

在很多语言中,字符串是使用对象表示的,因此被认为是引用类型。ECMAScript打破了这个惯例。

动态属性

原始值不能动态的crud属性和方法

let name = "Nicholas";
name.age = 27;
console.log(name.age);   // undefined

引用值可以动态的crud属性和方法

let person = new Object();
person.name = "Nicholas";
console.log(person.name); // "Nicholas"

原始类型如果通过new关键字赋值,本质上还是Object类型

let name = new String("Matt");
name.age = 26;

console.log(name.age);     // 26
console.log(typeof name); // object

复制值

原始值之间的赋值是单纯的复制,俩个互不干扰

int num1=5;
int num2=num1;

在这里插入图片描述

引用值之间的赋值是地址的复制,地址指向同一片内存空间。操作的也是同一片内存空间

 let obj1 = new Object();
 obj1.name = "Nicholas";
 let obj2 = obj1;

在这里插入图片描述

传递参数

ECMAScript中所有函数的参数都是按值传递的。js的函数参数当接到传递过来的值后,会开辟一个空间将值赋值给函数参数

改变外部的person可能会错误的认为这是按引用传值,其实这是错误的理解

    function setName(obj) {
      obj.name = "Nicholas";
    }
    let person = new Object();
    setName(person);
    console.log(person.name);   // "Nicholas"

如果是引用传值,那么person.name应该是Greg。

 function setName(obj) {
   obj.name = "Nicholas";
   obj=newObject();
   obj.name="Greg";
 }
 let person = new Object();
 setName(person);
 console.log(person.name);   // "Nicholas"

确定类型

typdeof对原始类型非常有用,但是我们想知道一个引用类型的具体类型。typdeof就无能无力了

所有变量和Object匹配都会返回true,因为所有引用类型都是用Object实现的。
如果用instanceof检测原始值,则始终会返回false,因为原始值不是对象。

console.log(person instanceof Object);   // 变量person是Object吗?
console.log(colors instanceof Array);    // 变量colors是Array吗?
console.log(pattern instanceof RegExp); // 变量pattern是RegExp吗?

执行上下文与作用域

变量或函数的上下文决定了它们可以访问哪些数据,以及它们的行为

全局上下文是最外层的上下文,在浏览器中,全局上下文就是我们常说的window对象,因此所有通过var定义的全局变量和函数都会成为window对象的属性和方法。全局上下文在应用程序退出前才会被销毁

局部上下文在其所有代码都执行完毕后会被销毁,包括定义在它上面的所有变量和函数

搜索过程始终从作用域链的最前端开始,然后逐级往后,直到找到标识符。(如果没有找到标识符,那么通常会报错。)

每个上下文都可以到上一级上下文中去搜索变量和函数,但任何上下文都不能到下一级上下文中去搜索。

变量声明

1. 使用var的函数作用域声明

在使用var声明变量时,变量会被自动添加到最接近的上下文

如果变量未经声明就被初始化了,那么它就会自动被添加到全局上下文(在调用函数后会被创建)

function add(num1, num2) {
  var sum = num1 + num2;
  return sum;
}
let result = add(10, 20); // 30
console.log(sum);           // 报错:sum在这里不是有效变量

var声明会被拿到函数或全局作用域的顶部,位于作用域中所有代码之前

提升让同一作用域中的代码不必考虑变量是否已经声明就可以直接使用(不要使用

console.log(name); // undefined
var name = 'Jake';
function() {
  console.log(name); // undefined
  var name = 'Jake';
}

2. 使用let的块级作用域声明

let和var最大的区别是作用域是块级的,换句话说,if块、while块、function块,甚至连单独的块也是let声明变量的作用域

if (true) {
  let a;
}
console.log(a); // ReferenceError: a没有定义
while (true) {
  let b;
}
console.log(b); // ReferenceError: b没有定义
function foo() {
  let c;
}
console.log(c); // ReferenceError: c没有定义
                // 这没什么可奇怪的
                // var声明也会导致报错
// 这不是对象字面量,而是一个独立的块
// JavaScript解释器会根据其中内容识别出它来
{
  let d;
}
console.log(d); // ReferenceError: d没有定义

let与var的另一个不同之处是在同一作用域内不能声明两次

let的行为非常适合在循环中声明迭代变量。使用var声明的迭代变量会泄漏到循环外部,这种情况应该避免

3. 使用const的常量声明

使用const声明的变量必须同时初始化为某个值。一经声明,在其生命周期的任何时候都不能再重新赋予新值。

const a; // SyntaxError:常量声明时没有初始化
const b = 3;
console.log(b); // 3
b = 4; // TypeError: 给常量赋值

const除了要遵循以上规则,其他方面与let声明是一样的:

赋值为对象的const变量不能再被重新赋值为其他引用值,但对象的键则不受限制。

const o1 = {};
o1 = {}; // TypeError:给常量赋值
const o2 = {};
o2.name = 'Jake';
console.log(o2.name); // 'Jake'

垃圾回收

JavaScript是通过自动内存管理实现内存分配和闲置资源的语言。确定哪个变量不会再使用,然后释放它占用的内存。这个过程是周期性的,即垃圾回收程序每隔一定时间就会自动运行

标记清理

从根上下文(通常是全局上下文或当前执行的函数)开始,遍历所有的变量和对象。将所有可达(被引用)的对象标记为“存活”。在标记阶段之后,遍历整个内存空间,将未标记为“存活”的对象判定为垃圾,进行清除。这些未标记的对象会被销毁,其占用的内存将被释放。

引用计数

对每个值都记录它被引用的次数。声明变量并给它赋一个引用值时,这个值的引用数为1。如果同一个值又被赋给另一个变量,那么引用数加1,如果保存对该值引用的变量被其他值给覆盖了,那么引用数减1。当一个值的引用数为0时,就说明没办法再访问到这个值了,因此可以安全地收回其内存了。垃圾回收程序下次运行的时候就会释放引用数为0的值的内存。

这种方法没有办法解决循环引用的问题,即俩个对象互相引用

function problem() {
  let objectA = new Object();
  let objectB = new Object();
  objectA.someOtherObject = objectB;
  objectB.anotherObject = objectA;
}

内存管理

将内存占用量保持在一个较小的值可以让页面性能更好。优化内存占用的最佳手段就是保证在执行代码时只保存必要的数据。

解除引用。这个建议最适合全局变量和全局对象的属性。局部变量在超出作用域后会被自动解除引用

function createPerson(name){
  let localPerson = new Object();
  localPerson.name = name;
  return localPerson;
}
let globalPerson = createPerson("Nicholas");
// 解除globalPerson对值的引用,
globalPerson = null;

解除引用的关键在于确保相关的值已经不在上下文里了,因此它在下次垃圾回收时会被回收。

1. 通过const和let声明提升性能

由于const和let的块级作用域,让他们可能更早被垃圾回收

2. 隐藏类和删除操作

js引擎V8会在后台配置,让这两个类实例共享相同的隐藏类,因为这两个实例共享同一个构造函数和原型

function Article() {
  this.title = 'Inauguration Ceremony Features Kazoo Band';
}
let a1 = new Article();
let a2 = new Article();

如果在后面添加如下代码后,此时两个Article实例就会对应两个不同的隐藏类。根据这种操作的频率和隐藏类的大小,这有可能对性能产生明显影响。

a2.author = 'Jake';

为了避免性能的消耗,最好的法子就在构造函数中一次性声明完毕

function Article(opt_author) {
  this.title = 'Inauguration Ceremony Features Kazoo Band';
  this.author = opt_author;
}
let a1 = new Article();
let a2 = new Article('Jake');

在代码结束后,即使两个实例使用了同一个构造函数,它们也不再共享一个隐藏类。动态删除属性与动态添加属性导致的后果一样

function Article() {
  this.title = 'Inauguration Ceremony Features Kazoo Band';
  this.author = 'Jake';
}
let a1 = new Article();
let a2 = new Article();
delete a1.author;

最佳实践是把不想要的属性设置为null。这样可以保持隐藏类不变和继续共享,同时也能达到删除引用值供垃圾回收程序回收的效果。

function Article() {
  this.title = 'Inauguration Ceremony Features Kazoo Band';
  this.author = 'Jake';
}
let a1 = new Article();
let a2 = new Article();
a1.author = null;

3. 内存泄漏

在内存有限的设备上,或者在函数会被调用很多次的情况下,内存泄漏可能是个大问题。

最常见的内存泄露,方法被调用后会在window上挂载一个name属性。只要window不被清除,那么这个属性就一直存储。使用let,const可以避免这种情况的发生

function setName() {
  name = 'Jake';
}

由于定时器的回调函数一直调用name,所以name永远不会被清除

let name = 'Jake';
setInterval(() => {
  console.log(name);
}, 100);

js中的闭包很容易造成内存泄露的问题,调用outer()会导致分配给name的内存被泄漏。以上代码执行后创建了一个内部闭包,只要返回的函数存在就不能清理name,因为闭包一直在引用着它

let outer = function() {
  let name = 'Jake';
  return function() {
    return name;
  };
};

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/62476.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【Linux】网络套接字知识点补足

目录 1 地址转换函数 1.1 字符串转in_addr的函数: 1.2 in_addr转字符串的函数: 1.3 关于inet_ntoa 2 TCP协议通讯流程 1 地址转换函数 本节只介绍基于IPv4的socket网络编程,sockaddr_in中的成员struct in_addr sin_addr表示32位 的IP 地址但是我们通常用点分十进制的字符串…

认识 spring AOP (面向切面编程) - springboot

前言 本篇介绍什么是spring AOP, AOP的优点,使用场景,spring AOP的组成,简单实现AOP 并 了解它的通知;如有错误,请在评论区指正,让我们一起交流,共同进步! 文章目录 前言1. 什么是s…

js-6:typeof和instanceof的区别

1、typeof typeof操作符返回一个字符串,表示未经计算的操作数的类型。 operand表示对象或原始值的表达式,其类型将被返回。 从上面的例子可以看出,前6个都是基础数据类型,虽然typeof null为object,但这只是javascrip…

Qt扫盲-Model/View入门

Model/View 编程入门 一、概述二、介绍1. 标准部件2. Model/View 控件3. Model/View控件概述4. 在表格单和 model 之间使用适配器 Adapters 三、 简单的 model / view 应用程序示例1. 一个只读表2. 使用role扩展只读示例3. 表格单元中的时钟4. 为列和行设置标题5. 最小编辑示例…

20天学会rust(二)rust的基础语法篇

在第一节(20天学rust(一)和rust say hi)我们配置好了rust的环境,并且运行了一个简单的demo——practice-01,接下来我们将从示例入手,学习rust的基础语法。 首先来看下项目结构: 项目…

OpenUSD联盟:塑造元宇宙的3D未来

一、引言 近日,美国3D内容行业的五家主要公司苹果、英伟达、皮克斯、Adobe和Autodesk联合成立了OpenUSD联盟(AOUSD)。这一联盟的成立标志着元宇宙领域的一次重要合作,旨在制定元宇宙的3D图形标准。本文将深入探讨OpenUSD联盟的目…

MySQL 在CentOS下安装

yum安装 1、yum源安装 yum install mariadb-server2、启动MySQL服务 systemctl start mariadb3、查看运行状态 systemctl status mariadb4、设置初始密码 mysql -u rootuse mysql;update user set passwordpassword("root")where userroot;flush privileges;e…

车载软件架构 —— 闲聊几句AUTOSAR OS(十)

我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 没有人关注你。也无需有人关注你。你必须承认自己的价值,你不能站在他人的角度来反对自己。人生在世,最怕的就是把别人的眼光当成自己生活的唯一标…

嵌入式开发学习(STC51-16-ADC模数转换)

内容 通过ADC转换电路采集电位器AD值,将采集的AD值转换成电压值,通过数码管显示出来; 采集光敏电阻的AD值; 采集热敏电阻的AD值; 采集外部通道AIN3的电压值; 为了方便显示,我们可以通过独立…

C高级 作业 day3 8/4

1.整理思维导图 2.判断家目录下,普通文件的个数和目录文件的个数 1 #!/bin/bash2 arr(ls -l ~ | cut -d r -f 1 | grep -w d )3 arr1(ls -l ~ | cut -d r -f 1 | grep -w -)4 echo "目录文件个数为 ${#arr[*]}"5 echo "普通文件个数为 ${#arr1[*]}&q…

小程序开发趋势:探索人工智能在小程序中的应用

第一章:引言 小程序开发近年来取得了快速的发展,成为了移动应用开发的重要一环。随着人工智能技术的飞速发展,越来越多的企业开始探索如何将人工智能应用于小程序开发中,为用户提供更智能、便捷的服务。本文将带您一起探索人工智能…

40.利用欧拉法求解微分方程组(matlab程序)

1.简述 求解微分方程的时候,如果不能将求出结果的表达式,则可以对利用数值积分对微分方程求解,获取数值解。欧拉方法是最简单的一种数值解法。前面介绍过MATLAB实例讲解欧拉法求解微分方程,今天实例讲解欧拉法求解一阶微分方程组。…

js-7:javascript原型、原型链及其特点

1、原型 JavaScript常被描述为一种基于原型的语言-每个对象拥有一个原型对象。 当试图访问一个对象的属性时,它不仅仅在该对象上搜寻,还会搜寻该对象的原型,以及该对象的原型的原型,依次层层向上搜索,直到找到一个名字…

vs导出和导入动态库和静态库

1. 动态库和导出和导入 1.1 动态库的导出 1. 创建新项目 新建新项目,选择动态链接库(DLL)。 填写项目名称,并选择项目保存的路径,然后点击创建。 创建完成后,会自动生成如下所示文件,可以根据…

LabVIEW使用DSA技术从X射线图像测量肺气容量

LabVIEW使用DSA技术从X射线图像测量肺气容量 相衬X射线(PCX)成像技术利用相邻介质之间折射率的微小差异来增强传统X射线成像通常不可见的物体的边界。事实证明,这一进展在一系列生物医学和材料科学中非常有益于材料表征、疾病检测以及解剖形…

C语言 — 动态内存管理(动态内存函数)

前言 本期分为三篇介绍动态内存管理相关内容,关注博主了解更多 博主博客链接:https://blog.csdn.net/m0_74014525 本期介绍动态内存函数,函数如何使用、函数格式、在使用在所需要的注意点及C/C程序的内存开辟区域 系列文章 第一篇&#xff…

RGB_LCD简介

文章目录 前言一、LCD原理1、构造2、分辨率3、像素格式4、LCD接口5、ATK-7016 的屏幕接口原理图 二、LCD时序1、时间参数2、行场时序1、行显示时序:2、场显示时序:3、数据同步模式4、像素时钟 三、总结四、参考资料 前言 LCD (Liquid Crystal Display)是…

数据结构——双链表

我宁愿靠自己的力量,打开我的前途,而不愿求有力者垂青 文章目录 双线向链表各接口函数名或变量名 双向链表接口实现源码 快速索引【头文件及函数声明】 双向链表接口实现 双向链表的构造分析 双向链表的定义及初始化 双向链表的插入和删除 往期…

音频客观感知MOS对比,对ViSQOL、PESQ、MosNet(神经网络MOS分)和polqa一致性对比和可信度验证

原创:转载需附链接: https://blog.csdn.net/qq_37100442/article/details/132057139?spm1001.2014.3001.5502 一、背景 Mos分评价音质重要指标,最近也有很多机构和公司在研究适合自己的评价体系。目前Mos分主要分为主观评测和客观感知评价。…

智能仪表板DevExpress Dashboard v23.1亮点 - 增强对自定义导出的支持

DevExpress Dashboard v23.1版本增强了自定义导出到Excel的功能等,欢迎下载最新版本体验! DevExpress Dashboard v23.1正式版下载(Q技术交流:523159565) 所有平台 导出自定义仪表板项目到Excel 用户现在可以在WinForms和Web应…