博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
[转] js中的钩子机制(hook)
阅读量:5890 次
发布时间:2019-06-19

本文共 2280 字,大约阅读时间需要 7 分钟。

什么是钩子机制?使用钩子机制有什么好处? 

钩子机制也叫hook机制,或者你可以把它理解成一种匹配机制,就是我们在代码中设置一些钩子,然后程序执行时自动去匹配这些钩子;这样做的好处就是提高了程序的执行效率,减少了if else 的使用同事优化代码结构。由于js是单线程的编程语言,所以程序的运行效率在前端开发是比较重要的,在开发中我们秉承如果能用switch case 的地方就不要用if else 可以用hook实现的尽量使用hook机制去实现。 
这里我们举一个例子看一下: 
例如我们在向后台进行ajax请求的时候,后台经常会返回我们一些常见的错误码,如:001代表用户不存在,002代表用户密码输入错误。003代表用户被锁定。这个时候我们要将错误友好的提示给用户。这个时候我们该怎样实现呢? 
一般的写法可能是:

$.ajax(option,function(result){    var errCode = result.errCode ;//错误码 if(errCode){ if(errCode =='001'){ alert("用户不存在") }else if(errCode =='002'){ alert("密码输入错误") }else if(errCode =='003'){ alert("用户被锁定") } }else{ //登录成功 } },function(err){ })

这样写其实是比较low低,稍微有点经验的可能会使用switch case来实现,但是这个两种写法都无法避免一个问题就是如果我的错误码特别多,那得写多少个if else和case 啊?但是如果使用hook写法的话就会简单好多, 

首先我们先声明一个错误码钩子列表

var codeList  = {   "001":"用户不存在",   "002":"密码输入错误", "003":"用户被锁定" } $.ajax(option,function(result){ var errCode = result.errCode ;//错误码 if(!errCode){ alert(codeList[errCode]); }else{ //登录成功 } },function(err){ })

这样写的话代码结构更加清楚明了。这个例子是最简单的应用了的了。在Jquery 中hook机制被大量的使用,这里我们就Jquery中判断变量类型的type方法来具体看一下 

通常我们在js中判断一个变量的数据类型?首先会想到type of 和 instanceof 
如果是基本类型我们可以直接使用typeof,但是这种方式只能判断基本数据类型,如果是对象,它返回结果都市Object,如果变量是null它返回的也是Object。这个时候我们要准确的判断一般的写法可能会是:

function type(obj){      var type = ""; if(obj==null){ type = null; }else{ type = obj.a.constructor.toString().split("(")[0].split(" ")[1] } return type; }

在jquery中的实现是:

var class2type={};var toString = Object.prototype.toString;jQuery.each("Boolean Number String Function Array Date RegExp Object Error Symbol",function(index,name){ class2type["Object"+" name"]==name.toLowerCase(); }) type:function(obj){ if(obj==null){ return obj+""; } return typeof obj =="Object"||typeof obj ==="function"?class2type[toString.call(obj)]|||"object":typeof obj }

上面代码中 

class2type = { ‘[object Boolean]’: ‘boolean’, ‘[object Number]’: ‘number’, ‘[object String]’: ‘string’, ‘[object Function]’: ‘function’, ‘[object Undefined]’: ‘undefined’, ‘[object Null]’: ‘null’, ‘[object Array]’: ‘array’, ‘[object Date]’: ‘date’, ‘[object RegExp]’: ‘regexp’, ‘[object Object]’: ‘object’, ‘[object Error]’: ‘error’}; 
设置一个类型钩子对象 
toString.call(obj)就是Object.prototype.toString.call(arg)来细致判断obj的类型。在这里则转换成对象对应索引是否在class2type 中存在相应value,若存在则返回value判断,若不存在则返回object类型。 
这样就实现了类型的判断。

转载于:https://www.cnblogs.com/chris-oil/p/8577337.html

你可能感兴趣的文章
C#获取磁盘列表与信息
查看>>
mysql学习笔记4---mysql 复制---源代码
查看>>
Linux设备驱动之semaphore机制【转】
查看>>
每天一个linux命令(25):linux文件属性详解
查看>>
【android】getDimension()、getDimensionPixelOffset()和getDimensionPixelSize()区别详解
查看>>
HDU 3280 Equal Sum Partitions(二分查找)
查看>>
第一个之出现一次的字符
查看>>
go微服务框架go-micro深度学习(三) Registry服务的注册和发现
查看>>
expectFAQ(附一个python批量任务脚本)--持续更新
查看>>
HDU 2492 Ping pong
查看>>
JPA的Embeddable注解
查看>>
Maven在Eclipse中的实用小技巧
查看>>
步步为营Hibernate全攻略(一)构建Hibernate框架环境
查看>>
【开放源代码】【谐波数据生成器】【上位机软件】(版本:0.00)
查看>>
Hibernate基础-HelloWord
查看>>
提高查询速度方法总结
查看>>
Android开发指南(30) —— Multimedia and Camera
查看>>
在Android中使用mkdir在sdcard中创建文件夹出错
查看>>
nova network工作原理及配置
查看>>
SQL语句AND 和 OR执行的优先级
查看>>