js变量与简单数据类型

  • A+
所属分类：Web前端
摘要

js有三种书写位置，分别为行内、内嵌和外部。实际开发中大多使用外部。注：
便宜好用的国外VPS推荐

js变量与简单数据类型

js有三种书写位置，分别为行内、内嵌和外部。实际开发中大多使用外部。

<script src="helloWorld.js"></script>

注：

  • 使用外部js文件有利于HTML页面代码结构化，方便文件级别的复用
  • 引用外部js文件的script标签中间不可以写代码
  • 使用外部js文件适合于js代码量比较大的情况

1. js输入输出语句

方法 说明 归属
alert(msg) 浏览器弹出警示框 浏览器
console.log(msg) 浏览器控制台打印输出信息 浏览器
prompt(info) 浏览器弹出输入框，用户可以输入 浏览器
  1. 浏览器弹出警示框：
  2. 浏览器控制台打印输出信息
  3. 浏览器弹出输入框，用户可以输入

2. 变量

js的常用变量类型和Java的差不多，由于笔者学过Java，故跳过了这部分的学习。需要的请查阅其它资料。

2.1 变量命名规范

  1. 由大小写字母、数字、下划线_、美元符号$组成
  2. 严格区分大小写，apple与Apple是两个不同的变量
  3. 不能以数字开头
  4. 不能是关键字、保留字。eg. for、while等等
  5. 变量名必须有意义，不能是随便的abc
  6. 遵守驼峰命名法。首字母小写，后面单词的字母需要大写。eg. newHelloWorld
  7. 尽量不要使用name作为变量名（原因：控制台输出为空）

2.2 变量的数据类型

变量是用来存储值的所在处，它们有名字和数据类型。变量的数据类型决定了如何将代表这些值的位存储到计算机的内存中。js是一种弱类型/动态语言，意味着不用提前声明变量的类型，在程序运行过程中，类型会被自动确定。

var age = 3;    //数字型 var yourName = '小明';    //字符串

在代码运行时，变量的数据类型是由js引擎根据等号右边变量值的数据类型来判断的，运行完毕后，变量就确定了数据类型。

js拥有动态类型，同时也意味着相同的变量可用作不同的类型：

var x = 1;    //x为数字 var x = "hello";    //x为字符串

2.3 全局变量和局部变量的区别

  • 全局变量：在任何一个地方都可以使用，只有在浏览器关闭时才会被销毁，因此比较占内存。
  • 局部变量：只在函数内部使用，当其所在的代码块被执行时，会被初始化；当代码块运行结束后，就会被销毁，因此更节省内存空间。

js引擎运行js文件时分为两步工作：

  • 预解析：js引擎会把js文件里面所有的var和function提升到当前作用域的最前面

  • 代码执行：按照代码书写的顺序从上往下执行

预解析又分为：

  • 变量预解析（变量提升）：把所有的变量声明提升到当前作用域最前面，不提升赋值操作
console.log(num);    // 输出undefined var num = 10;  // 相当于执行了以下代码 var num; console.log(num); num = 10;
  • 函数预解析（函数提升）：把所有的函数声明提升到当前作用域最前面，不调用函数
fn();    // 报错 var fn = function() {     console.log(123); }  // 相当于执行了以下代码 var fn; fn(); fn = function() {     console.log(123); }

3. 简单数据类型

3.1 数字型Number

既可以用来保存整数值，也可以保存小数（浮点数）。

var a = 5;    //整数 var A = 5.6789;    //小数

3.1.1 数字型进制

  1. 二进制：数字序列范围：0~1，逢2进一位。eg.01=1，10=2，11=3
  2. 八进制：数字序列范围：0~7，逢8进一位。eg.07=7，010=8，011=9
  3. 十进制：数字序列范围：0~9，逢10进一位。
  4. 十六进制：数字序列范围：0~9以及A~F，逢16进一位。eg.0xA=10，0xF=15，0x10=16

在js中八进制前面加0，十六进制前面加0x。

3.1.2 数字型范围

js中数值的最大值和最小值：

  • 最大值：Number.MAX_VALUE，为1.7976931348623157e+308
  • 最小值：Number.MIN_VALUE，为5e-32

3.1.3 数字型三个特殊值

  • Infinity：无穷大
  • -Infinity：无穷小
  • NaN：Not a Number，非数值

3.1.4 isNaN()

用来判断一个变量是否为非数字的类型，返回值为布尔型。

isNaN(x)：

  • x是数字，返回false
  • x不是数字，返回true

3.2 字符串型String

语法为双引号和单引号。但因为HTML标签里的属性使用的是双引号，js推荐使用单引号。

3.2.1 字符串引号嵌套

js可以用单引号嵌套双引号，或者用双引号嵌套单引号，注意要配成一对。

var eg1 = '举个“栗子”'    //单引号包含双引号 var eg2 = "举个'栗子'"    //双引号包含单引号 var eg3 = '这个是错的"    //不能单双引号搭配

3.2.2 字符串转义符

转义符都是开头的，这个和Java的没什么不同的，故不再赘述。

3.2.3 字符串长度

通过字符串的length属性可以获取整个字符串的长度。注意是属性length，不是方法length()，不要混淆。

var str = 'hello world'; console.log(str.length);//显示11

3.2.4 字符串拼接

多个字符串之间可以用加号+进行拼接，拼接方式为字符串 + 任何类型 = 拼接后的新字符串。

console.log('hello'+' '+'world');    //字符串与字符串，hello world console.log('hello'+22)    //字符串与数值，hello22 console.log('22'+33)    //数值字符串与数值，2233

3.3 布尔型Boolean

有两个值：true（真）和false（假）。布尔型与数字型相加的时候，true的值为1，false的值为0。

console.log(true+1);    //2 console.log(false+1);    //1

3.4 Undefined和Null

一个声明后没有被赋值的变量会有一个默认值undefined，注意进行相连和相加后的结果。

var variable; console.log(variable);    //undefined console.log('看看'+variable);    //看看variable console.log(11+variable);    //NaN

一个声明变量给null值，里面存的值为空。

var variable = null; console.log('看看'+variable);    //看看null console.log(11+variable);    //11
便宜好用的国外VPS推荐