TypeScript判断对象类型的4种方式代码
更新时间:2023年07月22日 11:08:54 作者:苍穹之跃
这篇文章主要给大家介绍了关于TypeScript判断对象类型的4种方式代码,TypeScript能根据一些简单的规则推断(检查)变量的类型,你可以通过实践很快的了解它们,需要的朋友可以参考下
一、typeof
typeof ""; //string typeof 1; //number typeof false; //boolean typeof undefined; //undefined typeof function(){}; //function typeof {}; //object typeof Symbol(); //symbol typeof null; //object typeof []; //object typeof new Date(); //object typeof new RegExp(); //object
二、instanceof
{} instanceof Object; //true [] instanceof Array; //true [] instanceof Object; //true "123" instanceof String; //falsenew String(123) instanceof String; //true
三、constructor
function instance(left,right){ let prototype = right.prototype; //获取类型的原型 let proto = left.__proto__; //获取对象的原型 while(true){ //循环判断对象的原型是否等于类型的原型,直到对象原型为null,因为原型链最终为null if (proto === null || proto === undefined){ return false; } if (proto === prototype){ return true; } proto = proto.__proto__; } } console.log(instance({},Object)); //true console.log(instance([],Number)); //false
四、Object.prototype.toString()
function getType(obj){ let type = typeof obj; if(type != "object"){ return type; } return Object.prototype.toString.call(obj).replace(/^\[object (\S+)\]$/, '$1'); }
使用案例:
<!--src/App.vue--> <script setup lang="ts"> const vFocus = { mounted: (el: HTMLElement, binding: any) => { // 指令绑定的元素 console.log(typeof el); console.log(el); // 指令绑定的参数 console.log(binding) // 如果是输入框 if (el instanceof HTMLInputElement) { // 元素聚焦 el.focus(); el.placeholder = '请输入'; el.value = '勤奋、努力' }else if (el instanceof HTMLAnchorElement) { // 如果是<a>标签我们就导向 百度翻译 el.href='https://fanyi.baidu.com/' } } } </script> <template> <input v-focus/> <p/> <a v-focus href="https://www.baidu.com/" rel="external nofollow" >百度一下,你就知道</a> </template>
总结
相关文章
Bootstrap框架结合jQuery仿百度换肤功能实例解析
这篇文章主要为大家详细介绍了Bootstrap框架结合jQuery仿百度换肤功能实现代码解析,具有一定的参考价值,感兴趣的小伙伴们可以参考一下2016-09-09
最新评论