vue的源碼解析(內部定義及配置)

SSR_ATTR

var SSR_ATTR = 'data-server-rendered';
這邊有個vue SSR的定義。服務端渲染,後面在6446行纔有。看到了單獨給他寫一篇。

ASSET_TYPES

var ASSET_TYPES = [
    'component',
    'directive',
    'filter'
];
組件能夠擁有的資產類型列表,這邊有幾個過濾器,自定義,組件的定義,後面看到後打錨點

LIFECYCLE_HOOKS

var LIFECYCLE_HOOKS = [
    'beforeCreate',
    'created',
    'beforeMount',
    'mounted',
    'beforeUpdate',
    'updated',
    'beforeDestroy',
    'destroyed',
    'activated',
    'deactivated',
    'errorCaptured',
    'serverPrefetch'
];
生命週期的鉤子。。。依舊留個錨點

config

var config = ({
    optionMergeStrategies: Object.create(null),
    //是否發出警告
    silent: false,
     //啓動時顯示生產模式提示消息
    productionTip: "development" !== 'production',
    //是否啓用devtools
    devtools: "development" !== 'production',
    //是否記錄性能
    performance: false,
    //用於監視程序錯誤的錯誤處理程序
    errorHandler: null,
    //用於監視程序警告的警告處理程序
    warnHandler: null,
    //忽略某些自定義元素
    ignoredElements: [],
    //v-on爲自定義用戶關鍵字 
    keyCodes: Object.create(null),

    //檢查是否保留了標記,以便不能將其註冊爲組件。  
    isReservedTag: no,
    //檢查是否保留了屬性,以便它不能用做組件屬性。
    isReservedAttr: no,
    //檢查標記是否爲未知元素。
    isUnknownElement: no,
    //獲取元素的名稱空間
    getTagNamespace: noop,
    //解析特定平臺的實際標記名稱
    parsePlatformTagName: identity,
    //檢查屬性是否必須使用屬性(例如value)綁定
    mustUseProp: no,
    //異步執行更新。用於Vue測試Utils,若是設置爲false,這將顯著下降性能
    async: true,
    //因爲遺留緣由而暴露
    _lifecycleHooks: LIFECYCLE_HOOKS
  });

Unicode正則表達式

var unicodeRegExp = /a-zA-Z\u00B7\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u037D\u037F-\u1FFF\u200C-\u200D\u203F-\u2040\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD/;
用於分析HTML標記、組件名稱和屬性路徑的Unicode字母

isReserved

function isReserved (str) {
  var c = (str + '').charCodeAt(0);
  return c === 0x24 || c === 0x5F
}
檢查字符串開頭是否爲 $ 或 _ ASCII
charCodeAt() 方法可返回指定位置的字符的 Unicode 編碼。這個返回值是 0 - 65535 之間的整數。
十進制 十六進制 字符
36 0x24 $
95 0x5F _

def

function def (obj, key, val, enumerable) {
    Object.defineProperty(obj, key, {
      value: val,
      enumerable: !!enumerable,
      writable: true,
      configurable: true
    });
  }
定義屬性,其中!!強制轉換 boolean

parsePath

var bailRE = new RegExp(("[^" + (unicodeRegExp.source) + ".$_\\d]"));
  function parsePath (path) {
    if (bailRE.test(path)) {
      return
    }
    var segments = path.split('.');
    return function (obj) {
      for (var i = 0; i < segments.length; i++) {
        if (!obj) { return }
        obj = obj[segments[i]];
      }
      return obj
    }
  }

解析簡單的路徑。vue

首先定義了一個正則。其中source屬性返回一個字符串,該字符串包含regexp對象的源文本,而且它不包含兩邊的兩個正斜槓和任何標誌。
test() 方法檢查字符串是否匹配bailRE
segments將path用split分割成字符串數組,一個循環(obj)是什麼?

UA

var hasProto = '__proto__' in {};

  var inBrowser = typeof window !== 'undefined';
  var inWeex = typeof WXEnvironment !== 'undefined' && !!WXEnvironment.platform;
  var weexPlatform = inWeex && WXEnvironment.platform.toLowerCase();
  var UA = inBrowser && window.navigator.userAgent.toLowerCase();
  var isIE = UA && /msie|trident/.test(UA);
  var isIE9 = UA && UA.indexOf('msie 9.0') > 0;
  var isEdge = UA && UA.indexOf('edge/') > 0;
  var isAndroid = (UA && UA.indexOf('android') > 0) || (weexPlatform === 'android');
  var isIOS = (UA && /iphone|ipad|ipod|ios/.test(UA)) || (weexPlatform === 'ios');
  var isChrome = UA && /chrome\/\d+/.test(UA) && !isEdge;
  var isPhantomJS = UA && /phantomjs/.test(UA);
  var isFF = UA && UA.match(/firefox\/(\d+)/);
  var nativeWatch = ({}).watch;
這個太基礎了,很少解釋了。若是須要能夠百度一下userAgent
相關文章
相關標籤/搜索