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的变量申明只与变量的作用域无关,与变量的具体类型无关

  • var

为ES5中的变量类型,具备申明后在其所在函数域内都能失效(存在变量晋升景象)能反复定义的特点,不倡议应用

  1. 申明后在其所在域内都能失效(变量晋升:代码块内定义,代码块外仍然能够调用;代码块:{}内的代码,蕴含{}内的{}
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.}
  1. 可反复申明
function test() {    var varTest = 'test var OK.';    console.log(varTest); // test var OK.    var varTest = 'test var OK2.';    console.log(varTest); // test var OK2.}
  • let

为ES6中新增个性,具备申明后只能在其所在代码块内失效同级代码块内不能反复定义的特点

  1. 申明后只能在代码块内失效
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}
  1. 同级代码块内不能反复定义
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=2const b=0b=2 // 报错 Assignment to constant variable.

类型

js六大根本类型:undefinedstringnumberobjectbooleanfunction

  • undefined:初始申明后未赋值的变量,对于nullundefined
  • string:字符串
  • number:数字,包含整数和浮点数
  • object:以<Key,Value>格局标记数据,也就是赫赫有名的JSON(JavaScript Object Notation)数据格式,已超脱出JS自身,成为计算机业界数据格式的一种规范
  • boolean:true or false
  • function:在js中,函数是作为一种参数而存在的,尽管这种写法在其余语言中也能够实现,但在js中的实现最为不便,利用最为宽泛和灵便,在js的学习中,常常会遇到函数中的函数中的函数这类多层套娃的景象,会刷新大家对函数的意识

最初

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

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

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

操作符

+-*/

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

++,--

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

&& | ||

  • &:按位与
  • &&:与,从左到右开始判断,若其中某项返回undefinedfalse0假值,则进行判断,返回truefalse ;故可用于条件判断执行单行函数,例如
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则返回其中首个不为undefinedfalse0假值,也能够用于为变量赋予默认值,例如
const a="haoye"const b=a||"haoye" // 若a未被赋值,则b默认为"haoye"

逻辑与和逻辑或运算符具备以下 2 个特点:

  • 在逻辑运算过程中,长期把操作数转换为布尔值,而后依据布尔值决定下一步的操作,然而不会影响操作数的类型和最初返回后果。
  • 受控于第一个操作数,可能不会执行第二个操作数。

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

别离为:小于、大于、小于等于、大于等于、严格等于、不严格等于、严格不等于、不严格不等于(具体区别在此,倡议齐全摒弃不严格类型)

!

取反,若变量aundefinedfalse0假值,则!a为true;若为其余,则!afalse

?:

条件运算符,格局同其余语言

b ? x : y

若b为真则执行x,反之执行y,(留神是”执行“,意为b、x、y能够换为有返回值的函数)

可用于变量判断赋值

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

假值

  1. false
  2. null
  3. undefined
  4. 0
  5. '' (空字符串)
  6. NaN