Vue学习扩展

Vue学习扩展

• 字符串扩展
• 结构表达式
• 函数优化

String原始方法

• indexOf
• lastindexOf
• length
• substr
• substring
• charAt
• concat

ES6字符串扩展API:

• includes()
  返回布尔值,表示是否找到了参数字符串
• startsWith()
  返回布尔值,表示参数字符串是否在原字符串头部
• endsWith()
  返回布尔值,表示参数字符串是否在原字符串尾部

结构表达式

let arr =[1,2,3]
ES6通过摄制角标来获取值
const [x,y,z] = arr;
console.log(x,y,z);

对象:

const person = {
    name:"jack",
    age:21,
    language: ['java','js','css']
}

// 解构表达式获取值
const {name,age,language} = person;
// 打印
console.log(name);
console.log(age);
console.log(language);

函数简写方式

1.定义一个加法的方法 传入两个参数a , b 计算a+b的结果并返回;如果B为空 则给B默认赋值为1

function add(a,b){
 if ( b == null ){
        b=1;}
     return a+b;
}

简化改进:
function add2(a,b){
    if(!b){
     b=1}
   return a+b;
}

简化
   function add3(a,b){
     b=b || 1;
   return a + b;
}

ES6改进写法
function add4(a,b=1){
return a+b;
}

箭头函数

一个参数时:
var print =function(a){
console.log(a)
}
简写为:
var print = a =>console.log(a);

等号后面的称为 匿名函数
var print1=function(a){
return a + b;
}
var print1 = a =>{
return a+10
}
当只有一行代码不需要写{}
var print1 = a => a+10;

多个参数的情况
两个参数的情况
var print = function(a,b){
return a + b;
}
可以简写为
var print = (a+b) => a+b

练习
function print1(a){
return a + 1;
}
匿名函数
var print01=funtion(a){
return a + 1;
}
函数箭头
var print3 = a => {
return a + 1;
}
var print3 = a => a+1;
var print5=function(a ,b){
return a + b;
}
var print5 = (a,b) => a+b;

对象函数简写

一个对象函数里面有eat方法
let person={
name:“lucy”,
eat1:function(food){
console.log(this.name+“2正在吃”+foog);
},
eat2:food=>console.log(person.name+“4正在吃”+food),
eat3(food){
console.log(this.name+“3正在吃”+food)
},eat4:food=>console.log(this.name+“2正在吃”+food)}

map方法

数组中新增map方法

map

一个字符串数组 转为int数组
let arr =[‘1’,‘20’,’-5’,‘3’]
console.log(arr)
arr=arr.map(s=>parseInt(s));
console.log(arr)