一篇拖了快两年的文章 hhhh

手把手带你学微信程序系列 —— 入门

一、定义变量

let关键字简单语法学习
一、 let关键字
let 同 var

1.1 出现变量提升的问题

var a = 10;
console.log(a);
//正常情况在控制台打印 10

//反过来呢？
console.log(a);
var a = 10;
//则会出现未定义 undifined

1.2 let 代码块只在当前代码中有效

类比于局部变量

for(var i=0;i<=10;i++){
    console.log(i);
}

console.log(i); //结果为11，i依然有效

126节 ES6语法 （二）

for(let i=0;i<10;i++){
    console.log(i);
}
// 此时打印i

1.3 const 只读变量

127节 const关键字

1. 常量 readOnly

const PI = 3.14;
PI = 3;

1. const 指向的地址不会改变，但是可以改变该地址的数据

const list=[1,2,3];
list.push(4);
console.log(list);

二、函数的基本使用

2.1 定义函数

128节 ES6语法 —— 定义函数

1. 默认参数（按顺序传参，默认参数要在非默认参数前面）

fucndemo:function(){
    function person(name,age=18){
    console.log("=============");
    console.log(name,age);
    console.log("=============");
}
    person("GG",20);
},

2.解构传参，使用对象传参 —— 解决个别无法传参的问题

fucndemo:function(){
    function person(name,age=18,gender="男",height=170){
    console.log("=============");
    console.log(name,age,gender,height);
    console.log("=============");
}
person("GG",20,height=180);
},

因此，可以采用对象传参

fucndemo:function(){
    function person(name,{age=18,gender="男",height=170}){
    console.log("=============");
    console.log(name,age,gender,height);
    console.log("=============");
}
    person("GG",20,{height:180});
        person("GG",{});
    //使用对象传值的时候，默认值要传一个空值, 或者在定义函数的时候给一个默认值
     //function person(name,{age=18,gender="男",height=170}={})
     // person("GG");

},

2.2 ES6 箭头函数？

129节 箭头函数

1. 模拟一个网络请求，使用两种方式

fucndemo:function(){
// 网络请求的模拟
    function request(url,success){
    console.log("正在请求:"+url);
    console.log("请求完成");
        if(success){
            success([1,2,3,4]);
        }
    }
    // request("http://www.baidu.com/",function(res){
    // console.log(res);
    // });
    request("http://www.baidu.com/", res =>{
    console.log(res);
});
},

1. 返回多个参数

function request(url,success){
    console.log("正在请求:"+url);
    console.log("请求完成");
        if(success){
            success([1,2,3,4],"aaa");
        }
}
// request("http://www.baidu.com/",function(res){
// console.log(res);
// });
//如果没有任何参数，可以使用 空的括号
    request("http://www.baidu.com/", (res1,res2) =>{
    console.log(res1,res2);
});

1. 获取返回值

function request(url,success){
    console.log("正在请求:"+url);
    console.log("请求完成");
        if(success){
            let result=success([1,2,3,4],"aaa");
        console.log(result);
        }
    }
// request("http://www.baidu.com/",function(res){
// console.log(res);
// });
    request("http://www.baidu.com/", (res1,res2) =>{
    console.log(res1,res2);
    return true;
    });
},

1. 直接返回

request("http://www.baidu.com/", (res1, res2) => "hello world");

130节 promise 风格调用

promisedemon:function(){
    let p= new Promise((resolve,reject) =>{
        setTimeout(()=>{
//模拟网络请求
        // resolve([1,2,3,4]); 请求成功了，执行 then方法
       // reject("请求失败。。。"); 请求失败了 执行 catch方法
        },1000);
});
//等价于succe回调，resolve 和 reject 只会执行一种情况
    p.then(res =>{
        console.log(res);
        console.log(res+"\n请求成功");
    }).catch(err =>{
        console.log(err);
        console.log("请求失败");
});
},

三、类的学习

3.1 定义类以及使用构造函数

131节 ES6 类的学习

1. 类的基本使用

// 定义 ES6 中的类，类中每个方法都不能加逗号
classdemo:function(){
    class Person{
	// 构造函数
    constructor(name,age){
    this.name = name;
    this.age = age;
}
    sayHello(){
    console.log("Hello World,my name is "+this.name+" and I am "+this.age);
    }
}
    var p =new Person("dd",18);
    p.sayHello();//该方法通过对象调用
},

//Hello World,my name is dd and I am 18

3.2 定义类以及使用静态方法

1. 定义静态方法，直接调用方法
   使用 static 关键字 修饰的方法或者 类，可以直接通过类名调用方法
   对象方法和类方法灵活使用

四、模块化代码

4.1 import 或者 export

132节 模块
使用export 和 impoet 语句即可，可以直接导入js文件

eg：
新建一个util.js 文件，添加如下代码

function sayHello()
{
    console.log("hello world");
}
export {sayHello}

然后在 index.js 文件中导入，使用 {} 将 sayHello 从 util.js 中解构出来

import {sayHello} from "util.js"
Page({
/** * 页面的初始数据 */
    data: {},
/** * 生命周期函数--监听页面加载 */
    onLoad: function (options) {
        sayHello();
    },
})

运行结果自然是 hello world