声明 / 定义
- JavaScript有三种声明方式
  - var
  - let
  - const
- 区别
变量

声明 / 定义

JavaScript有三种声明方式

var

一、声明一个变量，可选初始化一个值。
【见】var

let

一、声明一个块作用域的局部变量，可选初始化一个值。

const

一、声明一个块作用域的只读变量

区别

一、var与let/const有两个主要的区别：
1、var声明的变量没有块级作用域，它们仅在当前函数内可见，或者全局可见（如果变量是在函数外声明的）。
2、var变量声明在函数开头就会被处理（脚本启动对应全局变量）。

变量

一、在应用程序中，使用变量来作为值的符号名。
二、变量是数据的“命名存储”。我们可以使用变量来保存商品、访客和其他信息。

变量命名

一、一个JavaScript标识符必须以字母、下划线（）或者美元符号（$）开头，后续的字符也可以是数字（0-9）。
1、变量名必须仅包含字母，数字，符号$和
2、首字符必须非数字。

| 【示例】有效命名```javascript let $ = 1; // 使用 “$” 声明一个变量 let = 2; // 现在用 ““ 声明一个变量

alert($ + _); // 3

 |
| --- |
| 【示例】无效命名```javascript
let 1a; // 不能以数字开始
let my-name; // 连字符 '-' 不允许用于变量命名

| | —- |

二、允许非英文字母，但不推荐

| 【示例】```javascript let имя = ‘…’; let 我 = ‘…’;

 |
| --- |

三、在早期，我们可以不使用let进行变量声明，而可以简单地通过赋值来创建一个变量。现在如果我们不在脚本中使用use strict声明启用严格模式，这仍然可以正常工作，这是为了保持对旧脚本的兼容

| 【示例】不会报错```javascript
// 注意：这个例子中没有 "use strict"
num = 5; // 如果变量 "num" 不存在，就会被创建
alert(num); // 5

| | —- |

| 【示例】严格模式下会报错```javascript “use strict”;

num = 5; // 错误：num 未定义

 |
| --- |


<a name="edda4ac3a4ffdc816b9742720276d27e"></a>
## 声明变量
一、声明变量的方式

- 使用关键词var：这个语法可以用来声明局部变量和全局变量。如`var x = 42`
- 直接赋值：在函数外使用这种形式赋值，会产生一个全局变量。如`x = 42`
   - 在严格模式下会产生错误。
   - 不应该使用这种方式来声明变量。
- 使用关键词let：这个语法可以用来声明块作用域的局部变量。如`let y = 13`
<a name="f12dK"></a>
### 内联变量声明
一、for循环中，如果“计数”变量i是在循环中声明的。这叫做“内联”变量声明。这样的变量只在循环中可见。

| 【示例】```javascript
for (let i = 0; i < 3; i++) {
  alert(i); // 0, 1, 2
}
alert(i); // 错误，没有这个变量。

| | —- |

二、除了定义一个变量，我们也可以使用现有的变量

| 【示例】```javascript let i = 0;

for (i = 0; i < 3; i++) { // 使用现有的变量 alert(i); // 0, 1, 2 }

alert(i); //3，可见，因为是在循环之外声明的

 |
| --- |

<a name="1e3cfc212bd79be4c88a0641c1224f29"></a>
## 变量求值
一、用var或let语句声明的变量，如果没有赋初始值，则其值为undefined。<br />二、如果访问一个未声明的变量会导致抛出一个引用错误（ReferenceError）异常：

| 【示例】```jsx
var a
console.log(a) // a的值是undefined
console.log(b) // b的值是undefined
console.log(c) // 未捕获的引用错误：c未被定义
var b

let x
console.log(x) // x的值是undefined
console.log(y) // 未捕获的错误：y未被定义
let y

| | —- |

三、可以用undefined来判断一个变量是否已赋值。
1、undefined在布尔类型环境中被会当作false，数值类型环境中会被转换成undefined

| 【示例】```jsx var input if (input === undefined) { // true doThis() } else { doThat() }

 |
| --- |

| 【实例】判断myArray是否是空数组```jsx
var myArray = []
if (!myArray[0]) { // myArray[0]为undefind
    doThis()
}

| | —- |

| 【示例】```jsx var a a + 2 // 计算为NaN

 |
| --- |

2、空值null在布尔类型环境中会被当作false，数值环境中会被当作0来对待。

| 【示例】```jsx
var n = null
console.log(n * 32) // 在控制台中显示0

| | —- |

变量的作用域

一、在函数之外声明的变量，叫做全局变量。因为它可被当前文档中的任何其他代码所访问。
二、在函数内部声明的变量，叫做局部变量，因为它只能在当前函数的内部访问。
三、语句块中声明的变量将成为语句块所在函数（或全局作用域）的局部变量。
1、语句块：if

变量提升

一、变量提升/ hoisting：可以先使用变量稍后再声明变量而不会引发异常。
二、JavaScript只有声明的变量会提升，初始化的不会
1、var：提升后的变量将返回undefined值

| 【示例】```jsx console.log(x === undefined) // true var x = 3

也可以写作```jsx
var x 
console.log (x === undefined)
x = 3

| | —- |

| 【示例】```jsx var myVar = ‘my value’

(function () { console.log(myVar) // undefined var myVar = ‘local value’ })()

也可以写作```jsx
var myVar = 'my value'
(function () {
    var myVar
  console.log(myVar) // undefined
  myVar = 'local value'
})()

| | —- |

2、let/const 在变量声明之前引用这个变量，将抛出引用错误（ReferenceError）。这个变量将从代码块一开始的时候就处在一个“暂时性死区”，直到这个变量被声明为止。

| 【示例】```jsx console.log(x) // ReferenceError let x = 3

 |
| --- |

<a name="caaec509946985cb1a79410ec1db3194"></a>
## 全局变量
一、全局变量是全局对象的属性<br />二、全局对象是window，所以可以用如window.variable的语法来设置和访问全局变量

<a name="b272013757ae575a3755c4f6ac5c433b"></a>
# 常量/ Constants
一、可以用关键字const创建一个只读的常量。<br />1、使用const声明的变量称为“常量”<br />二、常量标识符的命名规则同变量相同。<br />三、在同一作用域中，不能使用与变量名或函数名相同的名字来命名变量。

| 【示例】下面语句会造成错误```jsx
function f () {}
const f = 5

| | —- |

| 【示例】下面语句会造成错误```jsx function f () { const g = 5 var g }

 |
| --- |

四、对象属性被赋值为常量是不受保护的。

| 【示例】下面语句不会造成错误```jsx
const MY_OBJECT = { "KEY": "value" }
MY_OBJECT.key = 'otherValue'

| | —- |

五、数组被定义为常量也是不受保护的。

| 【示例】下面语句不会造成错误```jsx const MY_ARRAY = [‘HTML’, ‘CSS’] MY_ARRAY.push(‘JAVASCRIPT’) console.log(MY_ARRAY) // [‘HTML’, ‘CSS’, ‘JAVASCRIPT’]

 |
| --- |

<a name="jzBlO"></a>
## 大写形式的常数
一、使用大写字母和下划线来命名这些常量

| 【示例】让我们以所谓的“web”（十六进制）格式为颜色声明常量：```javascript
const COLOR_RED = "#F00";
const COLOR_GREEN = "#0F0";
const COLOR_BLUE = "#00F";
const COLOR_ORANGE = "#FF7F00";

// ……当我们需要选择一个颜色
let color = COLOR_ORANGE;
alert(color); // #FF7F00

1、好处
- COLOR_ORANGE比”#FF7F00”更容易记忆。
- 比起COLOR_ORANGE而言，”#FF7F00”更容易输错。
- 阅读代码时，COLOR_ORANGE比#FF7F00更易懂。
| | —- |

二、什么时候该为常量使用大写命名，什么时候进行常规命名？
1、作为一个“常数”，意味着值永远不变。但是有些常量在执行之前就已知了（比如红色的十六进制值）
还有些在执行期间被“计算”出来，但初始赋值之后就不会改变。

| 【示例】pageLoadTime的值在页面加载之前是未知的，所以采用常规命名。但是它仍然是个常量，因为赋值之后不会改变。```javascript const pageLoadTime = / 网页加载所需的时间 /;

 |
| --- |

2、换句话说，大写命名的常量仅用作“硬编码（hard-coded）”值的别名。
<a name="RvnTt"></a>
## 正确命名变量
一、一些可以遵循的规则：

- 使用易读的命名，比如userName或者shoppingCart。
- 离诸如a、b、c这种缩写和短名称远一点，除非你真的知道你在干什么。
- 变量名在能够准确描述变量的同时要足够简洁。不好的例子就是data和value，这样的名称等于什么都没说。如果能够非常明显地从上下文知道数据和值所表达的含义，这样使用它们也是可以的。
- 脑海中的术语要和团队保持一致。如果网站的访客称为“用户”，则我们采用相关的变量命名，比如currentUser或者newUser，而不要使用currentVisitor或者一个newManInTown。
<a name="62e69e12b477788b20972c3d73291cf8"></a>
# 字面量
<a name="a472f8dae7fa9c5b68807d588357ec55"></a>
## 解释
```javascript
var a = 1 // a为变量，1为字面量
let b = 2 // b为变量，2为字面量
const str = 'yanqm' // str为常量，3为字面量

类型

数组字面量 / Array literals

数组字面量是一个封闭在方括号对（[]）中的包含有零个或多个表达式的列表，其中每个表达式代表数组的一个元素。
一、使用数组字面值创建一个数组时，该数组将会以指定的值作为其元素进行初始化，而其长度被设定为元素的个数。

| 【示例】```javascript var a = [3] console.log(a.length) // 1 console.log(a[0]) // 3

 |
| --- |

二、若在顶层（全局）脚本里用字面值创建数组，JavaScript语言将会在每次对包含该数组字面值的表达式求值时解释该数组。<br />1、在函数中使用的数组，将在每次调用函数时都会被创建一次。<br />三、数组字面值同时也是数组对象
<a name="56c13e333277b9f9c0b6a33d3bf0f60d"></a>
#### 数组字面值中的多余逗号
一、若在同一行中连写两个逗号, , 数组中就会产生一个没有被指定的值，其初始值是undefined<br />二、如果在元素列表的尾部添加了一个逗号，它将会被忽略。

| 【示例】```javascript
var myList = ['home', , 'school', ,]
consol.log(myList.length) // 4

| | —- |

布尔字面量 / Boolean literals / 逻辑字面量

一、布尔类型有两种字面量： true 和false
二、不要将值为true和false的Boolean对象和基本类型中的布尔值true和false对象混淆。
三、布尔对象是原始布尔数据类型的一个包装器。

整数字面量 / Integers

一、整数可以用十进制（基数为10）、十六进制（基数为16）、八进制（基数为8）以及二进制（基数为2）表示。
1、十进制整数字面量由一串数字序列组成，且没有前缀0
0, 117 and -345
2、八进制的整数以0（或0O、0o）开头，只能包含数字0-7。
（1）严格模式下不能以0开头。
015, 0001 and -0o77
3、十六进制整数以0x（或0X）开头，可以包含数字（0-9）和字母a~f 或A~F
0x1123, 0x00111 and -0xF1A7
4、二进制整数以0b （或0B）开头，只能包含数字0和1
0b11, 0b0011 and -0b11

浮点数字面量 / Floating-point literals

一、浮点数字面量有以下的组成部分
1、一个十进制整数，可以带正负号（ + 或-）
2、小数点（.）
3、小数部分（由一串十进制表示）
4、指数部分
（1）指数部分以e或E开头，后面跟着一个整数，可以有正负号。
三、浮点数字面量至少有一位数字，而且必须带小数点或者e / E
四、语法

[(+|-)][digits][.digits][(E|e)[(+|-)]digits]

【示例】 3.14 -.2345789 // -0.23456789 -3.12e+12 // -3.121012 .1e-23 // 0.110-23=10-24=1e-24

对象字面量 / Object literals

对象字面值是封闭在花括号对{}中的一个对象的零个或多个”属性名-值”对的（元素）列表。
一、对象属性名字可以是任意字符串，包括空串。
二、如果对象属性名字不是合法JavaScript标识符，它必须用””包裹。
属性的名字不合法，那么便不能用.访问属性值，而是通过类数组标记[]访问和赋值

| 【示例】```javascript var unusualPropertyNames = { “”: “An empty string”, “!”: “Bang!” } console.log(unusualPropertyNames.””); // 语法错误: Unexpected string console.log(unusualPropertyNames[“”]); // An empty string console.log(unusualPropertyNames.!); // 语法错误: Unexpected token ! console.log(unusualPropertyNames[“!”]); // Bang!

 |
| --- |

<a name="6dbe03bf91c48d144c2e1b4bbb408b42"></a>
#### 增强的对象字面量 / Enhanced Object literals
在es6，对象字面值扩展支持在创建时设置原型，简写了foo: foo形式的属性赋值，方法定义，支持父方法调用，以及使用表达式动态计算属性名。

| 【示例】```javascript
var foo = {a: "alpha", 2: "two"};
console.log(foo.a);    // alpha
console.log(foo[2]);   // two
//console.log(foo.2);  // SyntaxError: missing ) after argument list
//console.log(foo[a]); // ReferenceError: a is not defined
console.log(foo["a"]); // alpha
console.log(foo["2"]); // two

| | —- |

RegExp literals

一个正则表达式是字符被斜线（正斜杠/）围成的表达式。

| 【示例】```javascript var re = /ab+c/

 |
| --- |


<a name="9c9ab1cf5881f8a98d4d806e2e33ad88"></a>
### 字符串字面量 / String literals
字符串字面量是由双引号对""或单引号对''括起来的零个或多个字符。<br />一、可以在字符串字面值上使用字符串对象的所有方法。<br />1、JavaScript会自动将字符串字面值转换为一个临时字符串对象，调用该方法，然后废弃掉那个临时的字符串对象。<br />二、es6中，提供了一种模板字面量（template literals），模板字符串提供了一些语法糖来帮你构造字符串。

| 【示例】```javascript
// Basic literal string creation
`In JavaScript '\n' is a line-feed.`

// Multiline strings
`In JavaScript this is
 not legal.`

// String interpolation
var name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`

| | —- |

三、可以在通过模板字符串前添加一个tag来自定义模板字符串的解析过程，这可以用来防止注入攻击，或者用来建立基于字符串的高级数据抽象。

| 【示例】``javascript // Construct an HTTP request prefix is used to interpret the replacements and construction POSThttp://foo.org/bar?a=${a}&b=${b} Content-Type: application/json X-Credentials: ${credentials} { “foo”: ${foo}, “bar”: ${bar}}`(myOnReadyStateChangeHandler);

 |
| --- |

<a name="54a2e046073b37ae1608cf23901fef5c"></a>
#### 在字符串中使用的特殊字符
<a name="JetzH"></a>
### 模板字面量 / Template literals
| 【示例】```javascript
var poem =
`Roses are red,
Violets are blue.
Sugar is sweet,
and so is foo.`

| | —- |