ES6 语法简要学习
- 一、定义变量
- 1.1 出现变量提升的问题
- 1.2 let 代码块只在当前代码中有效
- 1.3 const 只读变量
- 二、函数的基本使用
- 2.1 定义函数
- 2.2 ES6 箭头函数？
- 三、类的学习
- 3.1 定义类以及使用构造函数
- 3.2 定义类以及使用静态方法
- 四、模块化代码
- 4.1 import 或者 export
一篇拖了快两年的文章 hhhh
手把手带你学微信程序系列 —— 入门
一、定义变量
let关键字简单语法学习
一、 let关键字
let 同 var
1.1 出现变量提升的问题
代码语言：javascript复制var a = 10;
console.log(a);
//正常情况在控制台打印 10
//反过来呢？
console.log(a);
var a = 10;
//则会出现未定义 undifined1.2 let 代码块只在当前代码中有效
类比于局部变量
代码语言：javascript复制for(var i=0;i<=10;i ){
console.log(i);
}
console.log(i); //结果为11，i依然有效
126节 ES6语法 （二）
代码语言：javascript复制for(let i=0;i<10;i ){
console.log(i);
}
// 此时打印i
1.3 const 只读变量
127节 const关键字
- 常量 readOnly
const PI = 3.14;
PI = 3;
- const 指向的地址不会改变，但是可以改变该地址的数据
const list=[1,2,3];
list.push(4);
console.log(list);
二、函数的基本使用
2.1 定义函数
128节 ES6语法 —— 定义函数
- 默认参数（按顺序传参，默认参数要在非默认参数前面）
fucndemo:function(){
function person(name,age=18){
console.log("=============");
console.log(name,age);
console.log("=============");
}
person("GG",20);
},2.解构传参，使用对象传参 —— 解决个别无法传参的问题
代码语言：javascript复制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);
},因此，可以采用对象传参
代码语言：javascript复制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节 箭头函数
- 模拟一个网络请求，使用两种方式
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);
});
},- 返回多个参数
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);
});- 获取返回值
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;
});
},- 直接返回
request("http://www.baidu.com/", (res1, res2) => "hello world");130节 promise 风格调用
代码语言：javascript复制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 类的学习
- 类的基本使用
// 定义 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 183.2 定义类以及使用静态方法
- 定义静态方法，直接调用方法 使用 static 关键字 修饰的方法或者 类，可以直接通过类名调用方法 对象方法和类方法灵活使用
四、模块化代码
4.1 import 或者 export
132节 模块
使用export 和 impoet 语句即可，可以直接导入js文件
eg：
新建一个util.js 文件，添加如下代码
代码语言：javascript复制function sayHello()
{
console.log("hello world");
}
export {sayHello}然后在 index.js 文件中导入，使用 {} 将 sayHello 从 util.js 中解构出来
代码语言：javascript复制import {sayHello} from "util.js"
Page({
/**
* 页面的初始数据
*/
data: {},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
sayHello();
},
})运行结果自然是 hello world
