ES6 回顾【01】

// ES6 回顾：
// 1、模板字符串---------------------------------------------------------
/*
var name = "张三";
var age = 20;
console.log(name + "已经" + age + "岁了！"); //常规的拼接写法
console.log(`${name}已经${age}岁啦`);//ES6的模板字符串拼接写法
 */

// 2、属性简写和方法简写--------------------------------------------------
/*
var username = "李四";
var app = {
  username: username, //以前的属性写法；
  //以前的属性写法
  run: function () { 
    console.log(this.username + "在跑步");
  },
};

var app = {
  username, //ES6属性简写，因为上面声明的变量名跟这里的变量名一直。就可以这样写
  //ES6方法简写
  run() {
    console.log(`${this.username}在跑步！`); //输出：李四在跑步！
    console.log(`${username}在跑步`); //输出：李四在跑步
    console.log(this); //输出：{ username: '李四', run: [Function: run] }
    console.log(this.username); //输出：李四
    console.log(username); //输出：李四
    console.log(username === this.username); //输出：true
  },
};
console.log(username); //输出：李四
console.log(app.username); //输出：李四
console.log(`${app.username === username}:123`); //输出：true:123
console.log(app.username === username); //输出：true
app.run();
 */

// 3、箭头函数 this 指向上下文---------------------------------------------------------
// 以前的函数写法
/*
setTimeout(function () {
  console.log("1s后执行"); //1s后执行
  console.log(this); //Timeout对象
  console.log(this._idleTimeout); //1000
}, 1000);
 */

// 箭头函数写法
/*
setTimeout(() => {
  console.log("1s后执行"); //1s后执行
  console.log(this); //{}
  console.log(this._idleTimeout); //undefined
}, 1000);
 */

/*
function a() {
  console.log(1);
  console.log(this); //Object [global]
  setTimeout(function () {
    console.log(2);
  }, 1000);
  console.log(3);
}
a(); //输出顺序 1 、 Object [global] 、3 、 2
 */

/*
var b = () => {
  console.log(this); //{}
  setTimeout(() => {
    console.log(this); //{}
  }, 1000);
};
b();
 */
/*
var c = {
  username: "王五",
  birth: 1994,
  c1: function (nowyear) {
    // aaa 形参等于 nowyear形参
    var c2 = (aaa) => `${this.username}今年：${aaa - this.birth}`;
    // 和上面相同
    // var c2 = (aaa) => {
    //   return `${this.username}今年：${aaa - this.birth}`;
    // };
    return c2(nowyear);
  },
};
console.log(c.c1(2020)); //王五今年：26
 */

//  4、回调函数获取异步方法里面的数据--------------------------------------------------------
/*
function getDate() {
  // 1
  // ajax
  //2
  setTimeout(function () {
    var name = "张三"; //4
    return name;
  }, 1000);
} //3第三步执行结束，未执行到name，无法获取name，则输出undefined
//外部获取异步方法里面的数据
console.log(getDate()); //undefined
 */
// -------------
/*
function getDate(callback) {
  //  ajax
  setTimeout(function () {
    var name = "张三";
    callback(name);
    return name;
  }, 1000);
}
//外部获取异步方法里面的数据
getDate(function (date) {
  console.log(date+"007");//张三0077
});
 */
// -------------
/*
function getDate(callback) {
  //  ajax
  function callback(date) {
    console.log(date + "007"); //张三0077
  }
  setTimeout(function () {
    var name = "张三";
    callback(name);
    return name;
  }, 1000);
}
//外部获取异步方法里面的数据
getDate();
 */
// ------------------------
/*
var b = function (date) {
  console.log(date+"22");
};
function a(cba) {
  // 1
  setTimeout(function () {// 2
    var name = "李四";//3
    b(name);//4 输出 李四22
  }, 100);
}//5结束
a();
 */
// ------------------

/*
//  Promise 来处理异步
//   resolve 表示成功的回调函数
//   reject  表示失败的回调函数

var p = new Promise(function (resolve, reject) {
  // ajax
  setTimeout(function () {
    var name = "张三";
    // if (Math.random() < 0.8) {
    //   resolve(name + "abc"); //如果成功则执行
    // } else {
    //   reject("失败");
    // }
    resolve(name + "abc"); //如果成功则执行
  }, 100);
});
p.then(function (date) {
  console.log(date + "666"); //张三abc666
});
 **/
/*
function getDate(resolve, reject) {
  setTimeout(function () {
    var name = "张三";
    resolve(name + "000");
  }, 100);
}
var p = new Promise(getDate);
p.then(function (date) {
  console.log(date + "999"); //张三000999
});
 */

// 5、声明方式--------------------------------------------------
/**
let a1 = "张三";
var c1 = "王五";
function b() {
  let a2 = "李四";
  let c2 = "李四";
  console.log(a1); //张三
  console.log(a2); //李四
  console.log(c1); //王五
  console.log(c2); //李四
}
b();
console.log(a1); //张三
console.log(a2); // a2 is not defined 未声明
console.log(c1); //王五
console.log(c2); // c2 is not defined
 */
/*
let a1 = 1;
var c1 = 3;
if (true) {
  let a2 = 2;
  var c2 = 4;
}
console.log(a1); // 1
console.log(a2); // a2 is not defined , let 是块作用域的变量声明，无法被外部访问
console.log(c1); // 3
console.log(c2); // 4
 */

/*
const PI = 3.14;
const PI = 34;
// var PI = 5;
console.log(PI); //'PI' has already been declared ,const 声明常量后，无法再次更改。
  */

  //------------------------------------------------------------------------------------------