JavaScript基本语法（二）

1、变量

1.1、简介

在 JavaScript 中声明一个新变量的方法是使用关键字 let 、const 和 var，如下：

var：

// var可以重复定义同一个变量，没有块级作用域，但是有函数作用域，变量类型由最近一次对变量赋值的数据类型决定
// 注意：变量作用域是在ES6才有的。通过 var 声明的变量会提升到顶端，而let不会
// myVar 在这里能被引用
for (var myVar = 0; myVar < 5; myVar++) {
// myVar 整个函数中都能被引用
}
// myVar 在这里能被引用

let：

// 类似于var定义变量，区别是let不能重复定义同一个变量，且let有块级作用域

// myLet 在这里不能被引用
for (let myLet = 0; myLet < 5; myLet++) {
// myLet 只能在这里引用
}
// myLet 在这里不能被引用

const：

// 定义了对值的常量引用，不能更改常量原始值，但我们可以更改常量对象的属性，有块级作用域 
// 注：必须在声明时赋值

const PI = 3.14; // 设置 PI 的值
PI = 1; // 将会抛出一个错误因为你改变了一个常量的值。

const MY_OBJECT = {"key": "value"};
MY_OBJECT.key = "otherValue"; // 成功修改属性值

const MY_ARRAY = ['HTML','CSS'];
MY_ARRAY.push('JAVASCRIPT'); // 成功添加元素 ['HTML','CSS','JAVASCRIPT']

1.2、变量命名规则

1. 只能由数字、字母、下划线和 $ 组成，但不能以数字开头；
2. 不建议使用关键字和保留字；
3. 严格区分大小写，A 和 a 是两个不同的变量。

1.3、JS的关键字和保留字

• 切记：自己定义的变量名不得使用JS中的关键字和保留字。
• 常用关键字：typeof 检测数据类型， var 定义变量， debugger 调试， eval 计算值的函数。

1.4、声明提升

JavaScript 中，函数及变量的声明都将被提升到函数的最顶部，但函数表达式并不会提升；

/* 函数声明 */
foo(); // "bar"
function foo() {
  console.log("bar");
}

/* 函数表达式 */
baz(); // 类型错误：baz 不是一个函数
var baz = function() {
  console.log("bar2");
};

• JavaScript 中，变量可以先使用后声明；
• 由于存在变量提升，一个函数中所有的 var 语句应尽可能地放在接近函数顶部的地方，提高代码清晰度；
• 在ES6中，let 和 const 同样 会被提升 变量到代码块的顶部但是不会被赋予初始值；
• 全局变量是 全局对象 的属性。在网页中默认的全局对象是 window ，所以我们可以用形如 window.*variable *的语法来设置和访问全局变量。

2、JavaScript数据类型

JavaScript数据类型分为：基本类型和引用类型。

2.1、基本类型

类型名称	描述
Number	数值类型，所有的数字不分大小、不分整浮、不分正负，都是数值类型。
String	字符串类型，使用双引号或者单引号包裹的值。
Boolean	布尔类型(true & false)。
Undefined	1、表示定义了变量没有赋值，默认值为 undefined； 2、变量声明提升时，变量的值也为 undefined； 3、undefined 的类型也为 undefined； 4、undefined 值在布尔类型环境中会被当作 false。
Null	表示变量赋了个空值，用 typeof 检测 null，结果为 object； undefined派生于null，undefined和null的值相等； 对一个 null 变量求值时，空值 null 在数值类型环境中会被当作 0 来对待，而布尔类型环境中会被当作 false。
Symbol	Symbol 是 ES6 引入的一种新的原始数据类型，表示独一无二的值。

2.2、引用类型

类型名称	描述
Object	存储的是对象属性集合，每个属性都是一个"键-值"对。
Array	Array 对象支持在单个变量名下存储多个元素，大小可变，数据类型不限。
Function	Function 对象，调用它的构造函数可以动态创建函数。

2.3、两种类型的区别

类型	基本类型	引用类型
值	不可改变	可以改变
属性和方法	不能添加	能添加
存储值	值	地址（指针）
比较	值的比较	地址的比较

2.4、字符串常用方法

方法名称	描述
charAt()	获取指定位置的字符
substring()	提取字符串中，介于两个指定下标之间的字符
substr()	在字符串中指定的位置处，提取指定数目的字符
slice()	提取字符串的某个部分，类似于 substring() ，不同之处： 1、substring() 可以自动交换参数的位置，而 slice()不行 2、slice()的第一个参数可以是负数，而 substring()不行
toUpperCase()	把字符串转换为大写
toLowerCase()	把字符串转换为小写
indexOf	返回字符串中指定字符首次出现的索引
split()	将字符串转成数组

整数字面量：

0, 117 and -345 (十进制，基数为 10)
015, 0001 and -0o77 (八进制，基数为 8)
0x1123, 0x00111 and -0xF1A7 (十六进制，基数为 16 或"hex")
0b11, 0b0011 and -0b11 (二进制，基数为 2)

浮点数字面量：

3.14
-.2345789 // -0.23456789
-3.12e+12  // -3.12*10^12
.1e-23    // 0.1*10^(-23)=10^(-24)=1e-24

模板字面量：

//模板字面量使用反引号 `` 来定义字符串  
let text = `Hello World!`;
//可以在字符串中同时使用单引号和双引号
let text = `He's often called "Johnny"`;
//允许多行字符串
let text =
`The quick
brown fox
the lazy dog`;

字符串插值：${...} ，用真实值自动替换表达式就叫字符串插值，允许字符串中的变量与表达式

let firstName = "Bill";  let lastName = "Gates";
let text = `Welcome ${firstName}, ${lastName}!`;

let price = 10;  let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;

3、数据类型转换

方法名称	描述
Number()	将其他类型的值转换为数字 强制类型转换
parseInt()	可以将参数转成整数
parseFloat()	可以将参数转成浮点数
String()	将其他类型的值转换成字符串 强制类型转换
toString()	将其他类型的值转换成字符串。 .toString() 和 String()的区别： 1、toString()无法转换 null 和 undefined，String()可以转换 null 和 undefined 2、toString()可增加进制参数，将字符串进行进制转换，String()不能转换进制 3、写法不同，可参考上述例子
Boolean()	将其他类型的值转换为布尔值 强制类型转换

注意：

1. parseInt()函数，对其参数是进行除法操作时，其结果为整除值，参数是浮点数会丢失精度；

2. 如果字符串不能转换为数值，则返回结果NaN（Not a Number）；

3. 字符串以数字开头，转换为数值的过程中碰到第一个非数字字符时停止转换；

4. 在转换字符为含有小数的数值中，第一个小数点有效，其后的其他小数点就无效；

5. 把字符串转换为boolean类型，空字符串转换后结果为false，其他非空字符串，转换后结果为true；

6. 把number类型转换为boolean时，数值0转换后结果为false，非零值(正负均可)转换后的值为true。

扩展：

1. toFixed(m)：指定数值型数据保留m位小数，对m位后进行四舍五入；
2. isNaN()：用来检测一个值是否为 NaN ，返回布尔值。

---

上一篇文章	下一篇文章
JavaScript入门须知（一）	JavaScript运算符（三）