发表评论
206 次浏览

A+

所属分类：Web前端

摘要

　　var 声明的变量,无论在哪里声明,都会当成在当前作用域顶部声明的变量,这个就是变量的提升机制

便宜好用的国外VPS推荐

一.块级作用域Let和Const

1.let

　　var 声明的变量,无论在哪里声明,都会当成在当前作用域顶部声明的变量,这个就是变量的提升机制

　　let声明的变量,不会提升,可以将变量的作用域声明在当前的代码块中

　　let声明的变量,防止变量的重复声明

var a  = 10 ; let a  = 20 ; 报错a已经声明过了

　　同一作用域下,不能使用let重复声明已经存在的变量,但如果在不同的作用域下,则是可以的

let a = 10 ; {     let a = 20        }  没问题,在不同作用域下

2.const声明

　　const声明的是常量,必须在声明的同时初始化

const a = 10 ;   //没问题,有初始化也就是有赋值  const a; a=10 //报错

　　同一作用域下,不能使用const重复声明已经存在的变量(不论是let,还是var声明过的变量)

　　如果使用const声明对象,对象本身的绑定不能修改,但是对象的属性和值是可以修改的

const person = {       name : '海贼王',       age : 15         }  person = {       name : '鲁夫',       age : 15         } //报错了,对象本身的绑定不能修改  person.name = '鲁夫' //可以,对象的值是可以修改的  person.sex = '男' //可以,对象的属性可以修改

3.全局块作用域绑定

使用var声明的变量或对象,将作为浏览器环境中的window对象的属性,这就意味着var声明的很有可能会覆盖掉一个已经存在的全局属性

var get = 20 ; console.log(window.get) // 20

使用let或const,则会在全局作用域下创建一个新的绑定,该绑定不会成功window对象的属性

总结 : 如果你不想覆盖window对象的属性,那么你就使用let 和 const 声明变量和常量

二.模板字面量　　

` `

1.如果需要再字符串中添加新的一行,只需要在代码中直接换行即可

let title = `你好, 中国欢迎您`  你好中国欢迎您

2.字符串占位符:合法嵌入 ${ }

let age = 10  let allName = `海贼王:${age}` //海贼王:10

三.默认参数

　　使用默认参数 undefined

　　不使用默认参数 null

function urlName(url='/home',name='abc',callback){}

//使用url和那么的默认参数 urlName();  //使用name的默认参数 urlName('/index');  //使用某一个的默认参数,传入undefined //使用url和name的默认参数 urlName(undefined,undefined,function(){});  //不使用某一个的默认参数,传入null
//不使用name的默认参数,使用url的默认参数 urlName(undefined,null,function(){});

四.rest参数

函数有一个特别的地方,就是无论函数定义了多少个形参,都可以传入任意数量的实参;

函数内部还可以通过arguments对象得到传入的参数

在函数命名前添加三点,那么就是一个rest参数 ...opt , 用于获取多余的参数

注意:每个函数只能有一个rest参数,并且只能是最后的一个参数

function ( a, ...opt){}  // opt可以做循环,表示除了a,之后得到的所以参数 //argument,表示包括 a 和 opt的所以参数

五.展开运算符

展开运行符和rest参数相似,都是三个点. 展开运算符可以将一个数组转换为各个独立的参数, 也可用于取出对象的所有可遍历属性,而rest参数是指多个独立的参数,并通过整合后的数组来访问

function sum(a,b,c){    return a+b+c }  let arr = [1,2,3] sum(...arr);  //便是的是arr中的每个值分别传入sum函数中

展开运算符可以用来复制数组,得到的是深克隆(互不影响,互补干扰)

let arr1 = [1,2,3];  let arr2 = arr1;        //arr2 和  arr1 是同一个数组 (浅克隆)  let arr3 = [...arr1];  //arr3 和  arr1 是不同数组 (深克隆)  arr1[0] = 4;  //arr2[0]  ,  得到4  (浅克隆) //arr3[0]  ,  得到1  (深克隆)

展开运算符可用来合并数组

let arr1 = ['a'] ; let arr2 = ['b','c'] ; let arr3 = ['d','e'] ;  console.log([...arr1,...arr2,arr3]) //['a','b','c','d','e']

展开运算符还可以取出对象的所有可遍历属性,复制到当前对象中

let person = {     name : '鲁夫',     age : 13 }  let persons = { ...person , sex:'男'}  //  let person = { //      name : '鲁夫', //      age : 13 //      sex : '男' //  }

六.对象字面量语法扩展

1.对象中有同名的参数,只写属性名即可 ; 有相同的本地变量,只写属性名即可

2.定义对象方法时,可以省略冒号和function关键字

function first(firtst){      let  section = '第二'      return{           firtst : first,                 section : section,              three:function(){                console.log(first)           }     } }       function first(firtst){      let  section = '第二'      return{           firtst,    //相同参数,只写属性名           section,   //相同本地参数,只写属性名           three(){   //省略冒号和function                console.log(first)           }     } }

3.ES6新增了,可以再对象中使用可计算的属性名称 ; 如果属性名包括特殊字符或中文,或可计算的属性名,则只能使用[ ]

let syf = name  let person = {} person["last  name"] = '鲁夫'        //属性名有空格 person["first" + syf]  = '蒙奇D'     // 属性名通过计算得到 person.age = 13                     //常规,用.访问  //得到 :  //{ //     'last name' : '鲁夫', //     'first name' : '蒙奇D', //     'age' : 13 //}

七.解构赋值

1.对象解构 { }

let person = {     name:'鲁夫',     age:13,     sex:'男', }  let {name,age,sex} = person  console.log(name,age,sex) // 鲁夫,13,男

let person = {     name : ' 鲁夫'     age : 13,     sex : '男',     message:{         id:1,         firstName : '蒙奇D'     } }  let {name,age,sex,message:{firstName:message}} = person  //console.log(name)鲁夫 //console.log(age)13 //console.log(sex)男 //console.log(message)蒙奇D

2.数组解构 [ ] 逗号是占位符

let arr = [1,2,3] ler [,,c] = arr // c = 3

便宜好用的国外VPS推荐