卓音暑期培训讨论班（二）正则表达式，JS异步，ES6标准

最新推荐文章于 2021-12-18 17:18:22 发布

不到99斤不改网名

最新推荐文章于 2021-12-18 17:18:22 发布

阅读量165

点赞数 1

分类专栏： javascript基础

本文链接：https://blog.csdn.net/Jamam/article/details/118978665

版权

javascript基础专栏收录该内容

3 篇文章 0 订阅

订阅专栏

文章目录

ES6标准
- - - - var、let和const
正则表达式
JS异步
- - - - 什么是异步
      - Promise对象

ES6标准

JavaScript主要由ECMAScript，BOM，DOM组成。

ECMAScript：语法规则
BOM：浏览器对象模型（使用js去操作浏览器）
DOM：文档对象模型（使用js去操作html）

ES为标准，JS为代码实现

ES6是js的第六个版本，相对于ES5来说，更简单也更严谨

var、let和const

var和let都用于定义变量，但对于域的看法不同,

var只存在两种作用域：全局和局部（函数内），

    var a = 1;
    function foo(){
      var a = 1;
    }//两个a不一样，因为作用域不一样

let只要遇到代码块就算一个作用域

    if(true){
      var a = 1;
      let b = 2;
    }
    console.log("a:",a);//可以打印
    console.log("b:",b);//b is not defined，只作用域if内

用var命名有一个坏处

    for(var i = 1;i<5;i++){
      console.log("i:",i)//1234
    }
    console.log("i:",i)//5,外头的i仍存在，但我们不需要了

用let只要出了代码块变量就被销毁，也更安全。
3.

console.log("a:",a);
var a;//undefined
let a;//报错

const用来定义常量

在程序跑的过程中不可修改

const LOVE_YOU = true;
LOVE_YOU = false;//报错

声明和赋值需要同时完成

const LOVE_YOU；//报错

const不但可以指定简单值，也可指定为对象

let user = {
  name:'黄哈哈',
  age:'20'
}
const LOVE_YOU = user;
console.log("user:",user);
user.age = 12;
console.log("user:",user)//不报错
LOVE_YOU = {};//报错

即const指向的是对象的指针，指向内容的位置，而不是指向内容
其他const和let一样，作用域都为块级作用域

ES6的其他属性

正则表达式

什么是正则表达式

正则表达式是用于匹配字符串中字符组合的模式。

正则表达式的用法

  <input type="password" name="" id="pwd" placeholder="请输入6位数字密码">
  <button onclick="usernameCheck()">确认</button>

    function usernameCheck(){
      let reg = /[0-9]{6}/;
      let pwd = document.getElementById("pwd").value;
      console.log(pwd)
      if(!/^\d{6}$/g.test(pwd)){
        console.log(pwd)
        console.log("密码格式不正确")
      }
    }

创建正则表达式

使用正则表达式字面量，有包含在两个斜杠之间的模式组成，
该方法在JS加载后编译该字面量，当正则表达式不改变时，可以获得更好的性能。

let reg = /ab+c/;

调用RegExp对象的构造函数，
该方法在JS运行过程中编译该构造函数创建的正则表达式，当表达式将会改变时（比如根据用户输入来源动态产生不同的模式），需要用到该方法。

let reg = new RegExp("ab+c");

编写一个正则表达式

正则表达式测试网站

使用简单模式

let reg = /abc/;//匹配字符串abc

使用特殊字符

let reg = /ab*c/;//*表示出现0次或多次，比如abc,ac,abbc等字符串会被匹配

一些常用的特殊字符

符号	含义	举例	会匹配	不匹配
^	匹配输入的开始	/^A/	ABC	CBC
$	匹配输入的结束	/B$	AB	ABC
*	该字符出现0次或多次（有或没有）	/ab*c/	abc,ac,abbbbbc	abcp
+	该字符出现1次或多次（至少1次）	ab+c	abc,abbbc	ac
?	该字符出现0或1次	ab?c	ab,abc	abbbbc
.	除断行外的任意字符
[ ]	字符集合,出现的任意一个字符	[a-z]
{ a,b }	指定重复次数为a~b次	{a}重复a次，{a,}至少a次
（）	分组匹配
\w	数字、大小写字母和下划线
\W	除数字、大小写字母和下划线的所有字符
\d	数字
\D	除\d的其他字符
\s	空白字符：空格、制表符、断行
\S	除空白字符

使用一个正则表达式

在这里插入图片描述

JS异步

什么是异步

同步模式的简单例子

const btn = document.querySelector('button');
btn.addEventListener('click', () => {
  alert('You clicked me!');

  let pElem = document.createElement('p');
  pElem.textContent = 'This is a newly-added paragraph.';
  document.body.appendChild(pElem);
});

在这个块中，这些行被一个接一个地执行：

我们获取对 DOM 中已经可用的元素的引用。
我们向其添加一个click事件侦听器，以便在单击按钮时：
1. alert()出现一条消息。
2. 一旦警报解除，我们就创建一个
  元素。
3. 然后我们给它一些文本内容。
4. 最后，我们将段落附加到文档正文中。

异步模式前一个任务结束后不等待后一个任务，而是执行回调函数，程序执行顺序和任务的排列顺序不一致。即从主线程发射一个子线程来完成任务。
在这里插入图片描述

js异步编程主要有4中方法：回调函数，事件监听，发布/订阅，Promise对象
JS异步的4种实现方法

Promise对象

Promise 对象用于表示一个异步操作的最终完成 (或失败)及其结果值。

一个 Promise 必然处于以下几种状态之一：

待定（pending）: 初始状态，既没有被兑现，也没有被拒绝。
已兑现（fulfilled）: 意味着操作成功完成。
已拒绝（rejected）: 意味着操作失败。

let myFirstPromise = new Promise(function(resolve, reject){
    //当异步代码执行成功时，我们才会调用resolve(...), 当异步代码失败时就会调用reject(...)
    //在本例中，我们使用setTimeout(...)来模拟异步代码，实际编码时可能是XHR请求或是HTML5的一些API方法.
    setTimeout(function(){
        resolve("成功!"); //代码正常执行！
    }, 250);
});

myFirstPromise.then(function(successMessage){
    //successMessage的值是上面调用resolve(...)方法传入的值.
    //successMessage参数不一定非要是字符串类型，这里只是举个例子
    console.log("Yay! " + successMessage);
});