简单罗列es6中常用的小demo

### 变量相关的
let
const

1. 都不可以重复声明
2. 都有块级作用域

const必须在声明的时候赋值
const声明的变量不能被修改值

### 对象相关的
1. 对象的简写
```js
var name = "王XX";

var obj = {
name: name
}
// 简写如下
var obj = {
name
}

var obj = {
sayHello: function(){

}
}

// 简写如下
var obj = {
sayHello(){

}
}
```

### 解构赋值
```js
// 1. 对象的解构
var obj = {
name: "",
age: 18
}
// 可以自动将对对象中指定的属性的值赋值给一个新的变量
var {对象的属性名: 要声明的变量名, 对象的属性名: 要声明的变量名, }
var {name, age} = obj;

// 2. 数组的解构
var arr = [1, 2, 3]
var [num1, num2, num3] = arr;
var [,,num3] = arr;
```

### 剩余元素
1. 只能有一个
2. 必须是最后一个
```js
var arr = [1, 2, 3]
var [num1, ...num2] = arr;
// num2 获取到的就是剩余的元素 2,3组成的数组
```

### 剩余参数
```js
// 在函数的参数列表中可以使用剩余参数来获取传入的实参
// 1. 只能有一个
// 2. 必须是最后一个
// 3. 剩余参数是一个真数组!

function test(a, ...b){

}

test(1, 2, 3, 4, 5)
```

### 箭头函数
```js
var func = (参数) => {
// 函数体
}
// 1. 如果只有一个参数则()省略
// 2. 如果函数体只有一句代码则{}省略
// 3. 如果函数体只有一句代码并且是个返回语句则{}和return都可省略
```

#### 箭头函数中没有this
在箭头函数中访问this的时候会沿着作用域链向上进行查找
使用场景: var that = this; 的情况都可以使用箭头函数来解决

#### 箭头函数中没有arguments
如果要在箭头函数中使用不定个数的参数,则直接用剩余参数

### 对象扩展运算符...
```js
var p = {
name: "",
age: 18
}

var s = {...p, 自己的属性}
```

### 数组的拆解...
```js
function sum(a, b, c){}
var arr = [1, 2, 3];
sum(...arr)
```

### class
```js
class 类名{
constructor(){
// 给实例添加属性
}

// 给实例添加方法,方法会被添加到原型中
sayHello(){}

// 给构造函数添加静态方法
static 方法名(){}
}
```

实现继承
```js
class Person(){
constructor(name, age){
this.name = name;
this.age = age;
}
sayHello(){}
static sayHi(){}
}

class Student extends Person{
constructor(name, age){
super(name, age)
// 写自己的属性
this.属性名 = ""
}

}

var stu = new Studnet("", 18)
```

### 模板字符串
```js
var name = "王XX"
var age = 45
var str = `我叫${name},
我今年${age}岁`
```

### Promise
Promise是用来解决回调地狱问题。

#### 使用别人提供的promise的api
只要别人说支持promise,那我们就知道可以使用.then方法了

#### 自己封装Promise的api
```js
function timeout(time){
return new Promise(function(resolve, reject){
setTimeout(function(){
// 只需要改变promise的状态即可
resovle(123);
}, time)
})
}

timeout(1000).then(function(){

})
```

.then方法可以传递两个参数,一个是成功的回调一个是失败的回调

.then方法可以连写,但是连写的时候一定要在上一个.then方法中返回一个新的promise对象

Promise.all 在所有的promise都成功之后,可以进行某些操作
Promise.race 在第一个的promise成功之后,可以进行某些操作

原文地址:https://www.cnblogs.com/why210/p/9728615.html

时间: 2024-10-08 04:35:31

简单罗列es6中常用的小demo的相关文章

android中常用的小控件------Widgets的使用

好久没有写博客了,都不知博客怎么写了,最近突然想写博客,以帮助更多的人,却又不知道写什么好呢? 好吧  我承认我有点懒惰了,可是程序猿是不应该懒惰的哦,俺要做个好孩子. 好了言归正传,开始介绍下今天的主要内容吧! Widgets一个桌面的小控件    个人认为是很常用的,不知道大神们是不是这么觉得的呢?比如说你开发的一款音乐播放器的软件,可把基本的上一曲和下一曲.暂停的几个功能放在这个小控件里面将它显示在桌面上来,这样就很方便啦,你想要下一曲.上一曲.暂停播放的时候,就不用再打开播放器了,而是直

简单了解Spring中常用工具类_java - JAVA

文章来源:嗨学网 敏而好学论坛www.piaodoo.com 欢迎大家相互学习 文件资源操作 Spring 定义了一个 org.springframework.core.io.Resource 接口,Resource 接口是为了统一各种类型不同的资源而定义的,Spring 提供了若干 Resource 接口的实现类,这些实现类可以轻松地加载不同类型的底层资源,并提供了获取文件名.URL 地址以及资源内容的操作方法 访问文件资源 * 通过 FileSystemResource 以文件系统绝对路径的

一个基于ES6+webpack的vue小demo

上一篇文章<一个基于ES5的vue小demo>我们讲了如何用ES5,vue-router做一个小demo,接下来我们来把它变成基于ES6+webpack的demo. 一.环境搭建及代码转换 我们先搭建一下vue 的开发环境,根据我的一篇随笔<Vue开发环境搭建及热更新>,我们一步步搭建开发环境,project名为ES6-demo. 在之前我发表的一篇随笔< 理解最基本的Vue项目>中,说到了在放置组件和入口文件的src文件夹中,main.js文件就是入口文件,App.v

ES6中常用的几个新特性

ECMAScript 6(ES6) 目前基本成为业界标准,它的普及速度比 ES5 要快很多,主要原因是现代浏览器对 ES6 的支持相当迅速,尤其是 Chrome 和 Firefox 浏览器,已经支持 ES6 中绝大多数的特性. 1.const和let ES6推荐使用let声明局部变量,相比之前的var(无论声明在何处,都会被视为声明在函数的最顶部) let和var声明的区别: var x = '全局变量';{ let x = '局部变量'; console.log(x); // 局部变量}con

分享一些js中常用的小知识点

上一篇被退回了,不过没关系.接着分享 主要是几个常用的js知识点.因为之前说过js基础很差. 1:获取class中的input值 结果显示为 用的是jquery的写法.这里一起区分了一下jquery DON操作中的获取内容的三个方法. text()      html()      val() 先说一下val ()   目前遇到的只用于获取表单字段的值 text()和html()用的比较多,因为比如在动态页面的拼接中会用到,或者获取你选择的元素的文本内容,但是html()会返回连同html标记在

JS开发中常用的小技巧

1.获取指定范围内的随机数 function getRadomNum(min,max){ return Math.floor(Math.random() * (max - min + 1)) + min; } 2.随机获取数组中的元素 function getRadomFromArr(arr){ return arr[Math.floor(Math.random()*arr.length)]; } 3.生成从0到指定值的数字数组 function getArray(len) { var arr

html、css中常用的小知识记录

好多东西过一段时间不用就忘记了,为此写了这篇文章,用来记录每次想不起来的小知识! 1.鼠标停留显示提示,使用title .如:title

搭建简单的LAMP中出现的小问题

当运行程序的时候发现出现这样的字符:httpd: Could not reliably determine the server's fully qualified domain name, using www.shifanyong.cn for ServerName  但是服务还是可以启动.重启.停止的情况  因为/etc/local/httpd/conf/httpd.conf(安装目录,不一定是这个)中,ServerName这个项是注释项,可以选择去掉#号,修改后面的域名,也可以在下面添加一

powershell分享5--AD中常用的小语句

一.通过powershell批量创建邮箱 Set-Location C:\Users\fanyx_v\Desktop\ Import-Module ActiveDirectoryAdd-PSSnapin Microsoft.Exchange*Add-PSSnapin Microsoft.Exchange.Management.PowerShell.SnapIn$ADUser=Import-Csv -Path .\NewUser.csv -UseCulture -Encoding Defaultf