&js常识笔记

学习笔记

• 查询文档 https://developer.mozilla.org/zh-CN/
• 博客 http://www.cnblogs.com/pandawind/p/9829898.html
• js笔记 https://duyiedu.github.io/
  1、js是解释性语言也是单线程，其实js引擎是单线程，同步(只做一件事)
  2、link和script标签是异步加载(同时进行)
  3、js分为ECMAscript(基础语法)、DOM(文档对象模型)、BOM(浏览器)
  4、js执行队列，轮转时间片：类似吃饭，吃一口这个，再吃一口那个
  5、变量var a = 1；----> var a; a=1
  6、if、function、for后面不用加分号
  7、错误
• 低级错误（语法解析错误）
  js语法错误会引发后续代码终止，但不会影响其他js代码块
• 逻辑错误（标准错误，情有可原）

8、任何数据类型加字符串都是字符串，加number会将其隐式转换成数字相加
9、var a = 1;var b = a-- + --a; ++在后先运算在++，++在前先++在运算

image.png

   var a = 0;
   console.log(a++);  // 0  ++在后运行完在
   console.log(a); // 1

//-----------
var a = 2;
var b = a-- + --a + ++a ;
// a--   2   1
// --a   1-1 0
// ++a   0+1 1
console.log(b); //3
console.log(a);//1

10、但凡运算就要求出结果

var a = 1 > 2;  console.log(a)  false
var b = 1 && 2; console.log(b) 2

11、undefined、null、NaN、""、0、false,都为假
12、type undefined 为字符串 undefined
13、2 > 1 && document.write('如果2大于1，就打印出write')
14、for循环，控制循环圈数和i的变化

image.png

15、编程就是找规律
16、break必须放在循环里面
17、js即面向过程也面向对象
18、typeof 返回6个值

string、number、boolean、undefined、function、object

19、parsetInt(参数，以目标进制(2-36)为基地转为10进制)转整形

parseInt(3,8) //把3当做8进制的数转换为10进制

20、想把谁转换为字符串，就 点toString()，undefined和null不可以使用，tostring里面有个参数是以10进制为基地转换为目标进制

image.png

21、类型转换前，先进行隐式类型转换

var a = "123";-----a ++ -----Number(123) ----123  

22、当+号两侧有一个是字符串的话，就会转换字符串
23、隐式类型中undefined和null不能和其他值比较
24、未定义的变量放在typeof里面不会报错，还会返回字符串的undefined，除此之外都会报错XX not is undefinde
25、函数的作用——避免重复定义，相同功能放一起（高内聚、低耦合）

函数定义（函数里面也分为堆内存和栈内存）
1、函数声明 function name(){}
2、命名函数表达式(忽略name1的名字) var name = function name1(){}充当表达式之后，就变成匿名的了 name.name = name1
3、匿名函数表达式(函数表达式) var demo = function() {} demo.name = demo
4、每个函数里面都有放参数的地方argument内数组(实参列表)，它和形参有套隐射规则(只有参数相等的时候)，你变我也变，注意一点实参有几个实参列表就有几个，不会和形参行程关联
5、函数必须有个return才结束(终止函数)，我们没有写的时候，系统会自己加return,所以有时打印的函数是undefined
6、函数调用等他执行完返回结果，才算完事

image.png

递归

1、找规律（return公式 n = n * (n-1) ,才会循环计算）
2、找出口
阶乘就是利用自身的功能，求出结果，函数调用等他执行完返回结果，才算完事

image.png
image.png

3、递归唯一一点让代码变得更加简洁，但是递归的运算很慢需要等最底层1的结果出来，慢慢往上返，最后才能算出5的阶乘
4、斐波那列数列的公式就是n-1 + n-2 的和

image.png
image.png
image.png
5、递归中先执行的函数最后才有结果

闭包、作用域

预编译

1、预编译之前语法分析、预编译、解释执行
2、函数声明整体提升，变量 声明提升
3、预编译过程（发生在函数执行的前一刻）

• 创建AO对象

• 找形参和变量声明，将变量和形参作为AO属性名，值为undefinde

  
  image.png

• 将实参值和形参统一

  
  image.png

• 在函数体里面找函数声明，值赋予函数体，如有遇到相同属相名，忽略不计，将函数体赋值即可

  
  image.png
  

  4、预编译结束后，函数开始执行，在预编译过程中，函数声明已被提前，所以不用再看，变量也忽略
  5、任何全局变量就是window上的属性，未经声明的变量也归window所有
  6、函数在预编译时，不管(走)if，if里面有啥都会拿出来

  
  image.png
  7、if里面不能声明function

作用域

image.png
image.png

1、作用域属于函数，每个函数产生独有的作用域
2、函数每执行一次，便产生一个AO，执行完函数销毁，进入等待队列
3、a被定义时，产生一个GO

image.png
image.png

4、a执行时，产生自己的aAO,将它放在作用域的最顶端

image.png
image.png
5、b函数创建时，是基于a函数基础上的，拿的是a函数的引用
image.png
6、b函数执行时，在aAO基础上生成自己的执行期上下文，放在最顶端
image.png

7、a的执行产生b的定义，相关数据在doing里，a重新执行时，将产生新的b定义，

image.png
8、闭包，但凡是内部的函数被保存到外部，一定生成闭包（a执行产生b的定义）
image.png image.png

闭包

过多的占用系统资源叫做内存泄露

image.png

1、闭包，但凡是内部的函数被保存到外部，一定生成闭包（a执行产生b定义）

image.png

2、b执行完改变num，自身销毁，但是b会在定义时的数据不会销毁，num是在b身上aAo里，再次执行时，还是建立aAo上

image.png
image.png
3、a销毁的时候b还没执行，b还拿着a的上下文，被保存到外部
image.png

4、闭包缺点，造成内存泄露(泄露的多了，就剩的少了，和沙子一样)

image.png
5、闭包的作用
image.png
6、返回两个闭包，公用的都是父级的变量
image.png
7、demo food 储存结构
image.png
image.png
7-1、变量私有化，外部访问不了

7-2、命名空间，防止变量污染
8、函数定义时不用管，执行时才看如何操作的

image.png
9、a执行产生了b定义，b具用了a的劳动成成果，a、b用的同一个引用，a执行完销毁时，引用之间的联系就没了
image.png
10、b被保存在全局的变量demo里，脱离了a，当a执行完销毁时，b还存在，他拿着a的引用
image.png
11、函数执行完，一直是等待状态，等着下次执行，占用空间，立即执行函数执行完便销毁

立即执行函数（函数执行完立即销毁，在执行队列任务里也查不到它）

image.png

1、初始化函数，只执行一次，返回其结果

image.png

2、能被执行的表达式，函数名称会被忽略，能被执行符号执行的表达式，就是立即执行函数

var test = function(){
console.log('this is test')
}
console.log(test)  // undefined  执行完后被销毁
//这样也是表达式，而且可以忽略函数的名字
+ function(){
console.log("a")
}()

image.png

3、坑

// 这样会报错
function(){
console.log()
}()
// 有参数就不会报错，系统会默认换行
function(a,b){
console.log(a+b)
}(1,2)

4、只有表达式才能被执行，一旦表达式执行，便失去对原来函数的索引(一次性的)
5、立即执行函数也有作用域
6、利用闭包解决闭包

image.png
image.png

27、只要if里面不为那6个假值，都为真

image.png

28、this是第一人称我，谁调方法用this，this就指向谁
29、增删改查

delete obj.name  // 删除

对象

1、对象的创建方法

• 字面量 var obj = { }
• 构造函数

1、系统自带构造函数 var obj = new Object()；new Object()可以产生一个对象
2、自定义(工厂模式)，命名方式为首字母大写，加个new 就可以返回对象了

• 构造函数内部原理

1、在函数体最前面隐式的加上this = {}
2、执行this.xxx = xxx
3、隐式的返回this

image.png

4、模拟构造函数

image.png
5、有new 返回对象，不可以返回原始值

包装类

1、原始值没有属性和方法
2、构造函数的原始值具有属性和方法

// 这样通过new的原始值具有属性和方法，但是num经过运算后，又变成了最初的原始值
var num = new Number(123)   
var str = new String("abcd")

3、原始值是没有属性和方法的，之所以可以用 点length，是因为有包装类（执行的过程中，产生隐式的转换就是包装类）

var num = 123；
// 新建new Number(123).len 来弥补操作的不足
num.len = 3     // 这一步发生了隐式的转化new Number(123).len = 3 执行完这个后系统会delete（因为原始值没有属性）
console.log(num.len)  //会在此新建new Number(123).len,此时打印是undefined

4、number没有length，string调用length，要经过包装类的
5、坑

image.png

原型

image.png

1、原型描述的就是继承关系

image.png

2、constructor返回他的构造函数，构造函数自身带有constructor，可以进行手动更改，指向其他的构造函数
3、__ proto__里面放的是原型prototype，虽然是系统内部属性，但可以进行更改，和constructor一样

• person不是构造函数，所以没有prototype,但他有__ proto__,指向Person.prototype

    Person.prototype = {
            thgf:11.2,
            bldc:13.2
        };
        function Person(name,age){
            this.name = name;
            this.age = age;
        }
        var person  = new Person();
        // person不是构造函数，所以没有prototype,但他有__ proto__,指向Person.prototype
        console.log(person1.__proto__)

4、剖析__ proto__，在new 构造函数时，系统自动创建一个this对象，每个对象都有proto指向构造函数的原型prototype

image.png

5、 改变了person的原型

    Person.prototype = {
            thgf:11.2,
            bldc:13.2
        };
        function Person(name,age){
            this.name = name;
            this.age = age;
        }

        var obj = {
            one:'1'
        }
        var person  = new Person();
    // 改变了person的原型
        person.__proto__ = obj;
        console.log(person)

6、原型赋值的坑，点的写法是在原有的基础上更改或赋值， = 的写法相当于开辟另一个空间

image.png
image.png
image.png

7、原型prototype也有隐式原型__proto __，原型上有原型形成的链就是原型链，原型链的连接点就是proto，原型链的最终原型是Object.prototype，它没有proto，和作用域链一样，自己有就使用自己的，自己没有就向上一直找
8、this指向问题

    function Person(){
        // var this =  {
        //  __proto__: Person.prototype
        // }
        this.eat = function(){
            // this.height = this.height +1
            this.height ++
        }
    }
    Person.prototype.height = 100;
    var person = new Person();
    person.eat()
    console.log(person.__proto__) // 100  --->Person.prototype.height = 100
    console.log(person.height)  // 101 -->person调用了eat方法 this.height = 100 +1

9、字面量方法和new Object相等

image.png

10、构造函数的prototype指向Object.prototype，绝大多数对象最终都会继承Object.prototype，还有小部分是受Object.create影响,如果create(null)，就是去了系统内部属性

image.png
11、object.create(原型，这里面参数必填，当为null时，原型上就没有内置的属性和方法),改变对象原型或者是给某个对象创建原型

        var obj = {name:"jialin",age:25}
        // 这里就改变了obj1的__proto__（原型）指向obj
        var obj1 = Object.create(obj);

          function Person(){
            
            }
        Person.prototype.name = "jialin"
        // 改变obj的proto
        var obj = Object.create(Person.prototype)
        console.log(obj)

12、undefined、null、Object.create(null)，三者没有包装类，没有toString方法
13、toString()

var obj = {}
obj.toString()   //  [Object Object]

14、同一名字不同功能的方法toString，叫重写

image.png
image.png

15、document.write就利用了toString方法

image.png
16、关于取整
image.png

call、apple改变this指向，传参列表不同

image.png

1、让Person里面所有的this都指向obj

  function Person(){
    this.name = "jialin";
    this.age = 20
  }
  var obj = {}
  // 让Person里面的this指向obj
  Person.call(obj)
  console.log(obj.name)

2、借用Person的方法实现obj的功能

image.png

3、谁调用this指向谁

image.png
4、apply要传数组
image.png

继承

原型是实现继承的一种方法

image.png

1、公有原型，一个原型，两个构造函数使用

image.png
2、不是让对象继承，而是让某个构造函数继承
image.png

3、有自己的继承，又不影响你，找一个中间层（圣杯模式）

image.png
image.png
image.png
4、圣杯模式
image.png
5、雅虎的（行成闭包，f是私有化变量）
image.png
6、命名空间

7、闭包变量私有化，不会污染全局变量

image.png

对象枚举

1、变量拼接属性名
会转换为obj['name']

image.png
image.png

2、hasOwnProerty 验证是否是自己的方法

image.png
3、instanceof
a是不是 b构造函数构造出来的
image.png
4、判断是数组还是对象

• instanceof
• constructor

• toString()

  
  image.png
  image.png

this

image.png

1、预编译函数声明、变量提升

image.png

2、预编译this指向window

image.png
3、如果test 使用 new的话，this指向就改变了
image.png
4、在其他函数里面执行，没人调用也是走预编译环节
image.png

5、new的时候this发生改变

image.png
image.png

argument

1、arguments.callee 指向当前函数的引用，引用就是函数自己

image.png

2、fun.caller 不是arguments的属性，它是函数自己的属性，demo在那个环境被调用的环境

image.png

深度克隆

image.png
image.png
image.png

• 封装typeof

数组常用方法

1、数组所有的方法来自Array.prototype
2、长度为10的空数组，new Array(10)
3、改变原数组push、pop、shift、unshift、sort、reverse、splice

• push 给数组最后一位添加

  
  image.png

• unshift 给数组前一位添加

• splice(从第几位开始，截取多少的长度，在切口处添加新的数据随便添加)，负数就是倒数，返回值就是截取的，没有返回值原数组发生改变

  
  image.png

• sort 排序，是按照asic码算的，想要实现我们自己的效果，它内部提供一个借口让我们自己写方法实现
  sort排序的原理是冒泡排序

// 记着，位置和位置比较，不是数和数比较
    var arr = [1,22,4,5,6,9,7,8,36,7]
        // 1.必须写两形参
        // 2.看返回值：当返回值为负数时，那么前面的数放在前面
                   // 当返回值为整数时，后面的数在前
                   // 为0则不动

            // 步骤：1.第一次将 第一位和第二位传进来，进行比较1,22；1,4；1,5
    var b  = arr.sort(function(a,b){
                return a - b;
        })
    console.log(b)

记着，位置和位置比较，不是数和数比较，位置和位置比较后，会将最小的数放在前面

image.png

a > b 可以理解为 a - b > 0

image.png

将有序数组打乱，利用Math.random()随机数，0—1开区间(不包括0和1)

image.png
思维拓展
image.png
image.png

按照字节长度来排

image.png

编程就是将想法抽象，一步一步试错，程序化思维

4、不改变原数组concat、join———split、toString、slice

• slice(从该位开始截取，截取到该位)

• join(参数是字符串，将数组以参数分割返回字符串，不传是，)

  
  image.png

类数组

image.png

1、在对象上增加数组push方法，形成类似组，具有数组的形式，类似数组

image.png
image.png

2、是对象可以当做数组使用

image.png
3、隐式的push方法
image.png
4、思维拓展 关键点在于length
image.png

DOM操作全是类数组的形式

复习

1、包装类

// 原始值没有属性和方法，之所以具有属性的原因是经过了包装类new
var str = "abc";
console.log(str.length)   // 3
// 在这个过程中会new String("abc") 这个构造函数上有 点length的属性
// 这个隐式的过程就是包装类，new String(str) 将str隐式的包裹起来

image.png

2、原型

• 任何一个函数都有prototype,这个prototype是这个函数构造出对象的公有祖先，祖先上的方法和属性，由这个构造函数构造出的对象都可以使用

  
  image.png
  

  3、Object.create(prototupe,特性)创建对象
  没有lastName，就去它的父级上寻找

  
  image.png
  image.png
  4、this call

• call可以改变函数里this的指向

  
  image.png

• call里面写值的话，就是函数运行时this指向的环境

  
  image.png
  image.png
  image.png

• new的时候，this指向是构造函数原型

  
  image.png
  image.png
• 闭包的表现就是函数套函数，将被套的函数弄到外面执行，必然形成闭包

• 通过构造函数生产对象，每次都new一下，执行函数就不用new

  
  image.png
  

  5、闭包生成的私有变量，不想让别人进行访问

  
  image.png

• 空数组不等于空数组，每个引用值都有独立的地址，虽然长的一样，但是地址不同

  
  image.png
  

  6、深度克隆

• 浅层克隆是将obj遍历一遍，将其属性放到obj1上，obj的引用值改变obj1也会改变(因为是同一地址或者引用)，这不是想要的，由此得深度克隆

  
  image.png

1、深度克隆主要处理引用值，首先分析是不是引用值
2、如果是对象，就新建一个，再去处理原有对象里面是什么值，原始值直接使用(相当于备份)，引用值在进行判断，因为操作一样就形成了递归

image.png

3、这样之间的对象是相互独立的

image.png

7、系统规定的undefined和null不能进行隐式类型转换，不能和数字比较，但他两都是false
8、预编译 ，发生在函数执行前

1、生成Ao
2、找函数里面的形参(相当于变量声明，和变量重名时，取一个即可，对象里面不可能有相同属性名)和变量声明，把他们当做AO的属性名并赋值undefined
3、实参形参相统一，将实参值赋给形参
4、找函数声明，将函数声明的名字，作为AO对象的属性名，如果有相同的直接进行覆盖，值为函数体
5、函数执行所访问的变量、修改都是用AO对象里的值
6、接着开始看参数都具有什么值，遇到var 声明和函数声明直接跳过，他们在预编译时已执行

9、凡是var 变量，都删除不了

image.png

10、最经典的继承就是圣杯模式

11、优化代码

image.png

类和构造函数相似

try catch 捕获异常

1、在try里面发生的错误，不会执行错误后的try里面的代码

image.png
image.png

2、错误类型

image.png

严格模式

• "use strict"

  
  image.png

• while 可以改变作用域链，使程序执行效率降低，在es5中不支持

  
  image.png
• 严格模式下的局部this直接打印为undefined，也就是预编译的过程中this不指向window

• eval('这里面能将字符传当做代码执行')可以改变作用域

  
  image.png

DOM

image.png

1、DOM不能直接操作css，可以同过间接样式，行内样式
2、反转

image.png

3、选项卡

image.png
4、运动
image.png
5、键盘操作
image.png

6、滑动变色

image.png

DOM基本操作（一系列方法的集合）

1、方法操作

image.png
image.png

• getElementsByTagName 选择标签名，是个类数组，既能当对象使用，又能到数组使用
• getElementsByClassName 选择class名，兼容性不好，ie9以下不支持
• querySelectAll 唯一缺点选择的元素不是实时的，动态添加的数据获取不了

2、节点操作
节点操作没有节操，什么都可操作，无兼容问题，元素节点会有兼容问题

image.png

3、节点属性

image.png

4、节点类型nodeType

image.png

让他更像数组，加个splice

image.png

DOM结构树

image.png
image.png

1、document的构造函数HTMLDocument

image.png image.png

2、封装函数，返回元素e的第n层祖先元素节点

image.png

3、封装chileren方法

image.png
4、返回元素e的第n个元素节点

• 为正一种循环，为负一种循环

• 还有一种先循环，在判断

  
  image.png

image.png

• 思维开拓

  
  image.png

DOM增删改查

image.png

1、document.createElement

image.png

2、给每个标签设置属性

image.png
image.png
3、插入元素
image.png

日期对象

1、求程序运行的时间 getTime时间戳

image.png

2、倒计时可以使用setTime

image.png
3、定时器里面的事件不可更改

• 高性能js
• 你不知道的js

• DOM操作艺术
  4、setInterval 会返回数字唯一标识，clear清除的就是所记录的数字
  5、清除

  
  image.png

操作滚动条

image.png

1、横向滚动条距离

image.png

• ie9以下 document.body.scorllLeft/document.documentElement.scorllLeft 这两个比较混乱，处理时用+

• ie9以上 window.pageXOffset
  2、封装的方法

  
  image.png

3、滚动条滚了400像素，求浏览器顶端到滚动条滚动的位置400px+首屏像素，滚动条滚动的距离就是多摞出来的 或者是 滚动条滚动了400px，此时屏幕的底端距离网页的最顶端的距离 就是400px+首屏

可视区域

image.png

• 怪异模式向后兼容，一旦启动(去掉!document html)就不是最新的语法

  
  image.png
  

  1、方法的封装

  
  image.png

查看几何尺寸

image.png

优先（距离有定位的父级）

image.png

1、求文档相对相对于定位的坐标

滚动条滚动

image.png

• scrollBy 累加滚动距离
• 自动阅读器

这样写有个bug 就是多次点击start时，会不断触发点击事件

image.png

• 解决方案

加个开关解决

image.png

脚本化css

image.png
image.png

这里的null获取的是伪元素的值

image.png image.png

封装方法getStyle()

image.png
image.png

事件(交互体验的核心功能)

1、事件处理函数

image.png
image.png

2、运行环境

image.png
image.png
封装地方法
image.png

3、解除事件处理函数

image.png
image.png
4、事件处理模型
image.png
5、取消冒泡和默认事件
image.png
image.png
image.png
6、事件对象
image.png

7、事件委托

image.png
8、事件分类
image.png
9、事件分类
image.png

• mousedown + mouseup =click
  区分click 和 mousedown

  
  image.png
  

  10、键盘事件

  
  image.png
  image.png
• keydown 可以监听到所有键盘事件，监听字符按键不准，操作类按键

• keypress 只能监听到字符（就是aisc码里面对应的）按键

  
  image.png
  

  11、文本类

  
  image.png

• input事件相当于v-model

  
  image.png
  

  12、窗口

  
  image.png
• domTree(先解析img标签，之后异步下载图片) + cssTree = renderTree，先看完domTree，在看cssTree，深度（纵向，看一条枝干）优先
• domTree数的完成代表着解析完成，比不是加载完成

• domTree一旦改变，renderTree需要重新构建（效率比较低）

  
  image.png

• 重绘影响比较小，改变的是css

  
  image.png

• 等到所有图片、资源下载完成onload才执行

拖拽

1、left不给值的话是auto，默认给个0
2、e.pageX和e.pageY是鼠标位置
3、鼠标按下在执行鼠标移动事件

image.png

4、鼠标抬起取消事件

image.png
5、因为left和top的位置是盒子的左上角，所以需要重新计算
image.png
image.png
6、鼠标每秒可以移动一百次但是对我们对事件的监听达不到一百次，鼠标移出盒子外面是监听不到的，所以绑定在docuemnt上
image.png
image.png

json 是对象

image.png

1、转换

image.png

2、字符串json

image.png

异步加载

image.png image.png

• 发生在页面解析完时

  
  image.png

• 加载完执行

  
  image.png

• 创建script

  
  image.png
  image.png

• 状态码已经完成

  
  image.png
  image.png

• 回调函数执行后才执行test

  
  image.png
  image.png

时间线

• document.write() 具有消除文档流的操作

  
  image.png
  

  1、创建docuement对象(1)
  2、文档解析完成(2,3,4,5)
  3、文档解析完并且加载完毕(6-10)

• 触发三个状态

  
  image.png
  image.png

正则表达式

1、\转义成文本
2、\n回车
3、\t table

image.png

4、正则处理字符串

image.png
5、\abc\ 定义规则，red.test(str)意思是正则测验下字符串里面含不含有我规定的片段
6、正则里面的加i忽视大小写，加g是全局，加m是多行匹配
7、match和test是相反的，test是正则的属性返回true&false，math是字符串的属性str.match(reg),返回值是个数组
image.png

8、[]方括号是表达式，代表一位(或者是一个范围)，一个表示式就是一位，里面是区间，比如cd，就是c到d，^放在中括号里面代表非，其他地方代表以什么什么开头
9、解析

• 第一位不是a的匹配2位
• 第二位不是b的匹配2位

image.png

10、元字符

• w

  
  image.png

• d

  
  image.png

• s

  
  image.png
  image.png
  image.png

• b

  
  image.png

• t

  
  image.png

• 量词 n*量词

  
  image.png

• 贪婪原则（能匹配多就不匹配少）

  
  image.png

• 光标也可以匹配

  
  image.png

• 区间匹配

  
  image.png
  image.png

• 实际结果必须是abc才行

  
  image.png

• 写一个正则，首尾是否含有数字

  
  image.png
  image.png

• reg.exec()

  
  image.png

• lastindex就是游标

• (会记录括号里面的内容)子表达式，\1反向引用，引用第一个子表达式里面的内容

  
  image.png
  

  匹配第一个子表达式里面匹配的内容，

  
  image.png

• \2反向引用第二个子表达式

  
  image.png

• 支持正则的string方法

  
  image.png

search 但凡不返回的-1都是匹配成功，返回匹配到的位置
split 里面可以写正则，以什么什么分割
replace(老参数，新参数) ，没有匹配全局的能力，replace(正则，“新参数”)

image.png

可以放方法，第一个参数值正则匹配的结果，第二个是第一个子表达式内容，第三个是第二个子表达式内容

image.png
字符串大小写转换toUpperCase()、toLowerCase()
image.png

• 正向预查或者正向断言

  
  image.png

• 非贪婪匹配 能有1个绝不多个，在后面加？

  
  image.png

• 字符串去重

  
  image.png

• 给数字加。
  从后往前查，查3的位数个替换的是空，还不能是单词边界

  
  image.png