第一次发文章

125 阅读4分钟

我的第一篇文章

掘金真是一个非常不错的平台,随便写点东西,希望以后可以写出好的文章,第一次不知道发些什么东西,多多包涵,还不太会使用,慢慢学习

第一次分享一些es6语法吧

新的关键字

let    const

let  和  var  区别

//let定义的变量不会提升(不存在预解析)

//let定义的变量不能重复定义

//let定义的变量不在window上

//在循环中,let定义的变量会被限制

//let自己会创建一个块级作用域  {}在大括号中使用,出了大括号就不能使用  //if/switch/for...

  

//const定义的变量值不能改  -  常量

//   不在window上

//   没有提升

//   不能重复定义

//   创建一个块级作用域

//   不允许重新赋值(值不能改)

//   声明的时候必须赋值

箭头函数

es6中提供了一种定义函数的方式(简写函数)

function fn(){

    console.log(123)

}


var fn = function(){}


var fn = ()=>{}

fn()

 

//如果箭头函数的形参只有一个,那就可以省略小括号

var fn = function(a){

    a++

    console.log(a)

}



var fn = a=>{

    a++

    console.log(a)

}

  

//如果箭头函数的代码只有一行,那就可以省略大括号

var fn = a=>console.log(++a)

  

//注意如果箭头函数的代码只有一行,且有return关键字,也省略

var bool = arr.everyfunction(v){

    return v.checked

})


var bool = arr.every(v =>v.checked

函数默认值

function fn(a,b=2){  //  形参默认值 - 形参可选项

    return a+b

}

模板字符串

es6提供了一种定义字符串的方法:  ``  反引号

var str = asdff

//怎么定义就怎么输出 ,可以让一个字符串分多行定义

var a = `

    aaa

`

var a = 10;

var str = 小明今年${a}岁   //拼接方便

解构赋值


var obj = {

    name:'zhnagsan',

    age:'12'

}

var {name,age} = obj

console.long(name,age)

//普通的解构赋值:变量名和键名要保持一致

  


//给解构出来的数据取别名

var{name:a,age}

console.log(a,age)

  


  


var obj = {

    name:'zhnagsan',

    age:'12'

    wife:{

        name:''

        age:''

    }

}

var  {wife} = obj

var {name,age} = wife

  


var {wife:{name,age}} = obj;  //多重解构

  


  


//数组

var arr = [1,2,3,4]

var  [a] = arr;        //按顺序来取

var [_,_,_,d] = arr

console.log(d)

  


var arr = [

    1,

    [

        2,

        3

    ]

]

//数组的多重解构

var [_,[a,b]] = arr

...运算符

es6提供了...运算符

将多可以个值合并成一个数组,也将一个数组展开成多个值

  


//计算多个值得和

function fn(...arr){

    var res = arr.reduce((a,b)=>a+b)

}

fn(1,2,3)

fn(1,2,3,4,5)

  


  


//展开

function fn(1,2,3){

    console.log(a+b+c)

}

var arr = [2,3,4];

fn(...arr)

  


  


var arr = [1,5,3,6,9,8,5,3]  //计算最大值

Math.max(..arr)

对象的简写方式


var age = '12'

var obj = {name:name,age,age}

//简写:当键和值使用的变量名相同,就可以简写

var obj = {name,age}

  


function eat(){

  console.log(123)

}

var obj ={

    name,age,eat

}

//另一种方式简写

var obj ={

    name,

    age,

    eat(){console.log(1223)}

}

  

检测数据类型

//js所有底层数据都是对像


Object.prototype.toString.call(数据)

//伪数组

本质是一个对象
伪数组会有length属性,用来描述有多少元素
不能使用数组方法


//伪数组转成数组

//遍历

var arr = []

for(var i =0;i<wei.length,i++){

    arr.push(wei[i])

}

//利用系统提供的方法转换

Array.prototype.slice.call(wei)

  


常见的为数组

//元素集合

 

//argumens

function fn(){

    //函数中的arguments关键字可以将所有的实参收集起来

    console.log(argyments)

}

fn(1,2,3

this关键字

可以写在任何一个地方,在不同的地方意思也不一样

//1、全局中表示window

//2、在普通函数中也是代表window

//3、在事件中:this代表事件源

//4、自调用函数:window

//5、定时器:window

//6、对象方法中:this代表当前对象

//7、箭头函数:this代表当前箭头函数所在作用域的this   //this代表箭头函数上一行代码中的this

//从对象方法看  --- this代表对象

//8、构造函数中的this代表new出来的对象

上下文调用模式

//改变this的指向

function fn(){cl(this)}

  
fn()  ///  window

  
//call - 调用函数

var obj = {name,“张三”}

fn.call(obj)  //调用过程中将this改变      this就是  obj


//有参数

function fn(a,b){cl(a+b);cl(this)}


fn.call(obj,1,2//从call方法的第二个参数开始传入实参  

  
//apply  -  调用函数

fn.apply()

fn.apply(obj)


//有形参

fn.apply(obj,[1,2])  // apply把实参作为数组传入


//bind方法  -  复制函数

var fun = fn.bind(obj)   //复制过程中改变this指向

fun()

  

// function fn(a){

    // console.log(a);

// }

 

document.onclick = function(){

    setTimeout( function(){

        console.log(this);      --document

    }.bind(this) )

}