// getComputedStyle返回计算后的属性对象集合
document.body.style.zoom = 0.8
var zoomVal = window.getComputedStyle(document.body).zoom;
newHeight = window.innerHeight / zoomVal

var dpr = 0;
var scale = 0;
var match = document.querySelector('meta[name="viewport"]').getAttribute('content').match(/initial\-scale=([\d\.]+)/)
if (match) {
    scale = parseFloat(match[1]);
    dpr = parseInt(1 / scale);
}
if (!dpr && !scale) {
    var isAndroid = win.navigator.appVersion.match(/android/gi);
    var isIPhone = win.navigator.appVersion.match(/iphone/gi);
    var devicePixelRatio = win.devicePixelRatio;
    if (isIPhone) {
        // iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案
        if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
            dpr = 3;
        } else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)){
            dpr = 2;
        } else {
            dpr = 1;
        }
    } else {
        // 其他设备下，仍旧使用1倍的方案
        dpr = 1;
    }
    scale = 1 / dpr;
}
var doc = win.document;
var docEl = doc.documentElement;
docEl.setAttribute('data-dpr', dpr);
if (!metaEl) {
    metaEl = doc.createElement('meta');
    metaEl.setAttribute('name', 'viewport');
    metaEl.setAttribute('content', 'initial-scale=' + scale + ', maximum-scale=' + scale + ', minimum-scale=' + scale + ', user-scalable=no');
    if (docEl.firstElementChild) {
      docEl.firstElementChild.appendChild(metaEl);
    } else {
      var wrap = doc.createElement('div');
      wrap.appendChild(metaEl);
      doc.write(wrap.innerHTML);
    }
}

(function (doc, win) {
  var docEl = doc.documentElement,
    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
    recalc = function () {
      var clientWidth = docEl.clientWidth;
      if (!clientWidth) return;

      let array = navigator.userAgent.split("&");
      // 还可以处理各个的兼容，比如华为P20手机兼容
      if(navigator.userAgent.indexOf("HUAWEIEML-AL00") >= 0 && array.length >=2){
        clientWidth = 313;
      }

      // 屏幕宽为750px时，1rem = 100px;
      // 而我们公司的设计稿就是按750px的尺寸做的，因此可以直接转换
      // 比如 10px 就是 0.1rem
      docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
    };
  if (!doc.addEventListener) return;
  win.addEventListener(resizeEvt, recalc, false);
  doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);

// 移动端时，在input或textarea获取焦点后，一般会软键盘弹起
// 为了防止软键盘挡住input或textarea，可以设置input或textarea自动滚动到可视区域
if ( isMobile ) {
  if ( ios_version.length > 1 && parseInt( ios_version[ 0 ] ) >= 11 ) {
    //ios 11 以上先不执行
  } else {
    document.body.addEventListener( 'click', function ( event ) {
      var element = event.target;
      var tags = {
        'INPUT': 1,
        'TEXTAREA': 1,
      };
      if ( ( element.tagName in tags ) ) {
        setTimeout( function () {
          // 将不在浏览器窗口的可见区域内的元素滚动到浏览器窗口的可见区域。 如果该元素已经在浏览器窗口的可见区域内，则不会发生滚动。
          element.scrollIntoViewIfNeeded();
        }, 400 );
      }
    }, false );
  }

// charset是定义的外部脚本文件中所使用的字符编码
// type规定脚本的MIME类型，媒介类型/子类型
// html5规范中，现代浏览器默认的脚本就是javascript,所以如果标签内是js可以省略，但是如果不是js就需要添加
<script type="text/javascript" src="myscripts.js" charset="UTF-8"></script>

// flex实现table高度只适应
// 比如页面里有两个部分，头部和table，要求table高度自适应
// 可以对父元素设置如下(注意height:100%需要显式指定)：
display:flex;
flex-direction:column;
height:100%;

// 然后table元素设置如下：
flex: 1;
// 其实就是按比例自适应填满剩余空间

// !important>行内样式>ID选择器 > 类选择器 | 属性选择器 | 伪类选择器 > 元素选择器

// 1. 时间间隔并不好拿捏，设置太短浏览器重绘频率太快会产生性能问题，太慢的话又显得像PPT不够平滑，业界推荐的时间间隔是16.66...（显示器刷新频率是60Hz，1000ms/60）
// 2. 浏览器UI线程堵塞问题，如果UI线程之中有很多待完成的渲染任务，所要执行的动画就会被搁置。

// 模拟requestAnimationFrame
let lastTime = 0;
if ( !window.requestAnimationFrame ) {
  window.requestAnimationFrame = function ( callback, element ) {
    var currTime = new Date().getTime();
    var timeToCall = Math.max( 0, 16 - ( currTime - lastTime ) );
    var id = window.setTimeout( function () { callback( currTime + timeToCall ); }, timeToCall );
    lastTime = currTime + timeToCall;
    return id;
  };
}

// 浏览器自动
var start = null;
var element = document.getElementById('SomeElementYouWantToAnimate');
// element.style.position = 'absolute';

function step(timestamp) {
  if (!start) start = timestamp;
  var progress = timestamp - start;
  element.style.left = Math.min(progress / 10, 200) + 'px';
  if (progress < 2000) {
    window.requestAnimationFrame(step);
  }
}
// 利用浏览器的刷新频率自动执行step函数，其实相当于定时器
window.requestAnimationFrame(step);

// getCurrentPosition是异步操作，回调函数对返回的数据进行处理
navigator.geolocation.getCurrentPosition(function(position) {
  do_something(position.coords.latitude, position.coords.longitude);
});

// DeviceOrientationEvent是加速度传感器检测到设备在方向上发生变化时触发
window.addEventListener("deviceorientation", handleOrientation, true);
// DeviceMotionEvent是监听的加速度变化而不是方向
window.addEventListener("devicemotion", handleMotion, true);

// 获取窗体的高度
var windowHeight = window.innerHeight
// 前者主要兼容pc端，后者主要针对移动端（新document.s自动兼容）
var scroll_Top = document.documentElement.scrollTop || document.body.scrollTop;
// scrollingElement 新标准，标准模式下返回document.documentElement
// 怪异模式下，返回body，因此可以不用再向上面写两个了(注意兼容)

// 在ie9之后的浏览器(pc及移动)，垂直方向的偏移
var ie_scroll_top = window.pageYOffset

// 获取元素高度：clientHeight不包括边框
// offsetHeight包括边框且获取的是整数位,还有ele.getBoundingClientRect().height这个可以精确到小数位，都兼容ie6+
// 获取元素滚动高度：scrollTop即可

// 判断页面滚动到底部
window.addEventListener('scroll', () => {
  // 滚动条在Y轴上的滚动距离
  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  // 文档的总高度
  var scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight;
  // 浏览器视口的高度
  var clientHeight = document.documentElement.clientHeight || document.body.clientHeight;
  // 滚动距离+窗口高度 == 文档的总高度
  if(scrollTop + clientHeight == scrollHeight){
    console.log('到底部了')
  }
})

// 元素滚动到页面的指定位置，
// 首先需要根据e.target找到滚动的元素，然后用该元素调用scrollTo(xpos,ypos)
// 有个库Scrollparent，专门用来找滚动元素，但效果待验证。。。
// 原理：找到传入的元素的祖先元素，然后判断祖先元素的overflow相关的属性值，若属性值包含auto或scroll就为滚动元素。

// 当前的元素滚动到浏览器窗口的可视区域内。
Element.scrollIntoView()
// 参数有三种方式
element.scrollIntoView(); // 等同于element.scrollIntoView(true)
element.scrollIntoView(alignToTop); // Boolean型参数
element.scrollIntoView(scrollIntoViewOptions); // Object型参数

// 如果为true，元素的顶端将和其所在滚动区的可视区域的顶端对齐。 相应的 scrollIntoViewOptions: {block: "start", inline: "nearest"}。这是这个参数的默认值。
// 如果为false，元素的底端将和其所在滚动区的可视区域的底端对齐。相应的scrollIntoViewOptions: {block: "end", inline: "nearest"}。

// scrollIntoViewOptions包含三个选项：
// behavior，定义动画过渡效果， "auto"或 "smooth" 之一。默认为 "auto"。
// block，定义垂直方向的对齐， "start", "center", "end", 或 "nearest"之一。默认为 "start"。
// inline，定义水平方向的对齐， "start", "center", "end", 或 "nearest"之一。默认为 "nearest"。
// 一般项目里直接，使用如下即可
Element.scrollIntoView({ behavior: 'smooth' })

// 下拉刷新
// 1. 当前手势滑动位置与初始位置差值大于零时，提示正在进行下拉刷新操作；
// 2. 下拉到一定值时，显示松手释放后的操作提示；
// 3. 下拉到达设定最大值松手时，执行回调，提示正在进行更新操作。
( function ( window ) {
  var _element = document.getElementById( 'refreshContainer' ),
    _refreshText = document.querySelector( '.refreshText' ),
    _startPos = 0,
    _transitionHeight = 0;

  _element.addEventListener( 'touchstart', function ( e ) {
    console.log( '初始位置：', e.touches[ 0 ].pageY );
    _startPos = e.touches[ 0 ].pageY;
    _element.style.position = 'relative';
    _element.style.transition = 'transform 0s';
  }, false );

  _element.addEventListener( 'touchmove', function ( e ) {
    console.log( '当前位置：', e.touches[ 0 ].pageY );
    _transitionHeight = e.touches[ 0 ].pageY - _startPos;

    if ( _transitionHeight > 0 && _transitionHeight < 60 ) {
      _refreshText.innerText = '下拉刷新';
      _element.style.transform = 'translateY(' + _transitionHeight + 'px)';

      if ( _transitionHeight > 55 ) {
        _refreshText.innerText = '释放更新';
      }
    }
  }, false );

  _element.addEventListener( 'touchend', function ( e ) {
    _element.style.transition = 'transform 0.5s ease 1s';
    _element.style.transform = 'translateY(0px)';
    _refreshText.innerText = '更新中...';

    // todo...
  }, false );
} )( window );

// e.screenX 是鼠标距离物理屏幕左边缘的距离
// e.clientX 是鼠标距离页面左边缘的距离

// 给窗体绑定滚动事件，直接给window添加就行(document有兼容，body及documentElement不反应)
window.addEventListener('scroll',function(){
  console.log('window滚动了')    // 有效
})
document.addEventListener("scroll",function(){
  console.log[("document滚动了") // 有效
})
document.body.addEventListener("scroll",function(){
  console.log("body滚动了")     // 无效
})
document.documentElement.addEventListener("scroll",function(){
  console.log("html滚动了")     // 无效
})
[document,window,document.documentElement,document.body].forEach(function(item){
  item.addEventListener('scroll',function(){
    console.log(`${item} 滚动了`)
  })
})

{
  // 添加事件句柄
  addHandler: function(elem, type, listener) {
    if (elem.addEventListener) {
      elem.addEventListener(type, listener, false);
    } else if (elem.attachEvent) {
      elem.attachEvent('on' + type, listener);
    } else {
      // 在这里由于.与'on'字符串不能链接，只能用 []
      elem['on' + type] = listener;
    }
  },
  // 移除事件句柄
  removeHandler: function(elem, type, listener) {
    if (elem.removeEventListener) {
      elem.removeEventListener(type, listener, false);
    } else if (elem.detachEvent) {
      elem.detachEvent('on' + type, listener);
    } else {
      elem['on' + type] = null;
    }
  },
  // 取消默认行为
  preventDefault: function(event) {
    if (event.preventDefault) {
        event.preventDefault();
    } else {
        event.returnValue = false;
    }
  },
  // 阻止事件冒泡
  stopPropagation: function(event) {
    if (event.stopPropagation) {
        event.stopPropagation();
    } else {
        event.cancelBubble = true;
    }
  },
  // 阻止滚动及滚轮事件
  stopScrollAndMousewheel: function(e){
    ['scroll','mousewheel'].forEach((item) => {
      window.addEventListener(item,(e) => {
        e.preventDefault && e.preventDefault();
        e.returnValue = false; // 已废除(但有旧浏览器支持)，用e.preventDefault()代替
        e.stopPropagation && e.stopPropagation();
        return false;
      })
    })
  },
}

// Test via a getter in the options object to see
// if the passive property is accessed
// supportsPassive.js
export let supportsPassive = false
if (typeof window !== 'undefined') {
  supportsPassive = false
  try {
    var opts = Object.defineProperty({}, 'passive', {
      get () {
        supportsPassive = true
      },
    })
    window.addEventListener('test', null, opts)
  } catch (e) {}
}

// Use our detect's results.
// passive applied if supported, capture will be false either way.
import { supportsPassive } from './supportsPassive';
elem.addEventListener(
  'scroll',
  fn,
  supportsPassive ? { passive: true } : false
);

// 返回一个新创建的 Blob 对象，其内容由参数中给定的数组串联组成
Blob(blobParts[, options])

// 如用字符串构建一个 blob
var debug = {hello: "world"};
var blob = new Blob([JSON.stringify(debug, null, 2)], {type : 'application/json'});

// result就是字符串格式的合同文件
const blob = new Blob([result], { type: 'text/html' });
// 其实这个url的生命周期和创建它的窗口中的document绑定，也就是关闭页面了，document没有了，这个url就失效了
// 不过每次都会新建不同的
const url = URL.createObjectURL(blob);
this.$refs.iframe.src = url;

// 相关核心代码，注意这里的data是整个响应体，
let fileName = data.headers['content-disposition'].slice(20);
let url = window.URL.createObjectURL(new Blob([data.data]));
let link = document.createElement("a");
link.style.display = "none";
link.href = url;
link.setAttribute("download", fileName);
document.body.appendChild(link);
link.click();

Array.prototype.slice.call({0: "aaa", length: 1}) //["aaa"]

let arr = [1,2,3,4]
console.log(arr.slice() === arr); //false

var obj1 = {
  name: "zhangsan",
  age: "18"
};

var obj2 = obj1;              // 赋值
var obj3 = shallowCopy(obj1); // 浅拷贝

function shallowCopy(src) {
  var dst = Object.create(null); // 必须有至少一个参数
  for (var prop in src) {
    if (src.hasOwnProperty(prop)) {
      dst[prop] = src[prop];
    }
  }
  return dst;
}

obj2.name = "lisi";
obj3.age = "20";

console.log(obj1);
//obj1 = {
//    'name' : 'lisi',
//    'age' :  '18',
//};

console.log(obj2);
//obj2 = {
//    'name' : 'lisi',
//    'age' :  '18',
//};

console.log(obj3);
//obj3 = {
//    'name' : 'zhangsan',
//    'age' :  '20',
//};

// 大致问题点：
// 无法复制不可枚举的属性及Symbol类型
// 只针对了Object类型的做了迭代，但Array,Date,RegExp,Error,Function无法拷贝
// 对象有循环引用的问题 (如：obj.a = obj)
function deepClone(obj) {
  let dest = Object.create(null);

  for (let prop in obj) {
    if (obj.hasOwnProperty(prop)) {
      typeof obj[prop] === "object"
        ? (dest[prop] = deepClone(obj[prop]))
        : (dest[prop] = obj[prop]);
    }
  }

  return dest;
}

// 深拷贝版本一
// 该版本只考虑对象
function deepClone1(obj) {
  if (!obj || typeof obj !== "object") {
    return obj;
  }

  let resObj = Object.create(null);
  for (let item in obj) {
    if (obj.hasOwnProperty(item)) {
      typeof item === "object" ? deepClone(item) : (resObj[item] = obj[item]);
    }
  }
  return resObj;
}
var obj = { a: 1, b: 2 };
var obj2 = deepClone1(obj);

// 深拷贝版本二
// 该版本兼容数组
function deepClone1(obj) {
  if (!obj || typeof obj !== "object") return obj;

  let resObj = Array.isArray(obj) ? [] : {};

  Object.keys(obj).forEach(key => {
    if (resObj[key]) return;
    resObj[key] = deepClone1(obj[key]);
  });
  return resObj;
}
var obj = { a: 1, b: 2, c: [1, 2, 3] };
var obj2 = deepClone1(obj);
obj2;

// 深拷贝版本三
// 兼容所有并解决循环引用和相同引用的问题
function deepClone1(obj) {
  // 为解决循环和相同引用的问题
  let copyed = [];
  function _deep(obj){
    if (!obj || typeof obj !== "object") return obj;

    for (let i = 0; i < copyed.length; i++) {
      if (copyed[i].target === obj) return copyed[i].copyTarget;
    }

    let resObj = Array.isArray(obj) ? [] : {};
    copyed.push({ target: obj, copyTarget: resObj });

    Object.keys(obj).forEach(key => {
      if (resObj[key]) return;
      resObj[key] = deepClone1(obj[key]);
    });
    return resObj;
  }
  return _deep(obj);
}

// 深拷贝版本四
// 高效率版
function finalDeepClone(obj) {
  // 数组用WeakMap代替
  let copyed = new WeakMap();
  function _deep(obj){
    if (!obj || typeof obj !== "object") return obj;
    if (copyed.has(obj)) return copyed.get(obj);

    let resObj = Array.isArray(obj) ? [] : {};
    copyed.set(obj, resObj);
    Object.keys(obj).forEach(key => {
      if (resObj[key]) return;
      resObj[key] = _deep(obj[key]);
    });
    return resObj;
  }
  return _deep(obj);
}

function deepCopy(target) {
  let copyed_objs = []; //此数组解决了循环引用和相同引用的问题，它存放已经递归到的目标对象
  function _deepCopy(target) {
    if (typeof target !== "object" || !target) {
      return target;
    }
    for (let i = 0; i < copyed_objs.length; i++) {
      // 如果当前对象与数组中的对象相同，则不对其递归
      if (copyed_objs[i].target === target) {
        return copyed_objs[i].copyTarget;
      }
    }
    let obj = {};
    if (Array.isArray(target)) {
      obj = []; //处理target是数组的情况
    }
    copyed_objs.push({ target: target, copyTarget: obj });
    Object.keys(target).forEach(key => {
      if (obj[key]) {
        return;
      }
      obj[key] = _deepCopy(target[key]);
    });
    return obj;
  }
  return _deepCopy(target);
}

// 这种深拷贝效果更佳，拷贝日期有问题
function deepClone(target) {
  let tempMap = new WeakMap(); // 解决相同或循环引用
  function _deep(target) {
    // 基本数据类型直接返回值
    if (!target || typeof target !== "object") return target;
    if (tempMap.has(target)) return tempMap.get(target);

    let obj = Array.isArray(target) ? [] : {};
    tempMap.set(target, obj);

    Object.keys(target).forEach(key => {
      if (obj[key]) return;
      obj[key] = _deep(target[key]);
    });
    return obj;
  }
  return _deep(target);
}

// 可用如下代码测试
var obj = {
  num: 0,
  str: "",
  boolean: true,
  unf: undefined,
  nul: null,
  obj: {
    name: "我是一个对象",
    id: 1
  },
  arr: [0, 1, 2],
  func: function() {
    console.log("我是一个函数");
  },
  date: new Date(0),
  reg: new RegExp("/我是一个正则/ig"),
  [Symbol("1")]: 1
};

Object.defineProperty(obj, "innumerable", {
  enumerable: false,
  value: "不可枚举属性"
});

// 有何意义？
obj = Object.create(obj, Object.getOwnPropertyDescriptors(obj));

obj.a = {loop:obj};

// 为了测试两种方式对大数据的处理，对数据做如下修改
obj.list = new Array(10000).fill(0).map((item, index) => {return {a:index}})

// 测试时间
console.time();
var cloneObj = deepCopy(obj);
console.timeEnd();
// : 175.843994140625ms

console.time();
var cloneObj = goodDeepCopy(obj);
console.timeEnd();
// : 12.794189453125ms

// 问：js中function开头加感叹号、分号什么意思？
;function(){}
// 答：js中分号表示语句结束，在开头加上是为了压缩的时候和别的方法分隔一下，表示一个新的语句的开始。
var = {
  method:function(){}
}
(function(){
})()
// 压缩后可能出现类似 }}(function 的代码，会被当成一个函数来执行，于是整体解析就错了
// 其实归根结底是解析器ASI(Automatic Semicolon Insertion)不能区分到底语句哪里应该终止
// 参考：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Lexical_grammar

// 逗号运算符，对它的每个操作数求值（从左到右），并返回最后一个操作数的值。
var x = 1;
x = (x++, x);
console.log(x);
// expected output: 2
x = (2, 3);
console.log(x); // 3

// 避免使用eval,Function构造函数，
// 使用 eval 和 Function 构造函数是非常昂贵的操作，因为每次他们都会调用脚本引擎将源代码转换成可执行代码。
// eval它的功能是把对应的字符串解析成JS代码并运行；
//    应该避免使用eval，不安全，非常耗性能（2次，一次解析成js语句，一次执行）。

//----- 取消请求
var xhr = new XMLHttpRequest(),
    method = "GET",
    url = "https://developer.mozilla.org/";
xhr.open(method,url,true);
xhr.send();
xhr.abort();

//------ 还可以设置定时器超时时间
var xhr = new XMLHttpRequest ();
xhr.onreadystatechange = function () {
  if (this.readyState == 4) {
    clearTimeout(timeout);
    // do something with response data
  }
}
var timeout = setTimeout( function () {
  xhr.abort(); // call error callback
}, 60*1000);
xhr.open('GET', url, true);  
xhr.send();

// open()的第三个参数是表示是否异步发送请求……
// xhr.open方法第三个参数若为false表示为请求为同步……
// 意思就是必须等到服务器响应回来才执行下面的js代码……默认为true……
// 这里的 send()方法接收一个参数，即要作为请求主体发送的数据。
// 如果不需要通过请求主体发送数据，则必须传入 null，因为这个参数对有些浏览器来说是必需的。
// 调用 send()之后，请求就会被分派到服务器。

//------ 原始运算符始终比函数调用要高效
var min = Math.min(a,b);
A.push(v);
// 使用下面的效率高
var min = a < b ? a : b;
A[A.length] = v;

~~null;      // => 0
~~undefined; // => 0
~~Infinity;  // => 0
--NaN;       // => 0
~~0;         // => 0
~~{};        // => 0
~~[];        // => 0
~~(1/0);     // => 0
~~false;     // => 0
~~true;      // => 1
~~1.9;       // => 1
~~-1.9;      // => -1

1.2 | 0  // 1
1.8 | 0 // 1
-1.2 | 0 // -1

window.addEventListener('pageshow', function(evt) {
  // 如果从缓存中读取
  if (evt.persisted) {
    // todo
  }
})

<script src="script.js"></script>
// 没有 defer 或 async，浏览器会立即加载并执行指定的脚本，“立即”指的是在渲染该 script 标签之下的文档元素之前，也就是说不等待后续载入的文档元素，读到就加载并执行。

<script async src="script.js"></script>
// 有 async，加载和渲染后续文档元素的过程将和 script.js 的加载与执行并行进行（异步）。

<script defer src="myscript.js"></script>
// 有 defer，加载后续文档元素的过程将和 script.js 的加载并行进行（异步），但是 script.js 的执行要在所有元素解析完成之后，一般在DOMContentLoaded 事件触发之前完成，但也不一定。

// 另外就是他们都可以接受多于两个的参数，
// 多余的参数便是传给函数的参数
setTimeout((x,y,z) => {console.log(x,y,z)}, 2000, 1,2,3);
// 1,2,3

// 另外建议不要在调用定时器函数时，为了向回调函数传递参数而使用字符串的形式。
function foo(a, b, c) {}
// 不要这样做
setTimeout('foo(1,2, 3)', 1000)
// 可以使用匿名函数完成相同功能
setTimeout(function() {
    foo(1, 2, 3);
}, 1000)

FastClick.prototype.onTouchEnd = function(event){
  if (!this.needsClick(targetElement)) {
    // 如果这不是一个需要使用原生click的元素，则屏蔽原生事件，避免触发两次click
    event.preventDefault(); 
    // 触发一次模拟的click
    this.sendClick(targetElement, event);
  }
}

function* helloWorldGenerator() {
  yield 'hello';
  yield 'world';
  return 'ending';
}
// 通过执行生成器返回迭代器对象
var helloWorldIterator = helloWorldGenerator();

helloWorldIterator.next(); 
// { value: "hello", done: false }

helloWorldIterator.next(); 
// { value: "world", done: false }

helloWorldIterator.next(); 
// { value: "ending", done: true }

helloWorldIterator.next(); 
// { value: undefined, done: true }

var fs = require('fs');

var readFile = function (fileName){
  return new Promise(function (resolve, reject){
    fs.readFile(fileName, function(error, data){
      if (error) reject(error); // 有错误直接抛出
      resolve(data); // 否则，
    });
  });
};

var gen = function* (){
  var f1 = yield readFile('/etc/fstab');
  var f2 = yield readFile('/etc/shells');
  console.log(f1.toString());
  console.log(f2.toString());
};

var asyncReadFile = async function (){
  var f1 = await readFile('/etc/fstab');
  var f2 = await readFile('/etc/shells');
  console.log(f1.toString());
  console.log(f2.toString());
};

async function fn(args) {
  // ...
}

// 等同于

function fn(args) {
  return spawn(function*() {
    // ...
  });
}

function spawn(genF) {
  return new Promise(function(resolve, reject) {
    const gen = genF();
    function step(nextF) {
      let next;
      try {
        next = nextF();
      } catch (e) {
        return reject(e);
      }
      if (next.done) {
        return resolve(next.value);
      }
      Promise.resolve(next.value).then(
        function(v) {
          step(function() {
            return gen.next(v);
          });
        },
        function(e) {
          step(function() {
            return gen.throw(e);
          });
        }
      );
    }
    step(function() {
      return gen.next(undefined);
    });
  });
}

function timeout(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

async function asyncPrint(value, ms) {
  await timeout(ms);
  console.log(value);
}

asyncPrint('hello world', 5000);

async function f() {
  // 等同于
  // return 123;
  return await 123;
}

f().then(v => console.log(v))

var arr100 = new Arrary(100);
var arr1000 = new Arrary(1000);
let map = {};
arr100.forEach(item => {
  map[item.id] = item;
  item.arr = [];
})
arr1000.forEach(item => {
  if(map[item.id]) return;
  map[item.id].arr.push(item)
})

var count = 0;
var fibonacci = function(n) {
  count++;
  return n < 2 ? n : fibonacci(n - 1) + fibonacci(n - 2);
};
for (var i = 0; i <= 10; i++) {
  fibonacci(i);
}
// 计算到10的斐波那契额数列竟然运行了453次函数调用
console.log(count); // 453

// 当执行 fib(0) 时，调用 1 次
// 当执行 fib(1) 时，调用 1 次
// 当执行 fib(2) 时，相当于 fib(1) + fib(0) 加上 fib(2) 本身这一次，共 1 + 1 + 1 = 3 次
// 当执行 fib(3) 时，相当于 fib(2) + fib(1) 加上 fib(3) 本身这一次，共 3 + 1 + 1 = 5 次
// 当执行 fib(4) 时，相当于 fib(3) + fib(2) 加上 fib(4) 本身这一次，共 5 + 3 + 1 = 9 次
// ...

function bubleSort(arr) {
  let arrLen = arr.length
  if(arrLen <= 1) return arr //必须返回数组
  for(let i = 0; i < arrLen - 1; i++){
    let flag = true; //加标志位，如果一轮循环内没有一次交换数据，说明已排好序
    for(let j = 0; j < arrLen - i -1; j++){
      if(arr[j] > arr[j+1]){
        [arr[j+1],arr[j]] = [arr[j],arr[j+1]]
        flag = false
      }
      // 还可以这样,
      // arr[j] > arr[j+1] && ([arr[j+1], arr[j]] = [arr[j], arr[j+1]])
    }
    // 与内层for循环同级
    if(flag) break
  }
  return arr
}

function insertSort(arr){
  let arrLen = arr.length
  if(arrLen <= 1) return arr // 必须返回数组
  // 从第一项开始遍历待排序，一一取出
  for(let i = 1; i< arrLen; i++){
    let value = arr[i]
      j = i - 1; // 已排序的索引最大就是i-1，其实是倒着比，如果比最后一个还大，就只需比一次
    // 查找插入的位置
    for(; j >= 0; j-- ){
      // 如果已排序的比未排序的大，则将已排序的数据后移
      if(arr[j] > value){
        arr[j+1] = arr[j] //数据移动
      }else{
        // 如果最后一个都比value小，前面的则更小，就没必要再比了，跳出整个循环
        break
      }
    }
    // 等到内层循环完，也就移动完了，也就空出一个位置
    arr[j+1] = value //因为j索引的数组是最终的数组，因此
  }
  return arr
}

function selectSort(array) {
  if (Object.prototype.toString.call(array).slice(8, -1) === 'Array') {
    var len = array.length, temp;
    for (var i = 0; i < len - 1; i++) {
      var min = array[i];
      for (var j = i + 1; j < len; j++) {
        if (array[j] < min) {
          [array[j], min] = [min, array[j]]
        }
      }
      array[i] = min;
    }
    return array;
  } else {
    return 'array is not an Array!';
  }
}

function mergeSort(arr){
  // 设置终止的条件，
  if (arr.length < 2) {
    return arr;
  }
  //设立中间值
  var middle = parseInt(arr.length / 2);
  //第1个和middle个之间为左子列
  var left = arr.slice(0, middle);
  //第middle+1到最后为右子列
  var right = arr.slice(middle);
  if(left=="undefined"&&right=="undefined"){
     return false;
  }
  return merge(mergeSort(left), mergeSort(right));
}

function merge(left, right){
  var result = [];

  while (left.length && right.length) {
    if(left[0] <= right[0]){
      //把left的左子树推出一个，然后push进result数组里
      result.push(left.shift());
    }else{
      //把right的右子树推出一个，然后push进result数组里
      result.push(right.shift());
    }
  }
  //经过上面一次循环，只能左子列或右子列一个不为空，或者都为空
  while (left.length){
    result.push(left.shift());
  }
  while (right.length){
    result.push(right.shift());
  }
  return result;
}
// 测试数据
var nums=[6,10,1,9,4,8,2,7,3,5]；
mergeSort(nums); //

var quickSort = function(arr) {
　　if (arr.length <= 1) { return arr; }
　　var pivotIndex = Math.floor(arr.length / 2);
  // splice返回的是数组，因此[0]就可以取出具体的值
　　var pivot = arr.splice(pivotIndex, 1)[0]; // 务必要注意，这里修改数组，数组的长度已经发生变化了
　　var left = [];
　　var right = [];
    // 注意这里的数组长度是动态变化的，不能一开始就用变量缓存长度
　　for (var i = 0; i < arr.length; i++){
　　　　if (arr[i] < pivot) {
　　　　　　left.push(arr[i]);
　　　　} else {
　　　　　　right.push(arr[i]);
　　　　}
　　}
　　return quickSort(left).concat([pivot], quickSort(right));
};
quickSort([9,8,5,3,1]) // [1,3,5,8,9]

// 用es6语法
function quickSortRecursion (arr) {
  if (!arr || arr.length < 2) return arr;
  const pivot = arr.pop();
  let left = arr.filter(item => item < pivot);
  let right = arr.filter(item => item >= pivot);
  return quickSortRecursion(left).concat([pivot], quickSortRecursion(right));
}

// 2、数组去重
// 2.1，利用forEach，将数组的元素取出来作为对象的key，然后赋予任意值，最后获取key列表
var uniqueArr = arr => {
  let obj = {}
  arr.forEach((val) => {
    obj[val] = 0
  })
  // 注意，返回的是可枚举的字符串数组
  return Object.keys(obj)
}

// 2.2，filter，indexOf只会返回第一个匹配数据的index
// 因此即使有多个相同的，也只会返回第一个
var uniqueArr = arr => {
  // Array.prototype.filter(callback(element[, index[, array]])[, thisArg])
  // 注意可选参数的意义；thisArg为执行callback时this值
  return arr.filter((ele, index, array) => {
    return index === array.indexOf(ele)
  })
}

// 2.3，set
var uniqueArr = arr => {
  // 注意只适用于数组为基本数据类型的
  return [...new Set(arr)]
}

// 2.4，reduce
// Array.prototype.reduce(callback(accumulator,currentValue[, currentIndex[, array]])[, initialValue])
// accumulator是累计器最终的值，若initialValue没传则默认取数组第一项，currentValue则自动为第二项
// 下面给累加器传的值是一个对象，相当于2.1方法的另外一种方式
var uniqueArr = arr.reduce((map,item) => {
  map[item] = 0
  // 不能在里面直接返回Object.keys(map)
  // 因为这里返回的map会依然作为下次迭代的初始值
  return map;
}, {})
Object.keys(uniqueArr)

// 3、字符串反转
var reverseString = str => {
  return [...str].reverse().join('')
}

// 4、统计一个字符串中出现频率最高的字母或数字
var strChar = str => {
  let string = [...str],
      maxVal = '',
      obj = {},
      max = 0;
  string.forEach( val => {
    obj[val] = obj[val] === undefined ? 1 : obj[val] + 1
    if(obj[val] > max){
      max = obj[val]
      maxVal = val
    }
  })
  return maxVal
}

// 防抖
// 小于设置的interval时间间隔都不会触发，因为clearTimeout了
// 注意执行clearTimeout后，fn.timerId的值仍然存在，因为这是变量，和队列里的任务没有关系
function debounce(fn, interval = 300) {
  return (...args) => {
    clearTimeout(fn.timerId)
    fn.timerId = setTimeout(() => {
      fn.apply(this, args)
    },interval)
  }
}

window.onresize = debounce(test, 500)
window.onresize = debounce(()=>{console.log('resizing')},500)
window.addEventListener('resize',debounce(()=>{console.log('resizing')},500))

// 节流
throttle(fn, context) {
  clearTimeout( fn.tId );
  fn.tId = setTimeout(() => {
    fn.call( context );
  }, 300 );
}

function throttle(fn, interval) {
  // let canRun = null // 注意这里canRun不是null
  let canRun = true;
  return function (...args) {
    // !canRun && return // 这样写错误
    if(!canRun) return
    canRun = false;
    setTimeout(()=>{
      fn.apply(this, args);
      canRun = true;
    },interval)
  }
}
window.onresize = throttle(()=>{console.log('resizing')})
//这里的e就是resize事件，但这里打印的是[object Event],因为``里面是字符串
window.onresize = throttle((e)=>{console.log('resizing',`e is ${e}`)}) 

// 实现lodash的get方法，
// Gets the value at path of object. If the resolved value is undefined, the defaultValue is returned in its place.
// _.get(object, path, [defaultValue])
function deepGet ( object, path, defaultValue ) {
  return ( !Array.isArray( path ) ? path.replace( /\[/g, '.' ).replace( /\]/g, '' ).split( '.' ) : path )
    .reduce( (o, k) => ( o || {} )[k], object ) || defaultValue;
}

var obj = { 'a': [ { 'b': { 'c': 3 } } ] };

var result = deepGet( obj, 'a[0].b.c' );
console.log( result );
// => 3

result=deepGet(obj, ['a', '0', 'b', 'c']);
console.log(result);
// => 3

result=deepGet(obj, 'a.b.c', 'default');
console.log(result);
// => default

parseFloat((数学表达式).toFixed(digits))； // toFixed() 精度参数须在 0 与20 之间
// 运行
parseFloat((0.1 + 0.2).toFixed(10))//结果为0.3
parseFloat((0.3 / 0.1).toFixed(10)) // 结果为 3  
parseFloat((0.7 * 180).toFixed(10))//结果为126
parseFloat((1.0 - 0.9).toFixed(10)) // 结果为 0.1   
parseFloat((9.7 * 100).toFixed(10)) // 结果为 970 
parseFloat((2.22 + 0.1).toFixed(10)) // 结果为 2.32
Number(parseFloat((2.22 + 0.1).toFixed(10))) // 结果为2.32数字格式

Number(parseFloat((0.2 + 0.1).toPrecision(1)) // 结果为0.3数字格式，toPrecision(位数)设置精度的

var items = [12, 548 ,'a' , 2 , 5478 , 'foo' , 8852, , 'Doe' ,2154 , 119 ];
items.length; // return 11
delete items[3]; // return true
items.length; // return 11
items.splice(3,1) // [2]
items.length; // return 10

var new_array = arr.map(function callback(currentValue[, index[, array]]) {
    // Return element for new_array
}[, thisArg])

// 编写一个程序将数组扁平化去并除其中重复部分数据，最终得到一个升序且不重复的数组
var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10];
// Set的参数可以是数组还可以是伪数组，Infinity是正无穷大，返回不重复数组
// Array.from接受伪数组，返回数组实例
Array.from(new Set(arr.flat(Infinity))).sort((a,b)=>{ return a-b})

var arr = [1,2,3,4]
arr.forEach(item => {
  if(item == 2){ break }
  console.log(item)
})
// Uncaught SyntaxError: Illegal break statement

arr.forEach(item => {
  if(item == 2){ return 22 }
  console.log(item)
})
// 1 3 4

var arr = [1,2,3,4]
arr.test = 'test me'
for(item in arr){
  // 即可以跳出整个循环
  if(item == 2) break 
  // 打印的字符串的key，如果有属性，也会将属性的key打印出来
  console.log(item, typeof(item))
}
// 0 string
// 1 string

// 定义数组后，还可以用
Object.defineProperty(arr,'newKey',{
  value : 'this is newKew value',
  enumerable : true //可枚举，默认false
})
// 此时数组为
[1, 2, 3, 4, newKey: "this is newKew value"]

var arr = {b:'bb' ,a:'aa' ,"3":33 ,'1':11}
for(var item in arr){console.log(item)}
// 1
// 3
// b
// a

var arr1 = [ '2', '1', 'b', 'a']
for(var item of arr1) console.log(item)
// 2 1 b a 

// 1. 元字符(构成正则的基本元素
// 1.1、 . 匹配除换行符(\n),回车(\r),行分隔符(\u2028),段分隔符(\u2029)以外的任意字符  
// 1.2、 \w 匹配包括下划线的任何单词字符，等价于[A-Za-z0-9_]  
// 1.3、 \W 匹配任何非单词字符，等价于[^A-Za-z0-9_]  
// 1.4、 \s 匹配任意的空白符（空格，制表符，换页符）  
// 1.5、 \b 匹配单词的开始或结束(/\ba/.test('ab') ; /a\b/.test('da'))  
// 1.6、 ^ 匹配字符串的开始  
// 1.7、 $ 匹配字符串的结束  

// 利用基本元素可以写简单的正则表达式
\abc或者^abc // 匹配有abc开头的字符串
^\d\d\d\d\d\d\d\d$ // 匹配8位数字的QQ号码
^1\d\d\d\d\d\d\d\d\d\d$ // 匹配1开头11位数字的手机号码


// 2. 重复限定符  
// 2.1、 * 重复0次或更多次  
// 2.2、 + 重复一次或更多次  
// 2.3、 ？重复0次或一次  
// 2.4、 {n}重复n次  
// 2.5、 {n,}重复n次或更多次  
// 2.6、 {n,m}重复n到m次  

// 改造上面的正则表达式
\d{8}$      // 匹配8位数字的QQ号码
^1\d{10}$   // 匹配1开头11位数字的手机号码
^\d{14,18}$ // 匹配14~18位的数字
^ab*$       // 匹配a开头，0个或多个b结尾的字符串

// 注意查看下面的，或许因为数字太大，js引擎在匹配之前做了一层转化
/^1\d{10}/.test(176108358151234567892) // true
/^1\d{10}/.test(1761083581512345678923) // false
console.log(Number(1761083581512345678923)) // 1.7610835815123457e+21
/^1\d{10}/.test(1.7610835815123457e+21) // false


// 3. 分组
// 3.1、 (pattern)匹配pattern并获取这一匹配
// ^(ab)* // 匹配0个或多个ab开头

// 4. 转义
^(\(ab\))*  // 匹配0个或多个(ab)开头


// 5. 条件或符号
5.1 ^(130|131|132|155|156|185|186|145|176)\d{8}$  

// 6. 区间
^((13[0-2])|(15[56])|(18[5-6])|145|176)\d{8}$
// 6.1 限定0-9范围可以为 [0-9]  
// 6.2 限定a-z范围可以为 [a-z]  
// 6.3 限定某些数字 [165]  

// 正则实例对象的几种方法
// 1. exec 在字符串中查找，返回数组(成员是匹配成功的子字符串),未匹配到返回null
// 1-1. exec 在字符串中查找，返回数组(未匹配到返回null)
var s = '_x_x';
var r1 = /x/;
var r2 = /y/;

r1.exec(s) // ["x"]
r2.exec(s) // null

// 1-2. 正则表示式包含圆括号（即含有“组匹配”），则返回的数组会包括多个成员，第一个成员是整个匹配的结果，成员二是圆括号里规则里匹配的内容。。。
//    也就是说，第二个成员对应第一个括号，第三个成员对应第二个括号。
var r = /a(b+)a/;
var arr = r.exec('_abbba_aba_');
arr // ["abbba", "bbb"] // 第一个括号匹配的就是bbb
// 另外返回的数组实例，还有两个属性
arr.index // 1，整个模式匹配成功的开始位置
arr.input // "_abbba_aba_"，整个原字符串

// 利用g修饰符，允许多次匹配
var reg = /a/g;
var str = 'abc_abc_abc'

while(true) {
  var match = reg.exec(str);
  if (!match) break;
  console.log('#' + match.index + ':' + match[0]);
}
// #0:a
// #4:a
// #8:a

// 注意：lastIndex是正则实例的属性

// 2. test 测试是否包含指定字符串，返回true或false
// 2-1. 带有g修饰符，则每一次test方法都从上一次结束的位置开始向后匹配
// 2-2. 带有g修饰符，可通过正则对象的lastIndex属性指定开始搜索的位置。
// 2-3. 正则模式是一个空字符串，则匹配所有字符串

// 3. match 在字符串中查找，返回数组，未匹配到返回null，
// 3-1. 字符串的match与正则的exec相似
// 3-2. 但若带g修饰符，match会一次性返回所有匹配成功的结果
var s = 'abba';
var r = /a/g;

s.match(r) // ["a", "a"]
r.exec(s) // ["a"]
// 3-3. 设置正则表达式的lastIndex，此时无效，始终从0开始

// 4. search 在字符串中查找，返回第一个匹配到的位置索引(失败返回-1)

// 5. replace替换匹配到的值，参数一是正则，参数二是替换的内容
// 5-1. 不加g，替换第一个匹配成功的值。或者替换所有
// 5-2. 参数二可以用美元符号$，用来表示所替换的内容
//   $&：匹配的子字符串。
//   $`：匹配结果前面的文本。
//   $’：匹配结果后面的文本。
//   $n：匹配成功的第n组内容，n是从1开始的自然数。
//   $$：指代美元符号$。
'hello world'.replace(/(\w+)\s(\w+)/, '$2 $1')
// "world hello"

'abc'.replace('b', '[$`-$&-$\']')
// "a[a-b-c]c"，
// 这里匹配结果是b，因此$`表示b的前面，就是a
// 而$\'表示b的后面，也就是c

// 正则匹配手机号，脱敏
var str = "18912341234";
var pat = /(\d{3})\d*(\d{4})/; // 必须带括号，表示分组
var result = str.replace(pat,'$1****$2');
result ;// 189****1234

// 格式化人民币
const FormatMoney = (s)=> {
  if (/[^0-9\.]/.test(s)) return "invalid value";
  s = s.replace(/^(\d*)$/, "$1.");
  s = (s + "00").replace(/(\d*\.\d\d)\d*/, "$1");
  s = s.replace(".", ",");
  var re = /(\d)(\d{3},)/;
  while (re.test(s)) {
    s = s.replace(re, "$1,$2");
  }
  s = s.replace(/,(\d\d)$/, ".$1");
  return  s.replace(/^\./, "0.")
}

// 5-3. 参数二还可以是函数
'3 and 5'.replace(/[0-9]+/g, function (match) {
  return 2 * match;
})
// "6 and 10"

var a = 'The quick brown fox jumped over the lazy dog.';
var pattern = /quick|brown|lazy/ig;

a.replace(pattern, function replacer(match) {
  return match.toUpperCase();
});
// The QUICK BROWN fox jumped over the LAZY dog.


function toHump ( name ) {
  return name.replace( /\_(\w)/g, function ( all, letter ) {
    return letter.toUpperCase();
  } );
}
'hello-world-a'.replace(/-(\w)/g, (all,letter) => {console.log(all,letter)});
// -w w
// -a a

'hello_world-a'.replace(/[-|_](\w)/g, (all,letter) => {return letter.toUpperCase()})
"helloWorldA"

"-a_bc-e_f-".replace(/[-|_](\w)?/g, function(all, letter) {
  return letter ? letter.toUpperCase() : "";
});
"ABcEF"


// 驼峰转换下划线
function toLine ( name ) {
  return name.replace( /([A-Z])/g, "_$1" ).toLowerCase();
}

"aBcDfe".replace(/([A-Z])/g, (all, letter) => {
  return `-${letter.toUpperCase()}`;
});

// 匹配url的query字符串
function getQuery() {
  // 若包含则为true
  let query = ~location.href.indexOf("?") ? location.search.slice(1) : "";
  let reg = /([^&=]+)=?([^&]*)/g;
  let obj = Object.create(null);
  query.replace(reg, function(all, key, val) {
    // all是完全匹配的字符串，key是组一，val是组二
    // 防止浏览器编码
    obj[decodeURIComponent(key)] = decodeURIComponent(val);
  });
  return obj;
}

// 6. split 在字符串中查找指定字符，并且以指定字符切割字符串，返回切割后的字符串数组(不含被切字符)
// 6-1. 参数一时正则，参数二是返回数组的最大成员数量
// 非正则分隔
'a,  b,c, d'.split(',')
// [ 'a', '  b', 'c', ' d' ]

// 正则分隔，去除多余的空格
'a,  b,c, d'.split(/, */)
// [ 'a', 'b', 'c', 'd' ]

// 指定返回数组的最大成员
'a,  b,c, d'.split(/, */, 2)
[ 'a', 'b' ]

// 例一
'aaa*a*'.split(/a*/)
// [ '', '*', '*' ]
// 例一的第一个分隔符是aaa，第二个分割符是a，将字符串分成三个部分，包含开始处的空字符串

// 例二
'aaa**a*'.split(/a*/)
// ["", "*", "*", "*"]
// 例二的第一个分隔符是aaa，第二个分隔符是0个a（即空字符），第三个分隔符是a，所以将字符串分成四个部分。

// 如果正则表达式带有括号，则括号匹配的部分也会作为数组成员返回。
'aaa*a*'.split(/(a*)/)
// [ '', 'aaa', '*', 'a', '*' ]

// 7. 贪婪模式
var s = 'aaa';
s.match(/a+/) // ["aaa"]
// 上面代码中，模式是/a+/，表示匹配1个a或多个a，那么到底会匹配几个a呢？
// 因为默认是贪婪模式，会一直匹配到字符a不出现为止，所以匹配结果是3个a。

// 如果想将贪婪模式改为非贪婪模式，可以在量词符后面加一个问号。
var s = 'aaa';
s.match(/a+?/) // ["a"]
// 模式结尾添加了一个问号/a+?/，这时就改为非贪婪模式，一旦条件满足，就不再往下匹配。
// 除了非贪婪模式的加号，还有非贪婪模式的星号（*）。
// *?：表示某个模式出现0次或多次，匹配时采用非贪婪模式。
// +?：表示某个模式出现1次或多次，匹配时采用非贪婪模式。

function formatNumber(val) {
  var num = val + '';
  var str = '';
  var ret = num.split('.');
  
  if (ret[0] !== undefined) {
    // \B是非单词边界，这里没有意义
    str = ret[0].replace(/\B(?=(?:\d{3})+$)/g, ',');
    if (ret[1]) {
      str += '.' + ret[1];
    }
  }
  return str;
}


// 8. 组匹配
// 正则表达式的括号表示分组匹配，括号中的模式可以用来匹配分组的内容
/fred+/.test('fredd');       // true
/(fred)+/.test('fredfred');  // true

var m = 'abcabc'.match(/(.)b(.)/);
m ;// ['abc', 'a', 'c']
// 正则表达式/(.)b(.)/一共使用两个括号，第一个括号捕获a，第二个括号捕获c。
// 使用组匹配，不宜使用g修饰符，否则match方法不会捕获分组的内容。
var m = 'abcabc'.match(/(.)b(.)/g);
m ;// ['abc', 'abc']

// 可以用\n引用括号匹配的内容，n是从1开始的自然数，表示对应顺序的括号。
/(.)b(.)\1b\2/.test("abcabc");
// true
// \1表示第一个括号匹配的内容（即a），\2表示第二个括号匹配的内容（即c）。

/y(..)(.)\2\1/.test('yabccab') // true，此时\2就是c,\1就是ab

/y((..)\2)\1/.test('yabababab') // true
// 面代码中，\1指向外层括号，\2指向内层括号。

//  8-1. 组匹配之非捕获组
// (?:x)称为非捕获组，表示不返回该组匹配的内容，即匹配的结果中不计入这个括号。
// 使用场景，假定需要匹配foo或者foofoo，正则表达式就应该写成/(foo){1, 2}/
// 但这样就会占用一个组匹配。这时就可以这样：/(?:foo){1, 2}/

var m1 = 'abc'.match(/(.)b(.)/);
m1; // ["abc", "a", "c"]
var m = 'abc'.match(/(?:.)b(.)/);
m // ["abc", "c"]
// 使用非捕获组，所以最终返回的结果中就没有第一个括号。

// x(?=y)称为先行断言，x只有在y前面才匹配，y不会被计入返回结果。
var m = 'abc'.match(/b(?=c)/);
m // ["b"]
var m = 'abc'.match(/b(c)/);
m // ["bc", "b"]

// x(?!y)称为先行否定断言，x只有不在y前面才匹配，y不会被计入返回结果。
/\d+(?!\.)/.exec('3.14') // ["14"]