Vue 源码解析之工具方法
人生代码
共 7873字,需浏览 16分钟
·
2021-03-14 07:56
如何定义一个空对象
const emptyObject = Object.freeze({})
isUndef
检测 undefined
, null
function isUndef (v) {
return v === undefined || v === null
}
isDef
检测非 undefined
, null
function isDef (v) {
return v !== undefined && v !== null
}
isTrue
检测 true
function isTrue (v) {
return v === true
}
isFalse
检测 false
function isFalse (v) {
return v === false
}
isPrimitive
检测值是否是 Primitive
function isPrimitive (value) {
return (
typeof value === 'string' ||
typeof value === 'number' ||
// $flow-disable-line
typeof value === 'symbol' ||
typeof value === 'boolean'
)
}
isObject
检测对象
export function isObject (obj) {
return obj !== null && typeof obj === 'object'
}
toRawType
const _toString = Object.prototype.toString
export function toRawType (value) {
return _toString.call(value).slice(8, -1)
}
isPlainObject
export function isPlainObject (obj) {
return _toString.call(obj) === '[object Object]'
}
isRegExp
检测是否是正则表达式 export function isRegExp (v) { return _toString.call(v) === '[object RegExp]' }
isValidArrayIndex
检测数组下标是否越界
export function isValidArrayIndex (val) {
const n = parseFloat(String(val))
return n >= 0 && Math.floor(n) === n && isFinite(val)
}
isPromise
export function isPromise (val) {
return (
isDef(val) &&
typeof val.then === 'function' &&
typeof val.catch === 'function'
)
}
toString
export function toString (val) {
return val == null
? ''
: Array.isArray(val) || (isPlainObject(val) && val.toString === _toString)
? JSON.stringify(val, null, 2)
: String(val)
}
toNumber
export function toNumber (val) {
const n = parseFloat(val)
return isNaN(n) ? val : n
}
makeMap
export function makeMap (
str,
expectsLowerCase
) {
const map = Object.create(null)
const list: Array<string> = str.split(',')
for (let i = 0; i < list.length; i++) {
map[list[i]] = true
}
return expectsLowerCase
? val => map[val.toLowerCase()]
: val => map[val]
}
isBuiltInTag
export const isBuiltInTag = makeMap('slot,component', true)
isReservedAttribute
export const isReservedAttribute = makeMap('key,ref,slot,slot-scope,is')
remove
export function remove (arr, item) {
if (arr.length) {
const index = arr.indexOf(item)
if (index > -1) {
return arr.splice(index, 1)
}
}
}
hasOwn
const hasOwnProperty = Object.prototype.hasOwnProperty
export function hasOwn (obj, key) {
return hasOwnProperty.call(obj, key)
}
cached
export function cached(fn) {
const cache = Object.create(null)
return (function cachedFn (str) {
const hit = cache[str]
return hit || (cache[str] = fn(str))
}: any)
}
camelize
驼峰化
const camelizeRE = /-(\w)/g
export const camelize = cached((str) => {
return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : '')
})
capitalize
export const capitalize = cached((str) => {
return str.charAt(0).toUpperCase() + str.slice(1)
})
hyphenate
const hyphenateRE = /\B([A-Z])/g
export const hyphenate = cached((str) => {
return str.replace(hyphenateRE, '-$1').toLowerCase()
})
bind
function polyfillBind (fn, ctx) {
function boundFn (a) {
const l = arguments.length
return l
? l > 1
? fn.apply(ctx, arguments)
: fn.call(ctx, a)
: fn.call(ctx)
}
boundFn._length = fn.length
return boundFn
}
function nativeBind (fn, ctx) {
return fn.bind(ctx)
}
export const bind = Function.prototype.bind
? nativeBind
: polyfillBind
toArray
将类似 array 转成真正的数组
export function toArray (list, start) {
start = start || 0
let i = list.length - start
const ret: Array<any> = new Array(i)
while (i--) {
ret[i] = list[i + start]
}
return ret
}
extend
export function extend (to, _from) {
for (const key in _from) {
to[key] = _from[key]
}
return to
}
toObject
/**
Merge an Array of Objects into a single Object. */
export function toObject (arr) {
const res = {}
for (let i = 0; i < arr.length; i++) {
if (arr[i]) {
extend(res, arr[i])
}
}
return res
}
noop
占位函数
export function noop (a, b, c) {}
no
/**
* Always return false.
*/
export const no = (a, b, c) => false
identity
/**
* Return the same value.
*/
export const identity = (_) => _
once
/**
* Ensure a function is called only once.
*/
export function once (fn: Function): Function {
let called = false
return function () {
if (!called) {
called = true
fn.apply(this, arguments)
}
}
}
评论