首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js变量赋值 引用

在JavaScript中,变量赋值可以分为两种情况:基本数据类型(如字符串、数字、布尔值、null、undefined和Symbol)的赋值和引用数据类型(如对象、数组和函数)的赋值。

基本数据类型赋值

基本数据类型的赋值是按值传递的。这意味着当你将一个基本数据类型的变量赋值给另一个变量时,实际上是将该值的副本赋给了新变量。因此,两个变量是完全独立的,修改其中一个不会影响另一个。

代码语言:txt
复制
let a = 10;
let b = a; // b现在是a的副本
b = 20; // 修改b的值
console.log(a); // 输出: 10
console.log(b); // 输出: 20

引用数据类型赋值

引用数据类型的赋值是按引用传递的。这意味着当你将一个引用数据类型的变量赋值给另一个变量时,实际上是将该对象的引用(内存地址)赋给了新变量。因此,两个变量指向的是同一个对象,修改其中一个会影响另一个。

代码语言:txt
复制
let obj1 = { name: 'Alice' };
let obj2 = obj1; // obj2现在引用的是同一个对象
obj2.name = 'Bob'; // 修改obj2的属性
console.log(obj1.name); // 输出: Bob
console.log(obj2.name); // 输出: Bob

优势

  • 基本数据类型赋值:简单、直观,适用于不需要共享数据的场景。
  • 引用数据类型赋值:节省内存,适用于需要共享数据的场景。

应用场景

  • 基本数据类型赋值:适用于简单的数值计算、字符串处理等场景。
  • 引用数据类型赋值:适用于复杂的数据结构操作、对象方法调用等场景。

常见问题及解决方法

  1. 意外修改对象:由于引用传递的特性,可能会意外修改对象。可以通过深拷贝来避免这种情况。
代码语言:txt
复制
let obj1 = { name: 'Alice' };
let obj2 = JSON.parse(JSON.stringify(obj1)); // 深拷贝
obj2.name = 'Bob';
console.log(obj1.name); // 输出: Alice
console.log(obj2.name); // 输出: Bob
  1. 循环引用:在处理复杂对象时,可能会遇到循环引用的问题。可以使用一些库(如lodash的_.cloneDeep)来处理深拷贝。
代码语言:txt
复制
const _ = require('lodash');

let obj1 = { name: 'Alice' };
obj1.self = obj1; // 循环引用
let obj2 = _.cloneDeep(obj1); // 使用lodash处理深拷贝
console.log(obj2); // 输出: { name: 'Alice', self: [Circular] }

通过理解这两种赋值方式的区别和应用场景,可以更好地进行JavaScript编程,避免一些常见的错误。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

关于引用变量赋值问题

DOCTYPE html> 02_关于引用变量赋值问题 ...-- 关于引用变量赋值问题 * 2个引用变量指向同一个对象, 通过一个引用变量修改对象内部数据, 另一个引用变量也看得见 * 2个引用变量指向同一个对象,让一个引用变量指向另一个对象, 另一个引用变量还是指向原来的对象...--> //1. 2个引用变量指向同一个对象, 通过一个引用变量修改对象内部数据, 另一个引用变量也看得见 var obj1...console.log(obj1.name) function f1(obj) { obj.age = 12 } f1(obj2) console.log(obj1.age) //2. 2个引用变量指向同一个对象...,让一个引用变量指向另一个对象, 另一个引用变量还是指向原来的对象 var obj3 = {name: 'Tom'} var obj4 = obj3 obj3 = {name: 'JACK'

2.1K00
  • 原生JS | 值类型与引用类型变量

    HTML5学堂-码匠:在JavaScript中,存在着两种不同的变量类型,一种是值类型变量,一种是引用类型变量。...其中数组、对象、函数都属于引用类型变量,数值、布尔值、null、undefined、字符串属于值类型变量,不同类型变量在参数传递方面有不同的运行机制。...不同类型的数据在“赋值”时机制并不相同。 欢迎沟通交流~~~HTML5学堂(码匠) 值类型变量 值类型包括:数值、布尔值、null、undefined、字符串。...对于值类型变量,变量的交换(将一个变量赋值给另一个变量)相当于是创建了一个新的空间,把原有的变量值复制一份,并将其存储在新空间当中,新空间与之前空间互不影响。...引用类型变量 引用类型包括:对象、数组、函数。 引用类型变量的交换,并不会创建一个新的空间,而是让新变量和之前的变量,同时指向一个原有空间(即同一个地址)。可以理解为C语言的指针。

    3.5K90

    makefile变量赋值

    大家好,又见面了,我是全栈君 在定义变量的值时,我们可以使用其它变量来构造变量的值,在Makefile中有两种方式来在用变量定义变量的值。...先看第一种方式,也就是简单的使用“=”号,在“=”左侧是变量,右侧是变量的值,右侧变量的值可以定义在文件的任何一处,也就是说,右侧中的变量不一定非要是已定义好的值,其也可以使用后面定义的值。...可见,变量是可以使用后面的变量来定义的。...,只能使用前面已定义好了的变量。...因为在操作符的右边是很难描述一个空格的,这里采用的技术很管用,先用一个 Empty变量来标明变量的值开始了,而后面采用“#”注释符来表示变量定义的终止,这样,我们可以定义出其值是一个空格的变量。

    1.4K20

    PHP的变量赋值

    PHP的变量赋值 这个标题估计很多人会不屑一顾,变量赋值?excuse me?我们学开发的第一课就会了好不好。但是,就是这样基础的东西,反而会让很多人蒙圈,比如,值和引用的关系。...然后,变量给变量赋值。 1$a1 = $a; 2$b1 = $b; 3$c1 = $c; 4$d1 = $d; 请注意,前三个的赋值都是正常的赋值,也就是对具体内容的拷贝。...这种情况就是我们所说的引用赋值。当d1发生变化时,d2也会产生变化。 可以这么说:引用赋值就是为原变量建立了一个Windows下的快捷方式或者Linux中的软链接。...那么对象形式的引用赋值呢?...最后,轻松一下,引用变量的赋值就和我们给方法传引用参数一样的,使用一个&符号就可以啦!

    3.4K30

    变量的解构赋值

    变量的解构赋值.png 变量的解构赋值 数组的解构赋值 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构 本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值...如果解构不成功,变量的值就等于undefined 不完全解构,即等号左边的模式,只匹配一部分的等号右边的数组 对于 Set 结构,也可以使用数组的解构赋值 只要某种数据结构具有 Iterator 接口...对象的属性没有次序,变量必须与属性同名,才能取到正确的值 对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量 真正被赋值的是后者不是前者 与数组一样,解构也可以用于嵌套结构的对象 对象的解构也可以指定默认值...,因此可以对数组进行对象属性的解构 字符串的解构赋值 字符串被转换成了一个类似数组的对象 类似数组的对象都有一个length属性,因此还可以对这个属性解构赋值 数值和布尔值的解构赋值 解构赋值时,如果等号右边是数值和布尔值...用途 交换变量的值 从函数返回多个值 函数参数的定义 提取 JSON 数据 函数参数的默认值 遍历 Map 结构 输入模块的指定方法

    1.9K20

    【前端】JavaScript 变量引用、内存与数组赋值:深入解析三种情景

    初学者在使用 JavaScript 时,通常会遇到一些关于变量引用和赋值的困惑。...要理解这个问题,我们需要深入理解 JavaScript 中的变量赋值与引用的区别。 1....这些类型的数据是按引用传递的,变量保存的是对象的内存地址,而不是对象本身。 对于基本数据类型,变量赋值是直接复制值的副本,因此两个变量之间不会互相影响。...在本文中,我们详细探讨了三种代码场景,并通过对比分析深入理解了以下几点: 变量赋值与引用:赋值为引用数据类型时,变量保存的是内存地址,而不是数据本身。因此,重新赋值并不会影响其他引用该数据的变量。...修改数组内容与重新赋值:直接修改数组的内容会影响所有引用该数组的变量,而重新赋值则会让变量指向一个新的对象,不影响其他引用。

    12500

    【JavaScript】JavaScript 变量 ② ( JavaScript 变量语法扩展 | 同时声明多个变量 | 只声明变量不赋值 | 不声明变量不赋值 | 不声明变量直接进行赋值 )

    中 声明变量 , 使用 let 关键字 在 块级作用域 中 声明变量 , 如果 声明时 , 不进行赋值 , 变量 会被自动初始化为 undefined 值 ; 如果 使用 const 关键字 在 块级作用域..." undefined " ; 3、不声明变量不赋值 在 JavaScript 中 , 不声明变量 , 不对该变量进行赋值 , 直接使用该变量 , 编译时不报错 , 执行时会报错 : demo.html...在 JavaScript 中 , 不声明变量 直接进行赋值 , 可以直接使用该变量 ; 如果 不显式声明变量 , 就直接进行 赋值使用 , 那么 这个变量会自动成为全局变量 , 在严格模式下直接报错..., 不推荐这种方法 ; 代码示例 : // 不声明变量直接进行赋值 // 该变量会变为全局变量 name2 = "Jerry";...> 执行后 , 该 不声明 直接赋值 的变量 可以使用 ;

    13910
    领券