Vue 2 源码中的工具函数——判断型函数

‍最近看了一下vue2相关的工具函数源码，写了一些学习总结。

如果有写的不合适的地方，欢迎大家留言指出~

一、判断型函数

1. emptyObject

• Object.freeze({}); 冻结对象，即对象的第一层不能修改。

var emptyObject = Object.freeze({});
复制

2. isUndef   判断变量是 未定义

function isUndef (v) {
    return v === undefined || v === null
}

eg:
isUndef(undefined)   
// true
isUndef(null)        
// true
isUndef(123)         
//false
isUndef('hello')     
// false
复制

3. isDef   判断变量是 已定义

• 和上述判断正好相反。

 function isDef (v) {
    return v !== undefined && v !== null
 }
复制

4. isTrue  判断变量是否未true。

function isTrue (v) {
    return v === true
}
复制

5. isFalse  判断变量是否未false。

function isFalse (v) {
    return v === false
}
复制

6. isPrimitive  判断变量试是否是 原始数据类型

• primitive: 原始，初始；

原始数据类型：string  number symbol  boolean

  function isPrimitive (value) {
    return (
      typeof value === 'string' ||
      typeof value === 'number' ||
      // $flow-disable-line
      typeof value === 'symbol' ||
      typeof value === 'boolean'
    )
  }

eg:
isPrimitive('12')
// true
isPrimitive(12)
// true
isPrimitive(false)
// true
isPrimitive([])
// false
isPrimitive({})
// false
复制

7. isObject  判断是否是一个对象 || 数组 类型

• 不是严格判断 变量是否为object。

function isObject (obj) {
  return obj !== null && typeof obj === 'object'
}

eg：
isObject({x: 123})
// true
isObject([1,2,3])
// true
isObject(function() {})
// false
isObject('')
// false
isObject(123)
// false
复制

8. isPlainObject  判断是否为 纯对象

function isPlainObject (obj) {
  return _toString.call(obj) === '[object Object]'
}

eg:
isPlainObject({})
// true
isPlainObject([])
// false
isPlainObject('')
// false
复制

9. toRawType   获取原始数据类型。

Tip ：Object.prototype.toString()
， 表示返回一个表示该对象的字符串

• 每个object都会有一个toString()方法，默认返回的是 [object type]，type 是当前obj的类型。

  let obj = { name: 123 };
  
  obj.toString()  
  // [object Object]
  复制

• 如果想重写obj上的默认toString()方法，可以

  obj.prototype.toString = function resetToString () {
      return hello ${this.name}
  }
  复制

• 使用 Object.prototype.toString 结合 call 或 apply 进行类型判断

  Object.prototype.toString.call(new Date)  
  // '[object Date]'
  Object.prototype.toString.call(Math)  
  // '[object Math]'
  Object.prototype.toString.call(undefined)  
  // '[object Undefined]'
  Object.prototype.toString.call(null)  
  // '[object Null]'
  复制

参考：Object.prototype.toString() mdn

• toRawType 得到val的类型

  Object.prototype.toString.call(val).slice(8, -1)
  复制

10. isRegExp  判断是否是正则表达式

function isRegExp (v) {
  return _toString.call(v) === '[object RegExp]'
}

eg:
isRegExp(/hello/)
// true
复制

11. isValidArrayIndex  判断是否是可用的数组索引值

function isValidArrayIndex (val) {
  var n = parseFloat(String(val));
  return n >= 0 && Math.floor(n) === n && isFinite(val)
}
复制

parseFloat :  解析一个参数（必要时先转换为字符串）并返回一个浮点数。parseFloat mdn

isFinite :  判断被传入的参数值是否为一个有限数值。isFinite mdn

parseFloat('hello')
// NaN
parseFloat(12.34)
// 12.34
复制

isFinite(100)
// true
isFinite(10/3)
// true
isFinite('0')
// true
isFinite(2e12)
// true
isFinite(Infinity)
// false
复制

12. isPromise  判断是否是 promise

function isPromise (val) {
  return (
    isDef(val) &&
    typeof val.then === 'function' &&
    typeof val.catch === 'function'
  )
}

eg:
const test = new Promise((resolve, reject) => {
    resolve('hello world')
})

isPromise(test)
// true
复制

13. makeMap

• 输入一个以 , 分割的字符串，生成一个map对象；

• 输出一个检测key值不在map中的函数；

• expectsLowerCase: 是否要转化为小写

  function makeMap (
   str,
   expectsLowerCase
  ) {
      var map = Object.create(null);
      var list = str.split(',');
      for (var i = 0; i < list.length; i++) {
          map[list[i]] = true;
      }
      return expectsLowerCase
          ? function (val) { return map[val.toLowerCase()]; }
      : function (val) { return map[val]; }
  }
  复制

14. isBuiltInTag    是否是内置的tag

var isBuiltInTag = makeMap('slot,component', true);

eg:
isBuiltInTag('slot') // true
isBuiltInTag('component') // true
isBuiltInTag('Slot') // true
isBuiltInTag('Component') // true
复制

15. isReservedAttribute  查看这个属性是否存在

var isReservedAttribute = makeMap('key,ref,slot,slot-scope,is');

isReservedAttribute('key') // true
isReservedAttribute('ref') // true
isReservedAttribute('slot') // true
isReservedAttribute('slot-scope') // true
isReservedAttribute('is') // true
isReservedAttribute('IS') // undefined  大小写
复制