几个ES6属性

EcmaScript 或 ES6 是 ECMAScript 语言的第 6 个主要版本。它是 2015 年推出的较新版本的 JavaScript。本文主要介绍几个常用的js属性

let 和 const 关键字

ES6 引入了 newlet和const关键字来声明变量。在 ES6 之前，声明变量的标准是var. 让我们看看它们之间的区别。

ES5 只有Global Scope和Functional Scope。使用关键字声明的变量var是函数范围的，可以在范围内的顶部提升。这在开发过程中带来了许多问题。

而关键字letandconst是Block Scoped，这意味着{ }不能从块外部访问内部的变量。

理解 let 和 const 变量声明。

let当要重新分配值时使用，const当值将通过开发固定和恒定时使用，因为它无法重新分配。

箭头功能

箭头函数允许编写更短的函数。与常规函数相比，这带来了更简洁的函数创建方式。

这是箭头函数的代码片段 -

let codeSnippet = (a, b) => a * b;

常规功能代码片段 -

let codeSnippet = function() {
  return " 哈哈哈哈 ";
}

模板文字

模板文字可以创建更简单、更简洁的方式来将变量和表达式插入字符串。通过使用反引号``` `，可以轻松地使用模板文字。

在模板文字中，可以在字符串中使用单引号和双引号。

let stringbe = 
`哈哈哈哈
哈哈哈哈
哈哈哈哈
哈哈哈哈`;

使用template literals将变量和表达式插入字符串。

let platform = "哈哈哈哈";
let profile = "哈哈哈哈";

let text = `1- ${platfrom},2- ${profile}!`;

输出将是：

1-哈哈哈哈，2-哈哈哈哈！

记住不要忘记使用$将变量和表达式插入到字符串中。

Promise

Promise 用于处理异步任务。用于判断异步操作是否成功完成。

它将处于 3 种可能的状态之一：

• Fulfilled：onFulfilled()将被调用（例如，resolve()被调用）
• Rejected：onRejected()将被调用（例如，reject()被调用）
• 待处理：尚未履行或拒绝

Apromise以挂起状态开始，表示进程尚未完成。如果操作成功，则该过程完成并完成。

将其理解为 - 当使用 Promise 从服务器请求数据时，它将处于待处理状态。当收到想要的数据或数据成功到达时，它将处于已完成状态。如果存在错误，它将处于拒绝状态。

const count = true;

let countValue = new Promise(function (resolve, reject) {
    if (count) {
        resolve("count 是true");
    } else {
        reject(""count 不是true");
    }
});

console.log(countValue);

Promise {<resolved>: ""count 是true"}

解构赋值

解构是 ES6 最流行的特性之一。解构赋值是一个表达式，可以很容易地将数组中的值或对象的属性提取到不同的变量中。

有两种类型的解构赋值表达式

• 数组解构和
• 对象解构。

let fruits = ["Orange", "Banana"];
let [a, b] = fruits;
console.log(a, b);


let person = {name: "Shivani", age: 21};
let {name, age} = person; 
console.log(name, age);

Class

JavaScript 中从来不存在Class。直到最近，开发人员还在使用构造函数来模仿JavaScript 中的面向对象设计模式。

ES6 为 JavaScript 语言引入了类。Es6 类使创建对象的过程更简单。使用继承extends关键字来实现。

这是代码片段 -

class User{   
   constructor(firstName, lastName) { 
      this.firstName = firstName;
      this.lastName = lastName;     
   }  

   getName() {       
     console.log(` ${this.firstName} ${this.lastName}`);    
   } 
}
let obj = new User('王', '哈哈');
obj.getName();

王哈哈

默认参数

ES6 可以在函数的签名中提供默认值。在以前，必须使用ES5运算符。

//ES6
let calculateArea = function(height = 100, width = 50) {  
    // logic
}

//ES5
var calculateArea = function(height, width) {  
   height =  height || 50;
   width = width || 80;
   // logic
}

对象字面量

ES6 为开发人员提供了使用增强的 Object Literals 的功能，这使得创建具有大括号内属性的对象变得更加容易 { }

function getUser(name, platform, year) {
   return {
      name,
      platform,
      year
   }
}
getMobile("哈哈", ""华为", "2022");