JavaScript基本语法（一）

目录

1. 语句

2. 变量

3. 小结

---

JavaScript基本语法（一）是JavaScript核心知识点（ECMAScript）的基本语法的第一部分，主要介绍了：JavaScript语句、表达式、变量和数据类型（不包括函数类型）的基本知识点，函数类型将在下一章《JavaScript函数（二）》中详细探讨；

---

1.语句

JavaScript程序的执行是由一条条语句组成的；

• 每一条语句是为完成特定任务而执行的操作；

• 语句当中可以包含处理数据的表达式，表达式指可得到返回值的计算式；

• 语句结束的标志是;；

var a = 1;
//执行赋值操作的语句，结束标志的分号
var b = 1+1;
//执行赋值操作的语句，赋值操作符右边使用了表达式，返回值为2，结束标志是分号

---

2. 变量

JavaScript是一门弱类型语言，通过使用关键字var声明变量，在赋值时变量的数据类型将根据值的类型动态转变，从而体现弱类型的特征。

2.1 变量的声明与赋值

• 声明变量但为赋值
  变量只声明不赋值，则变量被赋一个特殊的值undefined；

var a；
a//undefined

• 声明变量并赋值
  变量既声明又赋值，则产生变量提升，即js引擎在解析阶段会将所有的声明变量提升到当前作用域的头部；

var a = 1;
//等价于
var a;
a  = 1;

• 一次性声明多个变量

var a=1,
    b=2,
    c=3;

2.2 标识符（identifier）

标识符即标识变量的名字，例如var a =1，标识符为a，标识符的命名规则如下：

• 第一个字符必须是任意Unicode字母、下划线_或是美元符号$；

• 其他字符除了运算符外，基本都可以使用；

• 变量名通常采用camelCase；

• ECMA-262规定的关键字和保留字不能用作标识符；

2.3 数据类型

JavaScript的数据类型主要包括数值、字符串、布尔值、对象、undefined和null，ES6新增Symbol；

其中，数值、字符串和布尔值可称为基本数据类型，因为所有的数据都是由这三种最基本的类型的值构成；

对象可称为复杂数据类型，这里的对象指的是广义的对象，具体可细分为：

• 狭义的对象（object）

• 数组（array）

• 函数（function）
  狭义的对象和数组本质上是基本类型数据的集合，对象是一组无序键值对的集合，数组则是一组有序键值对（键名为从0开始的数字）的集合；

函数在JavaScript当中既是处理数据的方法，更是一种数据类型，既可赋值也能传参；

• 数值型
  Number类型所有数字以64位浮点数形式存储（相当于双精度数值）；

各种进制的数字的字面量表示

var a = 12//十进制，12
var b = 0B1//二进制，2
var c = 010 //八进制，8
var d = 0x10 // 十六进制，16
var e = 1.503e7 //科学计数法，15030000

【TIP】
在进行进制间的算术计算时，最终将转换为十进制；
八进制在严格模式下是无效的，会报错；
数值的范围
js能表示的数值的最大、最小范围保存在Number.MAX_VALUE和Number.MIN_VALUE当中；
无穷大的数值存储在Number.POSITIVE_INFINITY，无穷小的数值Number.NEGEITIVE_INFINITY，可用isFinite()函数检测一个数值是否是无穷数值；

NaN
NaN是一个特殊的数值，表示非数字，主要出现在本来要返回数值的操作数未返回数值的情况下最终抛出一个NaN替代，主要出现场景如下：

//在进行算术运算时，无法将该变量进行数据类型转换为数值；
var a =1,b= "h"
a-b
//不符合算是运算法则
0/0

【TIP】
使用typeof NaN会抛出"number"，证明NaN是一个特殊的数值；
NaN === NaN结果是false，证明，NaN不等于任何值；
可使用isNaN()判断一个值是否为NaN
数值类型转换
js提供三个方法将数据转换为数值类型，包括Number()、parseInt()和parseFloat();
Number()可将所有类型数据转换为数值，parseInt()和parseFloat()能将字符串转换为数值；

Number()除了值为undefined、字符串和对象无法转换为数值的将转换为NaN，其他都可转换为数值;

此外，还可以使用算术操作符实现数值类型转换，作用相同于Number()：

<pre>
在进行字符串转换为数值时，通常使用parseInt()，该方法的处理原理是忽略字符串前的空格，直到找到第一个非空格字符，
如果第一个字符不是数字字符或负号，则返回NaN，也就是说parseInt('')和parseInt(null)与Number()的返回值不同；
</pre>

<pre>
可为parseInt()提供第二个参数，指明要进行转换的数值的进制
</pre>

<pre>
parseFloat()方法的处理原理基本和parseInt()类似，区别在遇到第一个小数点是有效的，第二小数点是无效的，并且直解析十进制；
</pre>

---

• 字符串型
  字符串可以看做是放置在''或""内的零个或多个字符的数据；

字符串的多种处理方式

//可用单引号也可用双引号；
var a = "H",
      b = 'E';
//长字符串的表示，多适用于HTML模板的表示
var c = "
            <template> \
                     <h1>JavaScript</h1> \
                    <p>Hello World!</p> \
            </template>
"
//多个字符串的拼接，多适用于添加js代码
var c = "hello"+"world"+document.getElementById('demo').innerHTML

转移字符
string数据类型包含一些特殊的字符，用于表示非打印字符或是具有其他用途的字符；

\t:制表符
\n:换行符
\r:回车
\b:退格
\\:反斜杠
\':单引号
\":双引号
\xnn:以十六进制代码nn（n为0~F）表示一个字符，如\x41表示"A"
\unnnn:以十六进制代码nnnn表示一个Unicode字符

字符串类型转换
将其他类型数据转换为字符串型有三种方法：

1.每个字符串均有toString()方法
var a = 11,b;
a.toString()//"11"
b.toString()//对于只声明未赋值的变量或null，toString()将报错

2.String()函数对于任何类型的数据均有效
String(null)//"null"
String(undefined)//"undefined"
String(true)//"true"

3.空字符串""+其他类型数据
""+undefined//"undefined"
""+null//"null"

字符串与数组
字符串可以看作字符数组并且具有length属性，和真实数组不同的是该数组元素只能读不能写，并且没有数组相应的方法；

---

• 布尔型
  布尔型数据使用true和false表示，代表真或假，js中所有类型的数据都可以表示成布尔类型的数据；

布尔类型数据转换
可使用转型函数Boolean()可将数据转换为布尔型数据；

除了以下六个数据外，其他类型的布尔值均为true；

0
NaN
undefined
null
""
false

布尔型的应用场景
布尔型数据往往结合流程控制语句用于执行条件代码块

var message = "hello world"
if(message){
  alter(message)
}

---

• 对象类型
  对象本质上是由若干键值对构成的无序数据的集合；

对象的创建
对象创建的方法包括以下3种：

1.字面量法
var a = {a:1,b:2};
2.Object构造函数法
var b = new Object();
3.Object.create()法
var c = Object.create(null)

以上3种方法，字面量法最为简洁，Object方法比较正式，Object.create()常用于原型继承场景；
对象的读写操作
对象的键或值可看做对象的属性和方法，属性代表对象的特性，方法代表对象的能力；

//写操作
1.直接赋值
var a = {
    name:"teren",
    age:18,
    say:function(){
      console.log('hi')
    }
}
2.动态创建
a.height = 185
a.['weight'] = '60kg'
a.ability = function(){
    return "talk"
}
//读操作
a.name
a['age']

查看所有属性

Object.keys(a)

delete命令
delete命令用于删除对象的属性，但delete只能删除对象本身的属性，无法删除继承的属性；由var声明的全局变量默认是无法删除的；在Object.definedProperty方法的configurable定义为false的也不能删除；



in运算符
in运算符可用来判断对象的某个属性是否存在，但in无法判断这个属性是属于自身的还是继承的，可用Object.hasOwnProperty()去判断属性；

• 数组
  数组是按照一定次序（起始编号为0的数字序列）的一组数据集合；

数组的读写操作

数组的length属性
length属性是一个动态值，根据数组元素成员个数而发生变化;

length属性是可写的，当length属性的长度大于当前长度，则会向数组添加undefined值，若小于当前长度则会删减值，可利用这一特性清空数组；

数组的遍历
数组的遍历最常用方法为for循环，此外还有forEach、for in和Object.keys();

var arr = [1,2,3,4]
for(var i=0;i<arr.length;i++){
    console.log(arr[i])
}

var arr = [1,2,3,4]
arr.foo = true;
for(var key in arr){
   console.log(key)
}
//0
//1
//2
//3
//4
//foo
[注]for...in循环不仅遍历数组的数字键，还会遍历非数字键，所以一般数组的循环遍历都采用for循环；

var arr = [1,2,3,4]
arr.forEach(function(value,key){
    console.log(key+"."+value)
})

var arr = [1,2,3]
console.log(Object.keys(arr))

类数组对象
js中有些对象被称作“类数组对象”，样子看上去很像数组，实际是个对象，并且没有数组的相关属性和方法，例如函数的arguments对象、DOM元素集和字符串；


可以使用Array.prototype.slice.call(likeArrayObject)使得类数组对象变成真实的数组；

---

3.小结

通过整篇文章，我们可以了解到：

• JavaScript的代码是由一条条语句组成的，分号表示一条语句的结束；

• 语句当中包含处理数据的表达式，表达式是可以得到返回值的计算式；

• JavaScript是一门弱类型语言，使用var声明变量是，变量的数据类型将根据具体值而动态转变；

• JavaScript的数据类型主要包括数值、字符串、布尔型、对象（狭义的对象、数组和函数）、undefined和null六种；

• 数值、字符串、布尔型又称为基本数据类型，所有的数据都是由这三种最基本的数据类型构成，对象、数组和函数可称为复杂数据类型，由基本数据类型构成；

• 数值类型的数据可通过不同的前缀表示不同进制的数值，也可用科学计数法表示，存在最值和无穷值；NaN是一个特殊的数值，常出现在不符合算术运算法则和无法将变量进行数据类型转换为数值的运算场景；数值类型转换的方法包括Number(),parseInt(),parseFloat()和+；

• 字符串可以看做是放在引号内的零个或多个字符的数据；部分特殊字符需要转移符号反斜杠才能表示出来；字符串可以看做是类数组数据，可使用Array.prototype.slice.call(str)将其转变为真数组；字符串类型转换方法包括String()，toString()和 ""；

• 布尔型的值只有true和false，js中所有类型的数据都可以表示成布尔类型的数据；布尔类型的数据转换方法有Boolean()和!!；除了false，null，undefined，0，NaN，""外，其他所有类型的数据的布尔值都是true；

• 对象本质上是若干键值对构成的无序数据的集合；对象的创建方法包括{}，new Object和Object.create(null)；对象的读写操作可使用点操作和方括号操作；遍历对象的方法有for...in和Object.keys()；可使用delete命令删除对象的自身属性，继承的属性、var声明的变量以及在Object.definedProperty({},"name",{value:"teren",configurable:false})也无法删除；

• 数组是按照一定次序（起始编号为0的数字序列）的一组数据集合；数组的读写操作只能使用方括号操作；遍历数组的方法包括for，forEach，Obeject.keys；类数组对象包括HTMLCollection对象、函数的arguments对象以及字符串，可以使用Array.prototype.slice.call(likeArrayObject)使得类数组对象变成真实的数组；

---

参考资料

• 《JavaScript高级程序设计（第3版）》

• 《JavaScript标准参考教程》——阮一峰