TypeScript判斷對象類型的4種方式代碼
更新時間：2023年07月22日 11:08:54 作者：蒼穹之躍
這篇文章主要給大家介紹了關于TypeScript判斷對象類型的4種方式代碼,TypeScript能根據(jù)一些簡單的規(guī)則推斷(檢查)變量的類型,你可以通過實踐很快的了解它們,需要的朋友可以參考下
一、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){ //循環(huán)判斷對象的原型是否等于類型的原型，直到對象原型為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);
// 指令綁定的參數(shù)
console.log(binding)
// 如果是輸入框
if (el instanceof HTMLInputElement) {
// 元素聚焦
el.focus();
el.placeholder = '請輸入';
el.value = '勤奮、努力'
}else if (el instanceof HTMLAnchorElement) {
// 如果是<a>標簽我們就導向 百度翻譯
el.
}
}
}
</script>
<template>
<input v-focus/>
<p/>
<a v-focus rel="external nofollow" >百度一下，你就知道</a>
</template>
總結(jié)
相關文章
原生js實現(xiàn)addClass,removeClass,hasClass方法
這篇文章主要介紹了原生js實現(xiàn)addClass,removeClass,hasClass方法和使用原生JS實現(xiàn)jQuery的addClass, removeClass, hasClass函數(shù)功能,需要的朋友可以參考下2016-04-04
js實現(xiàn)把圖片的絕對路徑轉(zhuǎn)為base64字符串、blob對象再上傳
本文主要介紹了JavaScript把項目本地的圖片或者圖片的絕對路徑轉(zhuǎn)為base64字符串、blob對象再上傳的方法，具有一定的參考價值，需要的朋友一起來看下吧2016-12-12
這篇文章主要介紹了JavaScript過濾字符串中的中文與空格方法匯總 的相關資料,需要的朋友可以參考下2016-03-03
JavaScript實現(xiàn)選擇框按比例拖拉縮放的方法
這篇文章主要介紹了JavaScript實現(xiàn)選擇框按比例拖拉縮放的方法,具有等比例縮放及設置最小范圍等功能,涉及javascript事件的添加、監(jiān)聽、頁面元素動態(tài)操作及鼠標事件的響應等技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08
這篇文章主要介紹了簡單的js圖片輪換代碼(js圖片輪播),需要的朋友可以參考下2014-05-05
數(shù)組去重，一般需求是給你一個數(shù)組，調(diào)用去重方法，返回數(shù)值副本，副本中沒有重復元素。下面腳本之家小編給大家?guī)砹薺s數(shù)組去重的多種方法，非常不錯，需要的朋友參考下2017-09-09
這篇文章主要介紹了微信小程序 生成攜帶參數(shù)的二維碼,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值2019-10-10
使用JS實現(xiàn)鼠標放上圖片進行放大離開實現(xiàn)縮小功能
這篇文章主要介紹了使用JS實現(xiàn)鼠標放上圖片進行放大離開實現(xiàn)縮小功能,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2021-01-01
這篇文章介紹了判斷輸入是否為空,獲得輸入類型的JS代碼，有需要的朋友可以參考一下2013-10-10
這篇文章主要給大家介紹了關于uniapp?h5如何獲取用戶地理位置信息的相關資料,文中主要使用高德地圖,這里主要講h5實現(xiàn)獲取地理位置信息并定位功能,需要的朋友可以參考下2023-08-08