一次性搞清楚element-ui里用到this._l()是什麼意思

參考 https://segmentfault.com/q/1010000017896162/a-1020000017896676

查看Vue.js的源碼,可以看到如下兩段代碼

  function installRenderHelpers (target) {
    target._o = markOnce;
    target._n = toNumber;
    target._s = toString;
    target._l = renderList;
    target._t = renderSlot;
    target._q = looseEqual;
    target._i = looseIndexOf;
    target._m = renderStatic;
    target._f = resolveFilter;
    target._k = checkKeyCodes;
    target._b = bindObjectProps;
    target._v = createTextVNode;
    target._e = createEmptyVNode;
    target._u = resolveScopedSlots;
    target._g = bindObjectListeners;
  }

renderList 的函數,從代碼的意思上看類似val.map(render)
意思是通過render函數(自定義的函數)處理數組val,然後返回一個新的數組

function renderList ( val, render ) {
  var ret, i, l, keys, key;
  if (Array.isArray(val) || typeof val === 'string') {
    ret = new Array(val.length);
    for (i = 0, l = val.length; i < l; i++) {
      ret[i] = render(val[i], i);
    }
  } else if (typeof val === 'number') {
    ret = new Array(val);
    for (i = 0; i < val; i++) {
      ret[i] = render(i + 1, i);
    }
  } else if (isObject(val)) {
    keys = Object.keys(val);
    ret = new Array(keys.length);
    for (i = 0, l = keys.length; i < l; i++) {
      key = keys[i];
      ret[i] = render(val[key], key, i);
    }
  }
  if (!isDef(ret)) {
    ret = [];
  }
  (ret)._isVList = true;
  return ret
}

在Vue項目的
render函數里打印this
render (h) {
console.log(this)
}

其中_l的藏在
Proxy.Target.__proto__的__proto__的屬性
在created函數里打印this
created () {
console.log(this)
}
其中_l的藏在
VueCompnent.__proto__的__proto__的屬性