vue源码中的检测方法的实现

判断是否为undefined或null

const isDef = (v) => {
return v !== undefined && v !== null
}

判断是否为Promise 函数

const isPromise = (val) => {
return (
val !== undefine &&
typeof val.then === 'function' &&
typeof val.catch === 'function'
)
}

判断是否为简单数据类型

const isPrimitive (value) => {
return (
typeof value === 'string' ||
typeof value === 'number' ||
typeof value === 'symbol' ||
typeof value === 'boolean'
)
}

严格检查复杂数据类型

const isPlainObject = (obj) => {
return Object.prototype.toString.call(obj) === '[object Object]'
}

const isRegExp = (v) => {
return Object.prototype.toString.call(v) === '[object RegExp]'
}

将驼峰字符串转成连接符 magicEightTall 转换成 magic-eight-tall

const hyphenateRE = /\B([A-Z])/g
const hyphenate = (str) => {
return str.replace(hyphenateRE, '-$1').toLowerCase()
}

将连接符转成驼峰字符串 magic-eight-tall 转换成 magicEightTall

const camelizeRE = /-(\w)/g
const camelize = (str) => {
return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : '')
}

如果不想重复转换，可用以下方法调用转换函数

const cached = (fn) => {
const cache = Object.create(null)
console.log(cache);
return ((str) => {
const hit = cache[str]
return hit || (cache[str] = fn(str))
})
};

例

const camelize = cached((str) => {
return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : '')
})

以上就是本文的全部内容，希望对大家的学习有所帮助

您可能感兴趣的文章:

• 在Vue项目中取消ESLint代码检测的步骤讲解
• vue检测对象和数组的变化分析
• Vue不能检测到Object/Array更新的情况的解决
• 关于vue的语法规则检测报错问题的解决
• 去掉vue 中的代码规范检测两种方法(Eslint验证)
• 解决Vue不能检测数组或对象变动的问题
• vue将对象新增的属性添加到检测序列的方法
• 关于vue中watch检测到不到对象属性的变化的解决方法
• vue中遇到的坑之变化检测问题（数组相关）
• Vue.js中数组变动的检测详解