1.判断一个数据的数据类型
Vue源码片段:
const _toString = Object.prototype.toString;
function toRawType (value) {
return _toString.call(value).slice(8, -1)
}
利用Object.prototype.toString判断数据的数据类型,他的返回值是[object Object],截取(8,-1),剩下的正好是数据类型
2.多层3元运算符的(习惯)
Vue源码片段(类似的很多):
function toString (val) {
return val == null
? ''
: Array.isArray(val) || (isPlainObject(val) && val.toString === _toString)
? JSON.stringify(val, null, 2)
: String(val)
}
//还有下面这一段,要能快速的读出三元要表达的意思,毕竟喜欢这样写的人不少
/* istanbul ignore next */
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)
}
这种多层的三元接在一起,要用整体的思维来读,将一个三元看成一个整体,由里到外,这样解读。
3.制作一个映射关系来检查关键kEY是否在映射中
Vue源码:
/**
* Make a map and return a function for checking if a key
* is in that map.
*/
function makeMap (
str,
expectsLowerCase
) {
// 创造一个原型为空的对象,他的身上可没有object 的属性和方法
const map = Object.create(null);
const list = str.split(','); // [a,b,c,d,e,f]
for (let i = 0; i < list.length; i++) {
map[list[i]] = true;
}
// 可以迎来判断一个字符串是否在另一个字符串里(以逗号为分割)
return expectsLowerCase
? val => map[val.toLowerCase()]
: val => map[val]
}
//在对象中,通过键名来查找属性是最快的,map相当于一个容器,减少变量的声名(自带去重功能)
拓展一下:如何最快的将一个数组中的对象中的中文键,换成另外一组英文键,值不变?(重点)
//这是映射关系
// const mapInfo = {
// '入职日期': 'timeOfEntry',
// '手机号': 'mobile',
// '姓名': 'username',
// '转正日期': 'correctionTime',
// '工号': 'workNumber',
// '部门': 'departmentName',
// '聘用形式': 'formOfEmployment'
// }
transExcel(results) {
return results.map(zhObj => {
const enObj = {} // enObj: {'timeOfEntry': 44505}
// 1. 拿到所有的中文 key
// Object.keys() 获取对象所有的属性名
// zhKeys: ['入职日期', '姓名', '工号', '手机号', '转正日期', '部门']
const zhKeys = Object.keys(zhObj)
// 2. 将中文 key 转为英文 key
// console.log(zhKeys)
zhKeys.forEach(zhKey => {
// 根据入职日期中文, 取出对应的英文 timeOfEntry
const enKey = importMapInfo.mapInfo[zhKey]
// 3. 拼装成英文对象,直接通过键赋值的方法
enObj[enKey] = zhObj[zhKey]
})
return enObj
})
}
//这样操作是效率最快的,没有之一(我司大大说的)
4.拓展知识点:柯里化函数
柯里化函数:把接收多个参数的函数变成一个可以接收单一参数的函数,并且返回接受余下的参数并返回结果的新函数”
举个例子:add(1)(2)(3)(4) == add(1,2,3,4) //柯里化函数 特点:
- add(1)返回一个函数
- add(1,2,3,4)返回一个数据 如何操作??? 上代码··
function add (a, b, c, d) {
return [
...arguments
].reduce((prev, item) => prev + item)
}
//
function currying (fn) {
//关键代码,可以得到函数形参的个数
let len = fn.length
let args = []
//关键代码
return function _c (...newArgs) {
// 合并参数
args = [
...args,
...newArgs
]
// 判断当前参数集合args的长度是否 < 目标函数fn的需求参数长度
if (args.length < len) {
// 继续返回函数(细节)
return _c
} else {
// 只有当args.length>4返回函数调用(细节)
return fn.apply(this, args.slice(0, len))
}
}
}
let addCurry = currying(add)
let total = addCurry(1)(2)(3)(4) // 同时支持addCurry(1)(2, 3)(4)该方式调用
console.log(total) // 10
这段代码看不懂可以私信我,包教会,学不会地址发你过来砍我···