js 语言特性（上）

ES标准

ES5

ES5标准即ECMA-262第5版，为目前市面上全部浏览器都能支持并运行的js版本，目前大部分浏览器都只实现了ES6的部分特性，只有谷歌浏览器能够手动开启ES6语法的完全支持。所以当前的前端开发，不建议在浏览器端直接运行es6语法的js，但不代表不可以用高效的es6语法来开发前端，因为有babeljs这一将es6语法编译为向后兼容的js语法的工具。

ES6

ES6标准即ECMA-262第6版，在兼容ES5的基础上，新增了大量的方便好用的新特性，例如箭头函数，迭代器，解构赋值等，并且es6对面向对象有着更好的支持，新增了class这一语法糖，以及高效且高可读性的异步处理模块Promise

基础语法

变量

js的变量声明只与变量的作用域有关，与变量的具体类型无关

为ES5中的变量类型，具有声明后在其所在函数域内都能生效（存在变量提升现象）且能重复定义的特点，不建议使用

声明后在其所在域内都能生效（变量提升：代码块内定义，代码块外依然可以调用；代码块：{}内的代码，包含{}内的{}）

function test() {
    console.log(varTest); // undefined
    var varTest = 'test var OK.';
    console.log(varTest); // test var OK.
}

function test() {
    if(1){
        var varTest = 'test var OK.';
    }
    console.log(varTest); // test var OK.
}

可重复声明

function test() {
    var varTest = 'test var OK.';
    console.log(varTest); // test var OK.
    var varTest = 'test var OK2.';
    console.log(varTest); // test var OK2.
}

为ES6中新增特性，具有声明后只能在其所在代码块内生效且同级代码块内不能重复定义的特点

声明后只能在代码块内生效

function test() {
    console.log(letTest); // 报错 letTest is not defined
    let letTest = 'test var OK.';
    console.log(letTest); // 无法运行到这一步
}

function test() {
    if(1){
        let letTest = 'test var OK.';
        console.log(letTest); // test var OK.
    }
    console.log(varTest); // 报错 letTest is not defined
}

同级代码块内不能重复定义

function test() {
    let letTest = 'test var OK.';
    console.log(letTest); // test var OK.
    if(1){
        let letTest = 'test var OK.2';
        console.log(letTest); // test var OK.2
    }
    let letTest = 'test var OK3.';// 报错 'letTest' has already been declared
    console.log(letTest); // 无法运行到这一步
}

const

和let的特性一样，不同之处在于声明后无法进行重新赋值

let a=0;
a=2
const b=0
b=2 // 报错 Assignment to constant variable.

类型

js六大基本类型：undefined、string、number、object、boolean、function；

undefined：初始声明后未赋值的变量，关于null和undefined
string：字符串
number：数字，包括整数和浮点数
object：以格式标记数据，也就是大名鼎鼎的JSON（JavaScript Object Notation）数据格式，已超脱出JS本身，成为计算机业界数据格式的一种标准
boolean：true or false
function：在js中，函数是作为一种参数而存在的，虽然这种写法在其他语言中也可以实现，但在js中的实现最为方便，应用最为广泛和灵活，在js的学习中，经常会遇到函数中的函数中的函数这类多层套娃的现象，会刷新大家对函数的认识

最后

js是一种弱类型语言，只有在调用参数时才会判断参数的类型，不同的参数类型不影响其之间的运算，运算结果会由机器自动判断，例如

let a=0;
let b=1
console.log(a+b)//1
let c='1'
console.log(a+c)//01

编写代码时应尽量避免这种骚操作，不同类型的数据不要贸然进行运算，js的这个特点只能作为使用小技巧

操作符

+-*/

基本的加减乘除，用于number类型数据计算，其中+也可用于字符串的拼接

++，--

自增、自减，同其他语言，++a则先加后调用，a++则先调用后加

&& | ||

&：按位与
&&：与，从左到右开始判断，若其中某项返回undefined、false、0等假值，则停止判断，返回true或false ；故可用于条件判断执行单行函数，例如

var user;  //定义变量
(!user && console.log("没有赋值"));  //返回提示信息“没有赋值”

等效于

var user;  //定义变量
if (!user){  //条件判断
    console.log("变量没有赋值");
}

|：按位或，也可用于interface或type编写时，限制变量参数的内容，例如

function open(info: string = "提示",
       type: "error" | "info" | "success" | "warning" = "info",
       autoHideDuration: number = 3000,
       open: boolean = true) {
    return {
      type: constant.OPEN_SNACK_ALERT,
      data: {
        info, type, open, autoHideDuration
      }
    }
}

||：或，从左到右，判断每一项，若结果不为false则返回其中首个不为undefined、false、0等假值，也可以用于为变量赋予默认值，例如

const a="haoye"
const b=a||"haoye" // 若a未被赋值，则b默认为"haoye"

逻辑与和逻辑或运算符具有以下 2 个特点：

在逻辑运算过程中，临时把操作数转换为布尔值，然后根据布尔值决定下一步的操作，但是不会影响操作数的类型和最后返回结果。

受控于第一个操作数，可能不会执行第二个操作数。

< > <= >= === == !== !=

分别为：小于、大于、小于等于、大于等于、严格等于、不严格等于、严格不等于、不严格不等于（具体区别在此，建议完全摒弃不严格类型）

!

取反，若变量a为undefined、false、0等假值，则!a为true；若为其他，则!a为false

?:

条件运算符，格式同其他语言

b ? x : y

若b为真则执行x，反之执行y，（注意是”执行“，意为b、x、y可以换为有返回值的函数）

可用于变量判断赋值

const a = 2;
const b = a===2 ? 5:6 // a若等于2，则b等于5，反之等于6

假值

false
null
undefined
0
'' (空字符串)
NaN