前端全棧工程化開發專題 資料型別檢測專題

2021-09-11 14:35:17 字數 4797 閱讀 1175

檢測資料型別

typeof

用來檢測資料型別的運算子

語法:typeof[value]

返回結果:首先是乙個字串,字串中包含了我們需要檢測的資料型別

typeof 12 => 'number'

typeof nan => 'number'

typeof '' => 'string'

var flag = true;

typeof flag => 'booleanr'

typeof undefined => 'undefined'

function fn(n,m)

}typeof null => 'object' null雖然是基本型別值,但是它屬於空物件指標,檢測的結果是物件(侷限性)

typeof {} => 'object'

typeof function

(){} => 'function'

typeof => 'object'

typeof /^$/ => 'object'

//使用typeof有自己的侷限性,不能具體細分出當前的值是陣列還是正則(也就是不能細分物件型別的值)

typeof (1>1?0:2) => 'number'

typeof 1>1?0:2 => 2 //這裡涉及到運算子優先順序問題 先計算typeof 1 => 'number' => 'number'>1?0:2 所以typeof跟加減乘除問號一樣屬於邏輯運算子,多個運算子在一起會存在優先順序問題

複製**

面試題

typeof typeof  => 'string' //先檢測typeof 得到的結果是'object',再檢測typeof 'object'=>字串

複製**

typeof是專案中非常常用的檢測資料型別的方式,對於數,正則,不能細分物件型別(侷限性)我們使用其他方式來做

instanceof:檢測某乙個例項是否隸屬於某個類

constructor:建構函式

使用instanceof檢測某個值是否屬於某乙個資料型別的內建類,從而檢查出它是否是這個型別的值;使用instanceof可以實現typeof實現不了的,對物件型別值詳細的區分檢測

instanceof array => true

instanceof regexp => false

複製**

1、基本型別值無法基於它檢測

//字面量建立

var num = 12;

num.tofixed(2) => "12.00" //說明:12是number類的乙個例項,因為它可以調取number.prototype上的方法,但是它是乙個基本型別值

// 建構函式建立

var num2 = new number(12);

num2.tofixed(2) => "12.00"

// 基本型別值通過字面量建立和建構函式建立,相同點都是number類的乙個例項,不同點乙個是基本型別值,乙個是引用資料型別值

typeof num => 'number'

typeof num2 => 'object'

//不管是哪一種方式建立基本型別值,都是自己所屬類的例項(只不過型別不一樣而已)

num instanceof number => false

num2 instanceof number => true

複製**

為什麼instanceof能檢測num2檢測不到num呢?如2、

2、instanceof檢測的原理是基於原型鏈檢測的:只要當前類在例項的原型鏈上,最後返回的結果都是true

var ary=;

ary instanceof array // => true

ary instanceof object // => true

function

fn(){}

fn.prototype=new array();//原型繼承(fn是array的子類)

var f =new fn();

console.dir(f)//列印出來的f並沒有陣列的length屬性,不具備資料的基礎結構

f instanceof array // true 但是我們的f其實不應該是陣列,雖然在它的原型上可以找到陣列,但是它不具備陣列的基礎結構

//(陣列有length屬性,它沒有),這也instanceof的弊端

複製**

獲取當前要檢測資料值的constructor,判斷它是否是某乙個資料型別內建類來檢測

var ary=;

ary.constructor === array; // true

ary.constructor === regexp; //false

ary.constructor === object; //false

ary.constructor='aa';

ary.constructor===array // false

// constructor檢測資料型別非常不可靠,因為這個屬性是經常容易被修改的

複製**

constructor檢測資料型別非常不可靠,因為這個屬性是經常容易被修改的

object.prototype.tostring.call([value]):獲取object.prototype上的tostring方法,讓方法中的this變為需要檢測的資料型別值,並且讓方法執行

在number、string、boolean、array、function、regexp...這些類的原型上都有乙個tostring方法;這個方法就是把本身的值轉換為字串的

(12).tostring // '12'

(true).tostring // 'true'

[12,23].tostring // '12,23'

複製**

在obeject這個類的原型上也有乙個方法tostring,但是這個方法並不是把值轉換為字串,而是返回當前值的所屬類詳細資訊,固定結構:'[object 所屬的類]'

var obj = ;

obj.tostring() // "[object object]" 調取的正是object.prototype.tostring

// obj.tostring()

// 首先執行object.prototype.tostring方法

// 這個方法中的this就是我們操作的資料值obj

// 總結:object.prototype.tostring執行的時候會返回當前方法中this的所屬類資訊

// 也就是,我想知道誰的所屬類資訊,我們就把這個tostring方法執行,並且讓this變為我們檢測的這個資料值

// ,那麼方法返回的結果就是當前檢測這個值的所屬類資訊

複製**

使用tostring檢測資料型別,不管你是什麼值,我們都可以正常檢測出需要的結果(這個方法檢測是萬能的)

object.prototype.tostring.call([value])

({}).tostring.call([value])

object.prototype.tostring.call(12) // [object number]

object.prototype.tostring.call(true)// [object boolean]

object.prototype.tostring.call('')// [object string]

object.prototype.tostring.call(null)// [object null]

object.prototype.tostring.call(undefined)// [object undefined]

object.prototype.tostring.call({})// [object object]

object.prototype.tostring.call()// [object array]

object.prototype.tostring.call(/^$/)// [object regexp]

object.prototype.tostring.call(function

(){})// [object math]

object.prototype.tostring.call(math)// [object function]

object.prototype.tostring.call(document.body)// [object htmlbodyelement]

object.prototype.tostring.call(document)// [object htmldocument]

複製**

由於object.prototype.tostring檢測資料型別方法寫起來很長也很麻煩,所以封裝乙個

~function

() ;

var check = {};

for (var key in obj)

})(obj[key]);}}

window.check = check;

}();

console.log(check);

check.isnumber(12);

複製**

Iris工程化開發流程

工程化開發優點 風格一致 整潔 開發流程 開發 model 開發repositories 開發services 開發controllers 開發views datamodels 放所有的模型 repositories 資料庫的增刪改查抽象成乙個資料庫類,這些資料庫類都放在這裡,跟datamodels...

前端工程化系列 簡談前端模組化開發與開發規範

沒有前戲,簡明扼要的進入主題 什麼是模組化開發?模組化開發,乙個模組就是乙個實現特定功能的檔案,有了模組我們就可以更方便的使用別人的 要用什麼功能就載入什麼模組。模組化開發的4點好處 1 避免變數汙染,命名衝突 2 提高 復用率 3 提高維護性 4 依賴關係的管理 前端模組化規範從原始野蠻階段現在慢...

我心目中的商用化開發和工程化開發

今天是上網搜東西時,偶然發現這個活動的,看了活動的介紹和提供的資料,感慨頗深。我心目中的商用化就是面對使用者提出的需求,以最少的成本來盡可能高質量的完成使用者的的需求,如果質量低的話,後期所付出的維護成本會很高,所以質量最好好一些,回頭看自己學習的課程,資料結構,作業系統,組成原理,為什麼技術會有那...