es6语法,if,for
2020-08-26 11:07:07 来源:admin 点击:781
1.es6基本语法 变量的声明 let(限制作用域 代码块{}) const(常量 只读不可更改)
const PI=3.14156
console.log(PI);
PI=3.14
console.log(PI);
let a=1;
{
let a=2;
console.log(a);
}
var a=[];
for(var i=0;i<10;i++){
a[i]=function(){
console.log(i);
}
}
a[6](); //输出10 直接跳转到最大值
let a=[];
for(let i=0;i<10;i++){
a[i]=function(){
console.log(i);
}
}
a[6](); //输出6
2.es6结构赋值
let[a,b,c]=[1,2,3];
let[a,b,c]=[1,,3]; //b=undefined
let[a,[b,c],d,e,[f,g,h]]=[1,[2,3],4,5,[6,7,8]];
/*...a 数组,可放在开头,不能放在结尾*/
let[a,...b]=[1,2,3,4,5]; //a=1 b=[2,3,4,5]
let[...a]=[1,2,3]; //a=[1,2,3]
3.给字符串绑定值 (es5:字符串拼接) es6:`` 使用模板字符串来动态绑值
{
let a=25;
let h=177;
let str=`我今年${a}岁,身高${h}cm`;
console.log(str);
}
4.es6里面的函数默认值问题
{
stu(undefined,2);
function stu(x,y){
x=x || '0';
console.log(x,y);
}
stu(undefined,3);
function stu(x=0,y=0){
console.log(x,y);
}
}
5.es6里面的箭头函数 优点:保持上下文中的指针(对象)一致
{
let fun=function(){
};
let fun=()=>{console.log(1)}; //{}里面若只有一句话,可不写{}
fun();
let fun=function(x){
console.log(x);
}
let fun=x=>console.log(x); //一个参数可不写(),多个参数时必须写()
fun(1);
let fun=function(x,y){
return x+y;
}
let fun=(x,y)=>x+y; //类似于return x+y
console.log(fun(1,2));
}
自执行函数
{
(function (x){
console.log(x)
}(5));
((x)=>console.log(x))(5);
}
箭头函数后边返回键值对 。注意:添加()包起来执行
{
let fun=()=>({a:1}); //{a:1} 键值对 输出为undefined 把{a:1}认成对象了,没有返回值
console.log(fun()); //输出为{a:1} 键值对对象
}
{
let a=[1,3,9,7,5,0,6,4];
console.log(a.sort((n1,n2)=>n1-n2));
a.map(function(v,k){
console.log(v); //v=每一个对应的值
console.log(k); //k=索引
})
console.log(this); //this=window
Array.prototype.mysort=function(){
console.log(this); //this=(7) [1, 2, 3, 4, 5, 6, 7] 即Array数组
}
var s=new Array(1,2,3,4,5,6,7);
s.mysort();
Array.prototype.mysort=()=>{
console.log(this); //this=window
}
var s=new Array(1,2,3,4,5,6,7);
s.mysort();
}
6.es6里面的遍历 for......of
{
let a=["red","orange","plum"];
for(let item in a){
console.log(item); //输出为索引,要想输出为值,a[item]
}
for(let item of a){
console.log(item); //输出为值
}
let b=[{name:'Weiflr',sex:'女',age:'22'},{name:'Weiflr',sex:'女',age:'22'}];
for(let key of b){ //of 后面必须是可迭代的集合
console.log(key) //输出={name:'Weiflr',sex:'女',age:'22'}
}
}
7.es6里面的构造函数
{
function list(){
this.x;
this.y;
this.init=function(){
}
}
var i=new list();
}
8.es6里面的class声明
{
class student{
constructor(n=0,s=0,a=0){ //构造函数 是给属性初始化默认值的 es6里面的属性的定义在constructor
this.name=n;
this.sex=s;
this.age=a;
}
sleep(){
console.log("睡觉ing") //在原型链中有sleep__proto__:
}
tostring(){ //tostring 方法重写
console.log(555);
}
get getsex(){
return this.name;
}
set setsex(value){ //设置值时必须要有参数
this.name=value;
}
}
let stu =new student(n=12,s=4,a=6);
// stu.sleep();
// stu.tostring(); //紫色方块是方法 蓝色长方形是对象
console.log(stu);
stu.setsex="女"; //设置值
console.log(stu.getsex); //12
stu.age=99;
console.log(stu.age);
}
9.es6里面的import(导入)、export(导出)
{
import Vue from 'vue';
export class ani extends people{ //声明一个类ani,继承people,导出
constructor(props){
}
}
//把react导入到当前的项目文件中,Components是react中的一个属性,
import React,{Components} from 'react';
class stu extends Components{
constructor(props){
super(props);
this.state={
}
}
}
export default stu; //export default可以把它写到前面(写法==ani)
}
if的使用
<a class="layui-btn layui-btn-xs mt8 {$btn.btnclass} ${item.net_count ? '' : 'hidden' }" lay-event="{$btn.btnsign}"