【javascript】姬成

1、typeof

判断变量类型，六种返回结果为（这些值全是字符串类型），number，string，boolean，object，undefined，function

2、显式类型转换

• Number(mix)
• parseInt(string,radix)，radix设置一个进制数，指定参数的进制
• parseFloat(string)
• toString(radix)，radix设置一个进制数，对数值进行进制转换
• String(mix)
• Boolean()

3、隐式类型转换

undefined == null，返回结果为true

NaN == NaN，返回false

• isNaN()，隐式Number
• ++/–,+/-(一元正负)，隐式Number
• +，隐式String
• -*/%，隐式Number
• &&||!，Boolean()
• < > <= >=
• == !=

4、绝对不发生类型转换的比较

• ===
• !==

5、预编译

• 在预编译阶段，系统会把函数声明和变量声明提升（自动把声明全部放在使用前面）
• （暗示全局变量）任何变量，如果变量未经声明就赋值，此变量就为全局变量所有
• 一切声明的全局变量，全是window的属性

预编译四部曲：

1. 创建AO（Activation Object）

   • AO{
         
     }
     

2. 找形参和变量声明，将变量和形参名作为AO属性名，值为undefined

   • AO{
         a: undefined,
         b: undefined   
     }
     

3. 将实参值和形参统一

   • AO{
         a: 1,
         b: undefined   
     }
     

4. 在函数体内找函数声明，值赋予函数体

   • AO{
         a: function a(){},
         b: function (){},
         d: function d(){},    
     }
     

function fn(a){
    console.log(a);
    var a = 123;
    console.log(a);
    function a(){}//函数声明
    console.log(a);
    var b = function (){}//函数表达式
    console.log(b);
    function d(){}    
}
fn(1);

打印结果:
ƒ a(){}
123
123
ƒ (){}

总结一点就是：在预编译阶段声明的提升，在声明提升过程中同名的也会被覆盖

同时还要注意函数声明和函数表达式不同

5、函数

• 每一个函数都有一个默认的arguments属性，它接收传递的参数作为数组
  • 改变arguments数组中的值，形参的相应值也跟着变化
  • 改变形参的值，arguments的相应值也变化

6、作用域

[[scope]]：我们所说的作用域，里面存储了运行期上下文的集合。

每个函数都是一个对象，对象中有些属性可以访问，有些不可以。仅供引擎存取，[[scope]]就是一个外界不可访问的

作用域链：运行期上下文的集合所呈现的链式连接称为作用域链

7、闭包

当内部函数被保存到外部时，将会生成闭包。闭包会导致原有作用链不释放，造成内存泄漏

闭包的作用：

• 实现公有变量

  //累加器
  function add(){
      var num = 0;
      function a(){
          console.log(++num);
      }
      return a;
  }
  var myAdd = add()
  myAdd()
  myAdd()
  myAdd()
  
  输出：1 2 3
  

• 可以做缓存（存储结构）

  //类似缓存
  function test(){
      var food = "";
      var obj = {
          eatfoot : function(){
              if(food != ""){
                  console.log('我吃' + food);
                  food = "";
              }else{
                  console.log('没有给我食物');
              }
          },
          pushfood : function(myfood){
              food = myfood;    
          }
      }
  
      return obj;
  }
  var person = test()
  person.pushfood("banana")
  person.eatfoot()
  
  //共用food变量
  

• 可以实现封装，属性私有化

  function Person(name,wife){
      var prepareWife = "张三";//私有化的属性
      this.name = name;
      this.wife = wife;
      this.divorce = function(){
          this.wife = prepareWife;
      }
      this.changePrepareWife = function(target){
          prepareWife = target;
      }
      this.sayPrepareWife = function(){
          console.log(prepareWife)
      }
  }
  var person = new Person("李斯","玛丽");//对象只能通过它的divorce方法，访问私有属性,无法直接访问
  

• 模块化开发，防止污染全局变量

闭包造成的问题：

function test(){
    var arr = [];
    for(var i = 0; i<10; i++){
        arr[i] = function (){
            document.write(i+" ");
        }
    }
    console.log(arr);
    return arr;
}
var myarr = test();
for(var j = 0; j<10; j++){
    myarr[j]();
}
打印10个10
因为arr数组中的每个函数都是`function (){
            document.write(i+" ");
        }`这个i在数组返回时，是没有给值的
        
返回出来这个arr在test函数外部，共享闭包内（test内）的变量，所以可以共享到i的值为10 

要解决这个问题(使用立即执行函数)：
解决思路：里面的函数拿到的数据是立即执行函数的结果，而不是test了，而立即执行函根据循环有多个，所以里面的函数分别在自己的作用域里，互不影响
(function(j){
    arr[i] = function (){
    	document.write(j+" ");
	}
}(i))

8、对象、包装类

• 对象

  var obj = {}

• 包装类

  基本变量增加属性赋值会先执行包装类

  var num = 4;
  num.a = 6
  //隐式 new Number().a = 6,所以赋值后对原始值没影响
  

9、原型、原型链

原型：是function对象的一个属性，它定义了构造函数制造对象的公共祖先，通过构造函数产生的对象，可以继承该原型的属性和方法。原型也是对象

构造方法自带的一个属性prototype

prototype对象中的constructor方法，返回构造器，并且可以手动更改。

new的时候会在构造函数中隐式生成一个this，该this就是创建的对象

原型的增删改查：

• 增，不能在对象中增加，只能在原型中

  Person.prototype.lastName = "a"
  function Person(){
      
  }
  var person = new Person()
  
  person.fine = "b"//添加不到原型，只会给person对象增加自己的fine 属性
  Person.prototype.fine = "b"//可以添加到原型
  
  

• 删，无法删除

• 改，不能在对象中更改，只能在原型中

  Person.prototype.lastName = "a"
  function Person(){
      
  }
  var person = new Person()
  
  person.lastName = "b"//更改不了原型，只会给person对象增加自己的lastName属性
  Person.prototype.lastName = "b"//可以更改原型
  

• 查，对象访问自己没有的属性，就会去原型中寻找

原型链：绝大多数对象最终都会继承自Object prototype

使用Object.create(null)创建的对象没有原型

10、call/apply

• 作用，是改变this的指向

  function Person(name,age){
      this.name = name;
      this.age = age;
  }
  var person = new Person('wang',22);
  var obj = {}
  Person.call(obj,'zhang',88);//obj会使用person的构造函数创建自己
  
  

  //类似于java的调用父类
  function Person(name, age, sex){
      this.name = name;
      this.age = age;
      this.sex = sex;
  }
  function Student(name, age, sex, tel, grade){
      Person.call(this,name,age,sex);//类似与Java的调用父类构造方法
      this.tel = tel;
      this.grade = grade;
  }
  var student = new Student('zhang',34,'男',180,2019);
  

  调用toString方法的call形式Object.prototype.toString.call(obj)

• 区别，后面传的参数形式不一样

  Person.apply(this,[name,age,sex]);
  

​ apply传参得是数组

11、继承

• 原型链的方式

  • 过多的继承了没用的属性

• 借用构造函数（使用call或apply）

  • 不能继承构造函数的原型
  • 每次构造函数都要多走一个函数

• 共享原型，(子.prototype = 父.prototype)

  • 不能随便改动自己的原型

• 圣杯模式

  function inherit(Target,Origin){
      function F(){};
      F.prototype = Origin.proptype;
      Target.protetype = new F();
      Target.prototype.constructor = Target
  }
  

  //优化结构
  var inherit =(function(){
      var F = function(){};
      return function(Target,Origin){
          F.prototype = Origin.proptype;
          Target.protetype = new F();
          Target.prototype.constructor = Target;
          Target.prototype.uber = Origin.proptype;   
      }
  }());
  

12、this

• 函数预编译过程，指向window
• 全局作用域里，window
• call/apply，改变this的指向
• obj.func()，func()里面的this指向obj

13 、callee和caller

• callee

  arguments的属性。使用arguments.callee，代表函数的引用，在递归中，如果函数没有名字可以使用这个来代替引用

• caller

  函数的属性，表示在哪个环境调用了该函数（ES5标准模式不让用）

14 、深度克隆需要的技术

• 判断是不是原始值，使用typeof()
• 判断是数组还是对象，使用instanceof，toString，constructor

15、数组

new Array(10)代表长度为10 的稀疏数组（值为undefined）

而new Array(10, 10)，代表两个元素为10的数组

js中的数组访问越界的值，返回undefined，不会报错

js中的数组在写越界的数组值时，是可以的，会把数组撑开到要写的长度

数组中的方法：

• 改变原数组

  • push，给数组末尾添加一个或多个元素，参数为添加的元素，返回数组的长度

    Array.prototype.push = function(target){
        this[this.length] = target;
        this.length++;
    }
    

  • pop，将数组末尾元素剪切，不用传参数，并返回

  • shift，将数组开头元素剪切，不用传参数，并返回

  • unshift，给数组开头添加一个或多个元素，参数为添加的元素，返回数组的长度

  • sort，排序数组元素，按照ascill码。参数可以提供一个函数，我们可以自定义排序的规则

    • arr.sort(function(a,b){
          if(a>b){
              return 1;//为正时，俩数互换位置
          }else{
              return -1;//为负时，位置不变
          }
      });
      

  • reverse，反向数组元素

  • splice，切片数组元素，参数（从第几位开始（可以为负数），截取多少位，在切口处添加新数据），返回截取值

• 不改变原数组

  • concat，连接两个数组
  • join，根据传递的string类型参数，将数组元素连接起来，并以字符串返回
  • split，这是字符串的方法，以某个字符分割字符串，并以数组返回（和join逆）
  • toString，将数组变成字符串
  • slice，截取数组，参数三种方式（从该位开始，截取到该位），（从该位截取到最后），（）

16、类数组

var obj = {
    "0":'a',
    "1":'b',
    "2":'c',
    "length":3,
    "push":Array.prototype.push,
    "splice":Array.prototype.splice//加上splice属性，打印就和数组一样了
}

类数组条件：

• 属性要为索引（数字）属性
• 必须有length属性
• 最好加上push方法

17 、Error.name值（错误信息）

• EvalError：eval()的使用与定义不一致
• RangeError：：数值越界
• ReferenceError：非法或不能识别的引用数值
• SyntaxError：发生语法解析错误
• TypeError：操作数类型错误
• URIError：URI处理函数使用不当

18、ES5严格模式

es5.0严格模式的启动，在页面顶端添加"use strict"，也可以写在局部

开启后，不在兼容es3.0的一些规则语法，使用全新的es5.0规范

不被支持的语法：

• with
  • with用法，with(obj){}会把obj放在AO对象的最顶端，他会更改作用域链。with内部函数的调用者就是obj
• arguments.callee
• func.caller
• 变量赋值前必须声明（es3中，未声明的变量当作window的属性）
• 局部的this必须被赋值，未赋值为undefined，但在全局还是指向window（es3中，预编译时this是window）
• 拒绝重复属性和参数

19、DOM

定义了表示和修改文档所需的方法。用来操作html和xml的集合

对文档中元素的操作：

• 创建节点
  • createElement()
  • createTextNode()
  • createComment()
  • createDocumentFragment()
• 节点插入html中
  • parent.appendChild()，将创建的元素节点插入容器里，页面已有的元素插入时会被剪切
  • parent.insertBefore(a,b)
• 移除节点
  • parent.removeChild()
  • child.remove()
• 修改节点
  • parent.replaceChild(new,origin)
• 获取节点
  • getElementById()，IE8以下不区分大小写，并且name属性还可以匹配
  • getElementsByTagName()，通用，常用
  • getElementsByName()，需注意，只有部分元素的name可生效（表单，表单元素，img，iframe）
  • getElementsByClassName()，IE8及以下的版本没有这个方法
  • querySelector()，IE7及以下的版本没有这个方法，方法不是实时，结构中添加元素后，不会选中
  • querySelectorAll()，IE7及以下的版本没有这个方法，方法不是实时，结构中添加元素后，不会选中

节点类型：

• 元素节点，调用nodeType时返回1
• 属性节点，调用nodeType时返回2
• 文本节点，调用nodeType时返回3
• 注释节点，调用nodeType时返回8
• document，调用nodeType时返回9
• DocumentFragment，调用nodeType时返回11

节点的四个属性：

• nodeName，元素的标签名，以大写形式显示，只读
• nodeValue，Text节点或comment节点的文本内容，可读写
• nodeType，该节点的类型，只读
• attributes，Element节点的属性集合

节点的一个方法：

• Node.hasChildNodes();

遍历节点树（包括所有节点）：

• parentNode，父节点
• childNodes，子节点们（什么是节点，不仅仅是元素）
• firstChild，第一个子节点
• lastChild，最后一个子节点
• nextSibling，后一个兄弟节点
• previousSibling，前一个兄弟节点

基于元素节点树的遍历（只包含元素节点）：

• parentElement，返回当前元素的父节点（IE不兼容）
• children，只返回当前元素的元素子节点
• node.childElementCount === node.children.length，当前元素节点的子元素节点个数（IE不兼容）
• firstElementChild，返回的是第一个元素的节点（IE不兼容）
• lastElementChild，返回的是最后一个元素的节点（IE不兼容）
• nextElementSibling，返回后一个兄弟节点（IE不兼容）
• previousElementSibling，返回前一个兄弟节点（IE不兼容）

元素节点的属性和方法：

• innerHtml，改变一个元素内部的html内容
• innerText（火狐不兼容）
• textContent(火狐的方法，老版本IE不好用)
• ele.setAttribute()
• ele.getAttribute()

20、DOM树结构

以下是构造函数的继承关系

Node

• Document
  • HTMLDocument，（document的构造函数）
• CharacterData
  • Text
  • Comment
• Element
  • HTMLElement
    • HTMLHeadElement，（各个元素的构造函数）
    • HTMLBodyElement
    • …etc
• Attr

在构造函数的原型中添加属性，相应的元素中也继承该属性

HTMLBodyElement.prototype.abc = "123"
var body = document.getElementByTagName("body")
//body.abc应该也是123

Document中定义的常用属性

• document.body，指代页面body元素
• document.head，指代页面head元素
• document.documentElement，指代页面html元素

21、js定时器

全局对象window上的方法，内部this指向window

• setInterval(func，1000)，指定时间循环执行func，返回的值是定时器的标识
• setTimeout(func，1000)，指定时间后执行func一次，返回的值是定时器的标识
• clearInterval(标识)，停止定时器
• clearTimeout标识)，停止定时器

22、获取窗口属性

查看滚动条滚动距离：

• window.pageXOffset，IE8及以下不兼容
• window.pageYOffset，IE8及以下不兼容

查看滚动条IE8及以下方案：

• document.body.scrollLeft

• document.body.scrollTop

• document.documentElement.scrollLeft

• document.documentElement.scrollTop

​ 这两个方式使用时相加document.body.scrollLeft + document.documentElement.scrollLeft，因为兼容性问题，一个可以使用，另一个必然为0

让滚动条滚动：

• scroll(x,y)/scrollTo(x,y)，滚动到某个位置
• scrollBy(x,y)，滚动到某个位置，会在之前的位置上进行累加

查看窗口尺寸：

• window.innerwidth，IE8及以下不兼容
• window.innerHeight，IE8及以下不兼容

查看窗口尺寸IE8及以下方案：

标准模式和怪异模式的区别，标准模式在html文档顶部添加

• document.documentElement.clientWidth，标准模式下，任意浏览器都支持
• document.documentElement.clientHeight，标准模式下，任意浏览器都支持
• document.body.clientWidth，适用于怪异模式下的浏览器
• document.body.clientHeight，适用于怪异模式下的浏览器

判断页面渲染模式：

document.compatMode
//结果为：CSS1Compat，则是标准模式
//结果为：BackCompat，则是怪异模式

查看元素几何尺寸：

• domEle.getBoundingClientRect()（可以被以下替代）
  • 兼容性好
  • 返回一个对象，里面包含left，right，top，bottem，width，height
  • width，height在ie里没有
  • 返回结果并不是实时的，数值更改后，返回值不会变，除非重新获取
• domEle.offsetWidth，元素宽
• domEle.offsetHeight，元素高
• domEle.offsetLeft，对于无定位的父级，返回坐标相对文档；相反有定位的父级，返回的坐标相对与定位的父级
• domEle.offsetTop，对于无定位的父级，返回坐标相对文档；相反有定位的父级，返回的坐标相对与定位的父级

返回有定位的父级：

• domEle.offsetParent，返回最近有定位的父级元素，如无，则返回body

23、脚本化CSS

读写元素的CSS属性：

• domEle.style.prop
  • 可读写内联样式，没有兼容性
  • 遇到float保留字，前面加css（cssFloat）
  • 复合属性必须拆解，组合单词变成小驼峰写法
  • 写入的值必须是字符串形式

查询计算样式：

• window.getComputedStyle(ele,null)
  • 计算样式只读
  • 返回计算样式都是绝对值px，没有相对单位
  • IE8及以下不兼容
  • 参数中的null是用来获取伪元素的样式，可传入after等

查询计算样式IE8以下方案：

• domEle.currentStyle
  • 计算样式只读
  • 返回的样式不是绝对值
  • IE独有属性

24、事件

绑定事件函数：

• ele.onXXX = function(event){}
  • 兼容性好，但是一个元素的同一个事件只能绑定一个处理程序
  • 基本等于内联属性
  • this指向ele元素本身
• ele.addEventListener(事件类型，处理函数，false)
  • IE9以下不兼容，可以为一个事件绑定多个处理程序
  • this指向ele元素本身
• ele.attachEvent(onXXXX,fn)
  • IE独有的，一个事件可以绑定多个处理程序
  • this指向window

解除事件处理函数：

• ele.onclick = false或”“或null
• ele.removeEventListener(事件类型，处理函数，fasle)
• ele.detachEvent(onXXXX,fn)

24、事件处理模型

ele.addEventListener(事件类型，处理函数，false)中的第三个参数决定了是捕获还冒泡

事件执行的那个元素不会冒泡和捕获，冒泡捕获只会发生在父级

• 事件冒泡
  • 结构上（非视觉）嵌套关系的元素，会存在事件冒泡功能，即同一事件，自子元素冒泡向父元素（自底向上）
• 事件捕获
  • 结构上（非视觉）嵌套关系的元素，会存在事件冒泡功能，即同一事件，自父元素捕获至子元素（自顶向下）
  • IE没有捕获事件

如果同一个事件绑定两个处理函数，分别绑定了冒泡和捕获模式，则触发顺序，先捕获，后冒泡

focus，blur，change，submit，reset，select等事件不冒泡

取消事件冒泡：

在事件处理函数里面写如下，则不发生冒泡（evnet为事件处理函数的参数，系统传递 ）

• W3C标准event.stopPropagation()，不支持IE9以下
• IE独有event.cancelBubble = true，chrome也支持了

阻止默认事件：

• 默认事件—>表单提交，a标签跳转，右键菜单等
• return false；以对象属性的方式注册的事件才生效
• event.preventDefault()；W3C标准，IE9以下不兼容
• event.returnValue = false；兼容IE

事件对象：

• 一般事件对象为event，对于IE是window.event，所以使用event || window.event
• 事件源对象（触发事件的对象）
  • event.target，火狐只有
  • event.srcElement，IE只有
  • chrome浏览器以上两个都有

事件源对象的使用：

外部元素绑定事件，在单击其内部元素时，通过其事件源对象可以知道单击的哪个对象，不用里面每个元素都绑定事件

//优点：
//1、不需要循环所有元素一个一个绑定事件
//2、当有新元素添加时，不需要重新绑定
<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
        <li>7</li>
        <li>8</li>
        <li>9</li>
        <li>10</li>
    </ul>
    <script>
        var ul = document.getElementsByTagName('ul')[0]
        ul.onclick = function (e) {
            console.log(e.target.innerText)
        }
    </script>
</body>

25、鼠标事件分类

• click，单击，按下+弹起
• mousedown，按下（移动端touchstart）
• mousemove，移动（移动端touchmove）
• mouseup，弹起（移动端touchend）
• contextmenu，右键菜单
• mouseover，鼠标进入
• mouseout，鼠标移出
• mouseseenter，鼠标进入
• mouseleave，鼠标移出

鼠标左右键的区分，使用事件对象的button属性event.button

• 0，左键
• 1，中键
• 2，右键

click事件只能监听左键，不能监听右键，判断左右用mousedown或mouseup

26、键盘事件分类

• onkeydown
  • 可以响应任意键盘按键
• onkeyup
• onkeypress
  • 只可以响应字符类(asicll码中)按键
  • 可返回asicll码，转换为相应字符

27 、文本类操作事件

• oninput，文本框内容变化就触发
• onfocus，获得焦点触发
• onblur，失去焦点触发
• onchange，获得失去焦点前后内容的改变，才触发，内容不变，不触发

28、窗体类事件

• onscroll，滚动条滚动触发
• onload，页面完全加载完触发，效果慢

29、json

• JSON.parse()，json字符串转json对象
• JSON.stringify()，json对象转json字符串

30、异步加载js

正常js加载是同步的，要等页面加载完再加载，因为js要操作页面，然后有时一些js不操作页面，这时候还是用同步，就显得效率低

异步加载的三种方案：

• defer，使用方法，给script标签增加属性defer。

  • 但要等到dom文档全部解析完才会执行，只有IE能用
  • script标签可以引入js，也可以代码写在标签里

• async，使用方法，给script标签增加属性async。

  • 加载完就执行，async只能加载外部脚本，不能写在script标签里

• （重点）创建script，插入到dom中，加载完毕后callBack

  • var script document.creatElement('script');
    script.type = "text/javascript";
    script.src = "tools.js";//开始下载js
    document.head.appendChild(script);//添加到页面，才执行js
    
    script.onload = function(){
        //tools加载完后，才能调用里面的方法，不然报错
    }
    //IE中没有load使用readyState
    script.onreadystatechange = function(){
        //里面判断readyState的变位情况，做出操作
    }
    

31、时间线

1. 创建Document元素，开始解析web页面。document.readyState = ‘loading’
2. link外部css，创建线程加载，继续解析文档
3. script标签js，（没有设置异步属性async等）等待js加载完毕并执行脚本，继续解析文档
4. script标签js，（设置了异步属性async等），浏览器创建线程加载，继续解析文档
5. 遇到img，正常解析结构，异步加载图片，继续解析文档
6. 文档解析完成。document.readyState = ‘interactive’
7. 文档解析完成后，所有设置defer的脚本按照顺序执行
8. document对象触发DOMContentLoaded事件，标志着由同步脚本执行截断转化为事件驱动阶段
9. 当所有的async的脚本加载完成并执行后，img等加载完成后。document.readyState = ‘complete’，window对象触发load事件
10. 从此，以异步响应方式处理用户输入、网络事件等

32、正则表达式

两种创建方式：

• 直接量

  • var str = "abcd";
    var reg = /abc/i;//i修饰符，代表忽略大小写，也可以不写
    reg.test(str)//返回布尔值，表示是否匹配
    

• new RegExp()

  • var str = "abcd";
    var reg = new RegExp("abc","i")//i修饰符，代表忽略大小写，也可以不写
    reg.test(str)//返回布尔值，表示是否匹配
    

两个方法：

• reg.test(str)，只能确定是否匹配
• str.match(reg)，可以把匹配的字符串作为数组返回

修饰符：

• i，忽略大小写的匹配
• g，执行全局匹配（查找所有匹配，并非找到一个停止）
• m，执行多行匹配

方括号：

使用方括号代表一位[0-9]，里面的内容是取值范围

元字符：

• . === 查找单个字符，除了换行和行结束符

• \w === [0-9A-z_]

• \W === 非\w

• \d ===[0-9]

• \D === 非\d

• \s === [空格 制表符 回车符 换行符 垂直换行符 换页符]

• \S ===非\s

• \b === 单词边界

• \B === 非单词边界

• \n === 查找换行符

• \f === 查找换页符

• \r === 查找回车符

• \t === 查找制表符

• \v === 查找垂直制表符

• \xxx === 查找八进制数xxx规定的字符

• \xdd === 查找十六进制数dd规定的字符

• \uxxxx === 查找以十六进制数xxxx规定的Unicode字符

\数字 === 匹配第几个子表达式相同的内容,子表达式就是圆括号中的

例如：

var str = "aabb"
var reg = /(\w)\1(\w)\2/g

任何区间的匹配使用[\s\S]或[\w\W]等等，加个就是任意多个了*

量词（匹配数量）：

• n+ ------> {1，∞}个
• n* ------> {0，∞}个
• n? ------> {0，1}个
• n{X} ------> X个
• n{X,Y} ------> {X，Y}个
• n{X,} ------> {X，∞}个
• n$ ------> 以n结尾的字符串
• ^n ------> 以n开头的字符串
• ?=n ------> 其后紧接着n的字符串
• ?!n ------> 其后没有紧接着n的字符串

RegExp对象属性：

• global，RegExp对象是否具有表示g
• ignoreCase，RegExp对象是否具有表示i
• lastIndex，一个整数，表示开始下一次匹配的字符位置
• multiline，RegExp对象是否具有表示m
• source，正则表达式的源文本

RegExp的对象方法：

• compile，编译正则表达式
• exec，检索字符串中指定的值，返回找到的值，并确定位置
• test，检索字符串中指定的值，返回true或false

支持正则字符串对象方法：

• search，检索与正则相匹配的值，返回匹配位置，匹配不到-1
• match，找到一个或多个正则匹配
• replace，替换与正则表达式匹配的子串，不用正则的话只能替换一个
• split，把字符串分割为字符串数组

例子：

1、将匹配到的aabb调换为bbaa

//小括号内为子表达式
var reg = /(\w)\1(\w)\2/g;
var str = "aabb";
var result = str.replace(reg,"$2$2$1$1")//此处的第二个参数可以引用正则表达式的子表达式，$1为第一个子表达式，$2为第二个

//replace第二个参数也可以函数
//$，正则匹配的结果
//$1，第一个子表达式匹配内容
//$2，第二个子表达式匹配内容
var result = str.replace(reg,function（$，$1，$2）{
                         return $2 +$2 +$1 +$1;
                         })

2、将the-first-name变成小驼峰theFirstName

var reg = /-(\w)/g;
var str = "the-first-name";
var result = str.replace(reg,function($,$1){
    return $1.toUpperCase();
});

打破贪婪模式，在量词后面加问号？