Html5不允许修改但允许赋值,JavaScript | 引用类型变量的赋值问题

JavaScript-引用类型变量的那个坑

HTML5学堂：在JavaScript中，存在着两种不同的变量类型，一种是值类型变量，一种是引用类型变量。其中数组、对象、函数都属于引用类型变量，数值、布尔值、null、undefined、字符串属于值类型变量，不同类型变量在参数传递方面有不同的运行机制。

demo1

function changeName(username){

username = '刘国利';

}

var username = '独行冰海';

changeName(username);

console.log(username);

demo2

function changeName(username){

username[0] = '刘国利';

}

var username = ['独行冰海', '梦幻雪冰', '尹小芃槑', '路过心上', '扶、公子'];

changeName(username);

console.log(username);

两段代码输出结果分别是什么呢？第一段代码输出的是“独行冰海”的字符串，第二段代码输出的是["刘国利", "梦幻雪冰", "尹小芃槑", "路过心上", "扶、公子"] 这个数组。

JavaScript中的两种变量类型：值类型和引用类型。对于有过C语言等编程语言经验的人对这两种类型不陌生，很容易联想到“引用地址”或“指针”的相关概念。下面详细讲解一下两种不同类型的知识。相信在讲解了这两个知识之后，上面的问题也就迎刃而解了。

值类型变量

值类型：数值、布尔值、null、undefined、字符串。

变量的交换等于在一个新的作用域创建一个新的空间，新空间与之前的空间互不相关和影响。

欢迎沟通交流~HTML5学堂

引用类型变量

引用类型：对象、数组、函数。

变量的交换，并不会创建一个新的空间，而是让对象或方法和之前的对象或方法，同时指向一个原有空间(即一个地址)。就如同原来一个人有家门的钥匙，之后这个人结婚了，就配了一把钥匙给自己的妻子，这时候，两个人共同有家的钥匙，但是家还是一个家。

代码分析

弄明白了这两种不同的类型，我们就可以回看我们的代码了。先说第一段代码，外部全局中存在一个变量，username，在函数中形参名也为username，此时，当在局部作用域当中没有var声明变量空间的时候，遇到username这个变量名，首先查看是不是形参，如果是形参，那么直接认为changeName中的username就是形参。形参是属于changeName函数中的，加上传入的参数是值类型变量(字符串)，就又创建了一个存储空间，这个存储空间是不会影响到外部全局变量创建的存储空间的。

第二段代码，虽然也是基本的形参，但是此处传入的是引用类型变量(数组)，那么此时并没有创建一个新的空间，函数的形参以及全局的变量均指向同一个空间，当对两者任意的内容进行修改时，均是在修改一个空间。

欢迎沟通交流~HTML5学堂

Html5不允许修改但允许赋值,JavaScript | 引用类型变量的赋值问题相关推荐

Javascript字符串及数组赋值区别
最近做一个分页的javascript程序,需要先将tbody下面的tr标签全部删除,然后再append新的tr,使用下面的代码 var trs=$d("tbdoys").getEl ...
怎样用javascript给控件赋值,使在服务器端得到此控件的值？或怎样将前台的(或js)中的值传递到后台
问: 怎样用javascript给控件赋值,使在服务器端得到此控件的值? _______________________________________________________________ ...
JavaScript中字符串数组赋值失败，不是每个字符串，却是字符。
我的处女作<Canvas系列教程>在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作. 教程介绍.教程目录等能在README里查阅. 传送门:https: ...
100行JS代码实现❤坦克大战js小游戏源码 HTML5坦克大战游戏代码(HTML+CSS+JavaScript )
坦克大战js小游戏源码 HTML5坦克大战游戏代码(HTML+CSS+JavaScript ) HTML5坦克大战网页小游戏,完美还原小霸王学习机效果,以坦克战斗及保卫基地为主题,属于策略型类游戏. ...
HTML5期末大作业：个人网站设计——个人旅游图片博客HTML5模板(7个页面) HTML+CSS+JavaScript 学生网页课程设计期末作业下载
HTML5期末大作业:个人网站设计--个人旅游图片博客HTML5模板(7个页面) HTML+CSS+JavaScript 学生网页课程设计期末作业下载临近期末, 你还在为HTML网页设计结课作业,老 ...
js给php赋值,JavaScript_javascript给span标签赋值的方法，js给span标签赋值的方法？一般 - phpStudy...
javascript给span标签赋值的方法 js给span标签赋值的方法?一般有两种方法: 第一种方法:输出html function s(){ document.getElementById(&q ...
深入理解PHP中赋值与引用
原文:深入理解PHP中赋值与引用先看下面的问题: <?php $a = 10;//将常量值赋给变量,会为a分配内存空间$b = $a;//变量赋值给变量,是不是copy了一份副本,b也分配了内 ...
c++ 将引用赋值给引用_5分钟掌握 Python 对象的引用
1. 引言引用在各种编程语言中都有涉及,如java中值传递和引用传递.python的对象引用也是学习python过程中需要特别关注的一个知识点,特别是对函数参数传递,可能会引起不必要的BUG.本文将 ...
JavaScript引用数据类型
JavaScript引用数据类型引用类型在ECMAScript中,引用类型是一种数据结构,用于将数据和功能组织在一起(它也常被称为类). Object类型创建Object实例的方式有两种.第一种 ...

Html5不允许修改但允许赋值,JavaScript | 引用类型变量的赋值问题

Html5不允许修改但允许赋值,JavaScript | 引用类型变量的赋值问题相关推荐

最新文章

热门文章