前言: 

  Javascript语言中的变量和其他语言的变量有很大区别,javascript松散类型的本质,决定了它只是在特定时间时间保存特定值得名字而已。由于不存在定义某个变量必须保存何种数据类型值的规则,变量的值及其数据类型可以在脚本的生命周期内改变,从某种程度讲,这是一个既强大又容易出问题的特性。

  本文将从以下几点介绍ECMAScript变量的定义分类以及特性:

   1.ECMAScript变量中数据类型的值的分类

   2.定义基本类型的值和引用类型的值的方式

   3.如何复制变量的值,复制的原理解读

   4.参数的传递过程

   5.类型的检测

 正文内容:

  1.ECMAScript变量中数据类型的值的分类

  ECMAScript中变量可能包含两种不同类型的值:基本类型的值和引用类型的值。

  基本类型:undefined,null,number,boolean,string。

  引用类型:数组,对象,函数

  区别比较:存储位置不同,基本类型是存储在栈内存中的简单字段,占据空间小,大小固定,属于被频繁使用的数据;而引用数据类型是存储在堆内存中的对象,占据空间大,大小不固定,如果存储在栈内存中,将影响程序运行的性能;引用类型的指针存储在栈内存中,该指针指向堆中该实体的起始位置,当解释器寻找引用值时,会首先检索栈中的地址,取得指针后从堆中获取实体。为了方便理解可以参考下图:

  

  

  2.定义基本类型的值和引用类型的值的方式

  定义基本类型的值和引用类型的值的方式类似:创建一个变量并为这个变量赋值。当这个值保存到变量中后,对于不同类型的值可以执行的操作就大相径庭了。对于引用类型,我们可以为其添加属性和方法,也可以改变和删除其属性和方法,大家可以参考下面的例子来加深理解:

         var obj = new Object();      obj.name = 'hwg';      alert(obj.name); //hwg  以上代码代码创建一个对象并且为其设置了一个name属性,并给属性赋值为hwg,如果对象不被销毁,那么这个属性将一直存在。对于基本数据类型进行同样操作如下代码:

      var name = 'hwg';

      name.age = 22;

      alert(name.age);//undefined

  在这个例子中我们给字符串name定义了一个age属性,并且给其赋值22,最后进行访问发现这个属性不见了,打印输出undefined说明基本类型不能添加属性,否则会报错。

  3.如何复制变量的值,复制的原理解读

  从一个变量向另一个变量赋值基本类型和引用类型的值时,也存在不同。首先来看基本类型值得复制过程:

    例子:  var num = 5;

        var num1 = num;

  再次,num中先存入值5,当使用num来初始化num1时,num1中也保存了值5,但是num1中的5和num中的5在内存中是独立的,num1的值可以理解为是num值得一个副本,此后两个变量可以参与任何操作且不互相影响,为了方便理解请看下图:

  

复制前
   
num 5(Number类型)

  

复制后
   
num 5(Number类型)
num1 5(Number类型)


 
 当从一个变量向另一个变量复制引用类型类型的值时,同样也会将存储在变量对象中的值复制一份放到新开辟的内存空间。不同的是,这个值得副本是一个指针,这个指针指向存储在堆中的一个对象,复制结束后,本质上两个变量将会引用同一个堆中的对象,因此改变其中一个变量,另一个变量也会受到影响,请看下面例子:

          var obj = new Object();

          var obj1 = obj;

          obj.name = 'hwg';

          alert(obj1.name);//hwg

  首先,变量obj保存了一个新对象的实例,然后将obj的值赋值给obj1,此时,obj和obj1都指向同一个对象。这样给对象obj添加属性name后,也可以通过obj1进行访问这个属性。图示如下:

  

  4.参数的传递过程

  ECMAScript中所有的函数的参数都是按照值来进行传递的,把函数外部的值传递给函数内部的参数,就如同把值从一个变量复制到另一个变量一样。

  在向参数传递基本类型的值时,被传递的值会复制给一个局部变量;在向参数传递一个引用类型的参数时,会把这个值在内存中的地址复制给一个局部变量。

  为了更好理解传参,请看下面几个例子:

    function add(num){

      num += 1;

      return num;

    }

    var con = 10;

    var result = add(con);

    alert(con);//10

    alert(result);//11

  这个例子中的局部变量是add函数的num,在调用这个函数时,变量con作为参数把值10传递给参数num。此时变量con在内存中被复制了一份给参数num以便在函数add中对其进行操作,这样在函数内部操作num的时候,就不会影响函数外部的con变量。下面我们再来使用对象来加深理解,代码如下:

   function setAge(obj){

    obj.age = 20;//给obj对象设置name属性

    }

   var object = new Object();

   setAge(object);

   alert(object.age);//20

   以上代码初始化一个对象,并将其保存在object中,然后调用setAge函数,此时变量object就被复制给了局部变量obj。在函数内部,obj和object引用的是同一个对象。也就是说即使这个变量是按照值来进行传递的,obj也会按照引用来访问同一个对象。此时在函数内部给obj添加age属性的时候,函数外部的object也将有所反应,此处请牢记函数的参数都是按值传递的,实际上,当在函数内部重写obj或者给obj添加属性时,这个变量obj引用的就是一个局部对象,而这个局部对象会在函数执行完毕后销毁,不会影响全局变量。

   5.类型的检测

   基本类型的检测使用typeof,引用类型的检测就用instanceof,ECMA规定任何在内部实现了[[call]]方法的对象都应该在应用typeof操作符时候返回'function'。下面举几个小例子方便理解

    var a = 'aaa';

    alert(typeof a);//string

    var person = new Object();

    alert(person instanceof Object)//true

    

 总结:

 javascript中的变量可以保存两种类型:基本类型和引用类型,特点如下:

  基本类型的值在内存中占据固定大小的空间,因此被保存在栈内存;

  从一个变量向另一个变量复制基本类型的值,会创建这个值得一个副本;

  引用类型的值是对象,保存在堆内存中;

  包含引用类型的变量实际是包含的是一个指向该对象的指针,这个指针保存在栈内存,在从一个变量向另一个变量复制引用类型的值,复制的其实就是指针,并且这两个变量最终指向的都是堆内存中的同一个对象;

  函数的参数都是按值传递的;

  基本类型的检测使用typeof,引用类型的检测就用instanceof。

转载于:https://www.cnblogs.com/msth/p/8881880.html

javascript变量中基本类型和引用类型的详解解读相关推荐

  1. javascript中基本类型和引用类型的区别分析

    大多数人系统学习过的程序设计语言,在这些语言的学习过程中最早学到的几个要点之一就是值类型和引用类型的区别.下面我们来看一下在 JavaScript 中基本数据类型(Primitive Types)和引 ...

  2. java面向对象(类与对象,局部变量成员变量,基本类型和引用类型作为参数传递)...

    一.类和对象的区别 类是对某一类事物的抽象描述,而对象用于表示现实中该类事物的个体 可以将玩具模型看作是一个类,将一个个玩具看作对象,从玩具模型和玩具之间的关系便可以看出类与对象之间的关系.类用于描述 ...

  3. Javascript高级程序设计——基本类型和引用类型的值

    ECMAScript中的变量有两种不同的数据类型的值: 基本类型:基本类型的值是简单的数据段.包括:Undefined.Null.Number.Boolean.String五种 引用类型:引用类型的值 ...

  4. ECMAScript中基本类型和引用类型的值在复制变量值时的区别

    一. 复制基本类型变量的值 如果从一个变量向另一个变量复制基本类型的值时,会在原变量对象上创建一个新值,然后把该值复制到为新变量分配的位置上. 举例: var a1=5; var a2=a1; ale ...

  5. javascript中基本类型和引用类型复制变量的值

    基本类型值指的是简单地数据段,引用类型的值指的是那些可能由多个值构成的对象. 基本数据类型:Undefined,Null,Boolean,Number,String. 如果从一个变量向另一个变量复制基 ...

  6. JavaScript基本类型和引用类型

    目录 介绍 背景 JavaScript数据类型 基本类型 基本类型的行为如何? 使用typeof运算符 语法类型 为什么null返回对象? 参考类型 创建对象 对象的行为如何? 销毁对象 基本类型和引 ...

  7. JavaScript 基本类型和引用类型区别

    基本概念 JS有以下这些数据类型:undefined.null.string.boolean.number.symbol.bigint.object. 其中,前面 7 个被称为基本类型,又叫原始类型( ...

  8. Java Native Interface 二 JNI中对Java基本类型和引用类型的处理

    本文是<The Java Native Interface Programmer's Guide and Specification>读书笔记 Java编程里会使用到两种类型:基本类型(如 ...

  9. java 定义变量时 赋值与不赋值_探究Java中基本类型和部分包装类在声明变量时不赋值的情况下java给他们的默认赋值...

    探究Java中基本类型和部分包装类在声明变量时不赋值的情况下java给他们的默认赋值 当基本数据类型作为普通变量(八大基本类型: byte,char,boolean,short,int,long,fl ...

最新文章

  1. linux Makefile 中使用 shell命令
  2. 查询oracle中所有用户信息
  3. 如何在dw上编写php_用dw制作php网站视频教程
  4. 飞鸽传书开发者都在为生计发愁?
  5. php 姓氏表,PHP拆分姓名中的姓氏和名字函数
  6. 让数据可视化告诉你,中秋吃这样的月饼绝对没错
  7. java虚拟机内存溢出的三个原因_java虚拟机学习(三) 内存溢出异常
  8. win10+VS2013+OPENCV如何配置于仕琪人脸检测算法
  9. 脚本框架源码,多线程,完美框架,极限多开,随意游戏可套入,端游手游
  10. RJ45布线 568A 和568B布线标准
  11. 格拉姆-施密特正交化
  12. 病例演讲比赛PPT模板
  13. C# 计算指定年月的当月工作日方法
  14. 什么是404页面,如何正确设置制作404页面
  15. 深入中英文的排版与换行
  16. 润乾——润乾报表错误
  17. HP-SOCKET 使用C方法-Pull
  18. android glide 清除缓存,安卓内存清理之Glide
  19. DOCKER部署gitlab-ce中文版或最新英文版
  20. java后台生成并下载二维码

热门文章

  1. 10年后,阿里给千万开源人写了一封信
  2. 什么技能产品经理不会提,但技术人必须懂?
  3. 工程师男友如何反窃听?趣聊密码学入门科普
  4. java 参数传递_java中方法的参数传递机制
  5. 由浅到浅入门批量渲染(三)
  6. 拯救跟我一样的初学者:XML到底是什么玩意,用能让初学者听得懂的话
  7. python 面向对象之:反射,双下方法
  8. 3. CMake 系列 - 分模块编译安装项目
  9. appium 搭建及实例
  10. 基于Schema配置的AOP