一、什么是变量?

在JavaScript中,变量用来存放值的,存放任何数据类型的值都可以,它就是值的容器。

二、变量怎么用?

(一)用var声明1个变量

在使用变量之前,需要var关键字来声明变量,变量的名字要有意义。比如:

(等号“=”就是赋值运算符,它的作用是把右侧的值 赋给 左侧的变量、对象属性、数组元素)

我们声明1个变量num,在变量num中存放(通过赋值来实现)1个原始类型的数据:

var num = 5; console.log(num); //

我们还可以让变量存放对象类型的数据:

var obj= {x:1,y:2}; console.log(obj); // Object {x: 1, y: 2} 

通常都是用var一次性初始化多个变量,省的老写“v-a-r”这3个字母了:

var num = 1, str = 'string', bol = false;

(二)变量的名字变量的名字有2点需要注意:

1.以字母、$(美元符号)、_(下划线)开头

2.区分大小写

三、变量中能存放些什么东西?

在变量中可以存放任意JS支持的数据,也就是 “原始类型”的数据 与 “对象类型”的数据 。

(一)JS中的数据类型

我们先来温习一下JS中的数据类型吧,大家都知道JS中的数据类型分为:“原始类型”和“对象类型”2种。

“原始类型”的数据有:数字(5)、字符串('hello')、布尔值(true/false)、null(特殊的原始值)、undefined(特殊的原始值)。

“对象类型”的数据有:数组([1,2,'welcome',false,{x:1,t:2}])、函数(function foo(){return '我是函数';})、对象({name:'ghettoboy',age:27})。

(二)在变量中存放“原始类型”数据 与 “对象类型”数据的差异

1.存放着实际的值——“原始类型”的数据

如果一个变量保存的是“原始类型”的值,那么变量保存的就是某个原始数据类型的值。比如下面你所看到的,变量a里面保存着数字5、变量str中存放着字符串'String'、变量bol放的是布尔值true,变量里保存的是实际的值。

var num = 5, str = 'String', bol = true, noVal = undefined, emptyObj = null;

2.存放的是内存地址——“对象类型”的数据

如果变量保存的是“对象类型”的数据,那么变量保存的就是1个内存地址,这个内存地址对应着1个“对象类型”的值。只要通过地址找到了,那么我们就可以操作它。

var obj = {x:1,y:2}, arr = ['你','hao','吗?'];
function foo(){
alert('静静的思考');
}

变量obj保存的1个内存地址,通过这个地址可以找到对象{x:1,y:2}、变量arr保存的是通向数组['你','hao','吗?']的地址,同样函数声明foo(foo和变量的作用一样)保存着找到这个函数的地址。

(三)把1个变量 赋值给 另1个变量

好,现在我们有两个变量,a,b。

当我们想把变量b 赋值给 变量a时,a得到的是“值” 还是 “内存地址”,就看变量b中存放着的是什么数据类型的值了。

a = b; // a会得到什么?这取决于b中存放的是什么数据类型的值

1.如果,变量b中存放着“原始类型”的值。

变量b中存放着“原始类型”的值,此时b保存的是1个值。a=b,那么首先复制出1份变量b所保存的值,然后将这个刚刚复制出来的值 赋给 变量a。

注意:此时变量b中还是存着自己的值,赋给变量a的那个值,是复制出来的值。

var a, b=10;
a = b; // 先复制一份b的值,也就是10,然后把这个刚复制出来的10放到变量a里面。
console.log(a); //
console.log(b); // 10
// 现在,变量a 与 变量b 都保存着10。我们说过变量只是个容器,2个不同的容器,你放什么,我放什么,互不干扰。
a = '来点新鲜的';
console.log(a); // '来点新鲜的'
console.log(b); // 变量b还是存着自己的10

2.如果,变量b中存放着是“对象类型”的值。

变量b中存放着“对象类型”的值,此时b保存的是1个内存地址,通过这个内存地址可以找到1个对象。a=b,那么也是先复制1份变量b保存的内存地址,然后将这个刚刚复制出的内存地址 赋值给 变量a。

现在,变量a、变量b都有同一个对象的内存地址。这意味着,通过任意1个变量对这个对象作出修改,都会在另1个变量中表现出来。

var a,b = [1,2,3];
a = b; // 现在变量a中保存着1个内存地址,这地址通向[1,2,3]
a[0] = '通过变量a来修改一下';
console.log(b); //["通过变量a来修改一下", 2, 3]
console.log(a); //["通过变量a来修改一下", 2, 3]

参考资料:

1.《JavaScript高级程序设计》(第3版) 4.1基本类型和引用类型的值

2.《JavaScript权威指南》(第5版) 4.4基本类型和引用类型

js基础知识:变量的更多相关文章

  1. js基础知识--变量类型和变量计算

    提问: JS中使用typeof能得到的哪些类型 何时使用===何时使用== JS中有哪些内置函数 JS变量按照存储方式区分为哪些类型,并描述其特点 如何理解JSON 涉及知识点:(1)变量类型 值类型 ...

  2. JS基础知识——变量类型和计算(一)

    JS中使用typeof能得到的哪些类型? 何时使用===何时使用==? JS中有哪些内置函数? JS变量按照存储方式区分为哪些类型,描述其特点? 如何理解JSON? 知识点梳理 一.变量类型: (1) ...

  3. NodeJs>------->>第三章:Node.js基础知识

    第三章:Node.js基础知识 一:Node.js中的控制台 1:console.log.console.info  方法 console.log(" node app1.js 1> ...

  4. [JS复习] JS 基础知识

    项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display  :inline or bloc ...

  5. HTML+CSS+JS基础知识

    HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...

  6. Node.js基础知识

    Node.js入门   Node.js     Node.js是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始.比较独特的是,Node.js会假设在POSIX环境下运行 ...

  7. 网站开发进阶(十五)JS基础知识充电站

    JS基础知识充电站 1.javascript alert弹出对话框时确定和取消两个按钮返回值? 用的不是alert对话框,是confirm confirm(str); 参数str:你要说的话或问题: ...

  8. JS基础知识笔记

    2020-04-15 JS基础知识笔记 // new Boolean()传入的值与if判断一样 var test=new Boolean(); console.log(test); // false ...

  9. Js基础知识(一) - 变量

    js基础 - 变量 *大家对js一定不会陌生,入门很简单(普通入门),很多人通过网络资源.书籍.课堂等很多途径学习js,但是有些js基础的只是往往被大家遗漏,本章就从js变量类型来说一说js 变量类型 ...

  10. js基础知识温习:Javascript中如何模拟私有方法

    本文涉及的主题虽然很基础,在很多人眼里属于小伎俩,但在JavaScript基础知识中属于一个综合性的话题.这里会涉及到对象属性的封装.原型.构造函数.闭包以及立即执行表达式等知识. 公有方法 公有方法 ...

随机推荐

  1. [OC笔记] protocol之我的见解

    OC中的protocol就是和JAVA中interface差不多的东西,但是又不是完全一样的.这个protocol常用来实现委托,也就是自己不实现,当事件产生的时候去回调委托者. 让委托者去执行响应的 ...

  2. 通过jQuery Ajax使用FormData对象上传文件

    FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用For ...

  3. UDP异步通信

    先看效果图 Server: using System; using System.Collections.Generic; using System.Text; using System.Net; u ...

  4. php版本引起的const问题

    刚刚遇到一个问题,类中定义了一个常量: const USER = ['aa', 'bb', 'cc']; 在类中的静态函数中调用以上常量不会出错.网站中所有的网页均能正常打开. 而当push到线上后, ...

  5. sk_buff封装和解封装网络数据包的过程详解(转载)

    http://dog250.blog.51cto.com/2466061/1612791 可以说sk_buff结构体是Linux网络协议栈的核心中的核心,几乎所有的操作都是围绕sk_buff这个结构体 ...

  6. 乌邦图ubuntu配置iptables的NAT上网

    cat /etc/network/iptables.up.rules # Generated by iptables-save v1. :: *nat :PREROUTING ACCEPT [:] : ...

  7. nginx编译模块详解

    –prefix= 指向安装目录–sbin-path 指向(执行)程序文件(nginx)–conf-path= 指向配置文件(nginx.conf)–error-log-path= 指向错误日志目录–p ...

  8. 跟我学-Java底层技术系列文章

    对于工作中经常用到的东西,还是多看看实现原理,这样用着才能放心. 源码思想学习计划: 1.java基础库  HashCode深入理解 java线程框架窥探 2.集合类     java枚举类使用 递归 ...

  9. AngularJS实现单页应用的原理——路由(Route)

    AngularJS实现单页应用的原理——路由(Route) 路由:告诉你一个通往某个特定页面的途径 http://127.0.0.1/index.html#/start http://127.0.0. ...

  10. java 读取文件内容 三种形式及效率对比

    IOUtils.getStringFromReader() 读取方式为最快的 InputStream in = null; String line = ""; long start ...