跳转至

变量 和 注释

js 程序运行时，每个数字、字符串，还有我们后面要学的 数组、对象 等， 其实就是 内存中的一段数据

我们的程序是经常要操作这些内存中的数据的，比如打印整数的值到屏幕上，或者把字符串发送给服务器。

那么我们的程序语言如何告诉计算机，我们 要操作（使用）的 是哪个数据 呢？

比如下面的语句

'你好，今天天气真不错'

解释器运行完这条语句，就会产生一个字符串，放在计算机内存中的某个位置。

如果后面的程序代码要把这个 字符串 打印到屏幕上，怎么引用它呢？

是再写一遍吗？像这样？

'你好，今天天气真不错'
console.log('你好，今天天气真不错')

显然不对，如果是这样，解释器执行第2行语句的时候，可能会重新创建一个字符串。这样，第一行语句是无效的。

而且有的时候字符串不是直接定义在代码里面的，而是运行的时候动态生成的，比如用户输入的字符串。

问题在于，我们怎么在代码中 使用 一个已经存在的内存中的数据？

变量的概念

大家来思考一个问题：

人类语言里面，当我们提到一个人或事物， 是怎么说的？

比如说 聊天的时候，提到你的一个同学， 提到一支球队

对了，用他们的 名字。

比如： 王晓刚同学， 湖人队等等。

如果不允许使用 事物的名字， 我们的话就没法说了。

人类语言是这样，计算机语言也是一样，如果产生了数据，却没有给它们起名字，就像这样

43
'你好，今天天气真不错'

我们后面的代码，怎么去使用这个数字 43 和 字符串 你好，今天天气真不错 呢？

编程语言为了方便操作数据，也需要给数据起一个名字。

我们把 js 语言中数据的名字, 称之为 变量名 ， 有时也简称 变量。

所以 js 中的变量，就是 数据的名字。

为了强调这句话的重要性，重复3遍：

变量，就是数据的名字！！

变量，就是数据的名字！！

变量，就是数据的名字！！

我们可以这样给数据起名字

let age = 43
var weather = '你好，今天天气真不错'

定义变量使用 关键字 let 或者 var ，

关键字是编程语言中特殊用途的单词，比如这里用来定义变量。


其中 let 是 ECMAScript 6 标准才引入的。

所以 var 在浏览器的支持性更广泛。

但是现在基本js执行引擎都已经支持ECMAScript 6了，所以用let基本上也没有问题


let 和 var 有 有效范围 的区别，这个后面再讲。

当前可以任意选择一个使用


变量名 和 数据 之间 用 等号 连接

其中

age 就是 数字 43 的名字，我们也可以说：变量age的值 是数字 43

weather 就是 字符串 你好，今天天气真不错 的名字，我们也可以说：变量 weather 的值 是 字符串 你好，今天天气真不错


我们可以不使用任何关键字直接定义变量，像这样

age = 43

我们不推荐这样做。具体原因以后会介绍

注意

还有一个定义变量的关键字 const ，将来会介绍。


定义了变量之后，我们写代码，需要用到 它们对应的 数据 时，就可以用它们的名字： 变量名。

比如

let age = 43 + 2
let weather = '你好，今天天气真不错'
console.log(age)
console.log(weather)

代码执行的时候，解释器看到 变量名 就知道代表的就是对应的数据。

大家运行一下，可以发现，可以打印出变量所代表的 数据。


下面这行语句， 定义了 一个变量 age 值为 43，

let age = 43

也可以称之为： 给变量 age 赋值 为43


多个变量赋值可以这样写

let age = 43
let height = 170

也可以同时为多个变量赋值，像这样

let age = 43, height = 170

var var1 = 1,
    var2 = 2,
    var3 = 3


我们也可以先定义变量但是先不赋值，如下

let age , height

这时， age， height 的值 为 undefined

后面再根据需要为其赋值

age = someAgeValue
height = someHeightValue

变量的命名规则

变量名不是随便取的，有一定的规则。

  • 变量名可以包含 字母、数字和下划线。

  • 变量名可以以字母或下划线打头，比如 var1 , 或者 _var 。

  • 但不能以数字打头， 像 1var 这样是不行的。

  • 变量名中不能包含空格。

  • 变量名中可以包含下划线，像下面这样都是可以的

Hello, var1, age2name, age_name

  • 变量名 不能 和 关键字 同名，

    比如 

    let for = 1997

    for 是 js 的关键字，是js 语言中有特殊意义的名字， 不能用作变量名。

  • 变量名 不要 和 js内置对象、函数 同名

对象、函数 的概念后面会介绍，大家现在可以理解为一种数据类型

比如

JSON = 1   \\ 这行代码就把undefined这个标准函数名 重新赋值数字 333 了
JSON.stringify('[2,3]')   \\ 执行的时候就会出错了。


parseInt = 333   \\ 这行代码就把parseInt这个标准函数名 重赋值为数字 333 了
parseInt('4567')   \\ 执行的时候就会出错了。

可以点击这里查看js 中有哪些内置函数

一个好的工程师，变量名不是乱取的，我们通常称之为见名知意原则，就是看到变量名，就知道变量对应的数据的含义。

比如 startTime, your_name, 这样的变量名，看了就知道是啥意思

而像 a ， b ， c 这样的变量名就不好，因为看了不知道是啥意思。


注意：在js 中 变量名是大小写敏感的。

不可以 在定义的时候使用 startTime 作为变量名，而在使用的时候，用 starttime 。


目前，js 语言标准的风格是 使用驼峰(camel) 命名法

比如

function ElectricCar(priceNumber){
  this.priceNumber = priceNumber
}

var myCar1 = new ElectricCar(300000)



class GasCar{
  constructor (priceNumber){
    this.priceNumber = priceNumber
  }
}

var myCar2 = new ElectricCar(300000)

类名和构造函数名 单词首字母大写，

变量 和 属性 开头单词小写，后面单词首字母大写，

变量的变化

数据的名字为什么叫变量呢？

因为它会变 ：）

js 语言中，变量的值会可以产生变化

实际上，js 定义变量时 可以不指定初始值，像这样

let name
var age

// 未指定初始值，值为 undefined
console.log(name,age)

// 然后再赋值
name = '白月黑羽'
age  = 100
console.log(name,age)


变量的值发生变化有两种情况

变量名 对应新的数据

这种情况也被称之为 变量重新赋值，比如 

let age = 43
age = 'hello'

运行程序的时候，第一条语句执行完的时候，变量名age就是数字 43 的名字。

其对应关系如下图所示：

白月黑羽教程


第二条语句执行完， 变量age就不是数字 43 的名字了，而是字符串 hello 的名字了。

其对应关系如下图所示：

白月黑羽教程

当第二条语句执行完， 数字 43 就没有变量引用它了。

注意 没有被引用的数据，解释器会在随后某个时候从内存中清除掉。

一个数据可以有多个名字，比如

let kid = '小明'
let student = kid
let prettyboy = kid

这样， 小明 这个字符串就有3个 变量名 kid、 student 和 prettyboy

这3个名字 指向同一个数据。

其对应关系如下图

白月黑羽教程


如果后面的代码将其中一个变量名进行重新赋值，比如

kid = '小周'

这只会改变kid 一个变量和其指向数据的 关系，并不会改变其他的变量名 student 和 prettyboy

其对应关系如下图

白月黑羽教程


所以，如果我们接下来执行下面的代码

console.log(kid)
console.log(student)
console.log(prettyboy)

运行结果就是

小周
小明
小明


变量重新赋值的时候，有时候会出现下面这种写法

let var1 = 1
var1 = var1 + 1

就是把变量原来的值 增加 1，这个结果数据再赋值为变量var

数字变量的自增赋值还有一个特殊的写法，如下

let var1 = 1
var1 = var1 + 1 # 把var 的值加1 后，再赋给var， var1 就变成了 2
var1 += 1      # 等价于 var1 = var1 + 1 ，执行后var 就变成了 3

变量数据 本身发生了变化

js中 数组 和 Objects 可变数据类型 (mutable)。

这2种数据类型，我们后面会学到。


当变量对应的数据是可变数据类型，可以通过变量名改变其内容

let info = {'name' :'黑羽白月', 'height':'180cm'}
info.height = '170cm'
console.log(info)

第二条语句就是让变量对应的字典数据的值 发生了变动，而不是变量info对应了新的数据。

如果这样写

info = '170cm'

才是变量info对应了新的数据。

注意两者写法上的区别。

数字变量值变化

数字变量值增加有好几种写法

如下

var num = 1
num = num + 1  // 值加1
num += 2       // 值加2

// 执行时，num值加1 赋值给 n1
var n1 = ++num  
n1
num

// 执行时，num值不变 赋值给 n1，执行后 num值加1
var n1 = num++  // 执行后num值加1
n1
num


减法也是一样的规则

var num = 100
num -=1

// 执行时，num值加1 赋值给 n1
var n1 = --num  
n1
num

// 执行时，num值不变 赋值给 n1，执行后 num值加1
var n1 = num--  // 执行后num值加1
n1
num


乘法、除法如下

var num = 10
num *=2


var num = 10
num /=2

注释

虽然 js 语言是一种容易理解和阅读的编程语言。

但是毕竟不是人类语言。

我们写的代码 为了 别人容易看懂， 甚至自己 以后能看懂， 就需要加入一些我们熟悉的 人话，也就是人类语言，辅助理解。

这些辅助理解的人话，就是注释。

这些人话可以是任何一种语言，只要方便你看懂代码就行，中文、英文、法文都可以。

js 的注释有 单行注释 和 多行注释 2种（规则和JAVA、C++ 一致）。

单行注释

单行注释 以 // 开头，后面的内容都是注释

比如

// info 变量 记录 作者的信息，包括 名字，身高，体重
let info = {'name' :'黑羽白月', 'height':'180cm'}

// 改变 作者的身高记录
info['height'] = '175cm'

console.log(info)  // 打印身高到屏幕上


怎么样，有了上面的注释，这些代码是不是更容易读懂了?

我们要注意的是，通常注释是不会对代码的执行有影响的


注释可以单独作为一行， 比如：

// info 变量 记录 作者的信息，包括 名字，身高，体重
let info = {'name' :'黑羽白月', 'height':'180cm'}


也可以接在代码的后面，比如：

console.log(info)  // 打印身高到屏幕上

多行注释

如果我们需要连续多行的注释，当然可以这样：

// info 变量 记录 作者的信息
// 包括 名字，身高，体重
// 这个信息后面会用到
info = {'name' :'黑羽白月', 'height':'180cm'}


但是还有更简便的做法

/* 
  info 变量 记录 作者的信息
  包括 名字，身高，体重
  这个信息后面会用到
*/
info = {'name' :'黑羽白月', 'height':'180cm'}


您需要高效学习，找工作？ 点击咨询 报名实战班

点击查看学员就业情况