国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

jquery中的工具使用方法$.isFunction, $.isArray(), $.isWindow()

2019-11-20 11:53:01
字體:
來源:轉載
供稿:網友

javascript中對變量類型的判斷中,我們講解了了jquery中$.type()實現的原理。當然,jquery除了提供$.type的工具方法外,還提供了幾個其他的工具方法:$.isFunction(), $.isArray(), $.isWindow(), $.isNumeric()等。這幾個方法從方法名上就能看出其用途來,下面我們來一一講解這幾個方法在jQuery(2.1.2)中實現的內部細節。

1. $.isFunction()

$.isFunction()是用來判斷變量是否為function類型,我們通過幾個例子來看看:

$.isFunction(123); // false$.isFunction(true);// false$.isFunction([1, 2]);// false$.isFunction(function(){});// truefunction func(){}var sfunc = function(){}$.isFunction(func); // true$.isFunction(sfunc);// true

從上面的例子中能夠看到,在$.isFunction(param)中,若傳入的param是function類型,則返回true;其他的類型則返回false。
查看jquery的源碼我們可以看到,$.isFunction()也是通過$.type()實現的:

isFunction: function( obj ) {	return jQuery.type(obj) === "function";}

2. $.isArray()

$.isArray()是用來判斷變量是否為array類型。同樣,我們也通過幾個例子來看看$.isArray的用法:

$.isArray(123);  // false$.isArray(true); // false$.isArray([1, 2]);// true$.isArray(new Array(3, 4)); // true

無論是array的字面量還是使用new關鍵詞創建的變量,都能使用$.isArray()判斷其是array類型。在jquery源碼中,$.isArray調用的就是原生Array提供的isArray方法。因為在高版本的瀏覽器中,已經給原生JavaScript提供了一個isArray方法用來判斷變量是否為array類型。
isArray: Array.isArray
3. $.isWindow()

$.isWindow()是用來判斷當前變量是否為window,如:

$.isWindow(window); // true$.isWindow([]); 	// false$.isWindow(null); 	// false

在jQuery源碼中:

isWindow: function( obj ) {	return obj != null && obj === obj.window;}

他是通過判斷obj是否有window屬性,來判斷obj是否為window對象。因為window對象里有一個屬性window,就是他自己,因此:window.window===window,同樣的:

window.window.window.window === window;

可以一直循環下去。

而代碼里為什么要先判斷一下obj是否為null呢?因為在判斷null或undefined是否有window屬性時,代碼會拋出異常:Uncaught TypeError: Cannot read property ‘window' of null。因此,為了防止代碼錯誤,首先判斷變量是否為null,若為null,則它肯定不是window對象,直接返回false;否則再判斷這個變量有沒有window屬性。

4. $.isNumeric()

$.isNumeric()是用來判斷當前變量是否為數字類型,可是為什么我不使用$.type()=="number"來判斷呢。我們先來看幾個官方的例子:

$.isNumeric("-10"); // true$.isNumeric(16);   // true$.isNumeric(0xFF);  // true$.isNumeric("0xFF"); // true$.isNumeric("8e5"); // true (exponential notation string)$.isNumeric(3.1415); // true$.isNumeric(+10);  // true$.isNumeric(0144);  // true (octal integer literal)$.isNumeric("");   // false$.isNumeric({});   // false (empty object)$.isNumeric(NaN);  // false$.isNumeric(null);  // false$.isNumeric(true);  // false$.isNumeric(Infinity); // false$.isNumeric(undefined); // false

使用$.isNumeric()能夠判斷出“-10”, “0xFF”這樣字符串類型的數字,而$.type()則會將其解析為string類型。
在jquery源碼中,是這樣判斷變量類型的:

isNumeric: function( obj ) {	// parseFloat NaNs numeric-cast false positives (null|true|false|"")	// ...but misinterprets leading-number strings, particularly hex literals ("0x...")	// subtraction forces infinities to NaN	// adding 1 corrects loss of precision from parseFloat (#15100)	return !jQuery.isArray( obj ) && (obj - parseFloat( obj ) + 1) >= 0;}

首先判斷其變量是否為array類型,若是則直接返回false。可是為什么要先判斷變量是否為array類型呢?因為[123]這樣類型的數組是可以直接進行減法運算的,同時也能通過parseFloat([“123”])轉換為數字:

[100] - 60 		// 40[100] - [60] 		// 40parseFloat([123]) 	// 123parseFloat(["345"]) // 345

因此不能直接通過parseFloat()轉換,然后判斷。首先得判斷這個變量是否為數組;若不是才進行下一步的判斷:

(obj - parseFloat( obj ) + 1) >= 0

純數字,字符串類型的數字,0開頭的數字(8進制),0x開頭的數組(16進制)等,都能通過parseFloat()正常進行轉換為10進制的數字。經過上面表達式的運算,肯定是大于0的。可是為什么要加上1呢?代碼里也解釋了,通過parseFloat()轉換到,會造成精度丟失的問題,因此+1后,運算結果更加的準確。

而其他類型的通過parseFloat()轉換后得到的是NaN,NaN無論通過怎樣的運算,都是不能跟0比較的,返回false。

在jquery之前的版本(如2.0.2)中:

isNumeric: function( obj ) {	return !isNaN( parseFloat(obj) ) && isFinite( obj );}

我們可以發現,使用這樣的代碼$.isNumeric([123])運行后,得到的true,而實際上,它是個數組類型。不過還好,在后續的版本已經修復了。

5. $.isEmptyObject()

$.isEmptyObject()不是用來判斷變量的類型了,而是判斷一個object類型是否為空,不包含任何屬性。
從 jQuery 1.4 開始,這個方法既檢測對象本身的屬性,也檢測從原型繼承的屬性(因此沒有使用hasOwnProperty)。參數應當是一個普通的JavaScript對象, 對于其他類型的對象(DOM元素,原始strings/numbers,host對象)在跨瀏覽器中可能無法提供一致的結果。

$.isEmptyObject({name:"wenzi"}) // false$.isEmptyObject({}) // truefunction Person(){	this.name = "wenzi"}$.isEmptyObject(new Person()); // falsefunction Student(){}Student.prototype.name = "wenzi";$.isEmptyObject(new Student()); // false

我們能夠看到,不論是對象本身的屬性,還是prototype上的屬性,只要存在,都會返回false。

isEmptyObject: function( obj ) {	var name;	for ( name in obj ) {		return false;	}	return true;}

在jquery中,是通過for~in進行檢測的。因為for~in也是能循環到prototype上的屬性的,若進入到循環中,則說明obj存在屬性,發揮false;否則返回true。
6. 總結

jquery中還提供了很多各種各樣的工具方法,讓我們在編寫js代碼時更加的方便。以后有機會時再總結其他的工具方法。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 平谷区| 太仆寺旗| 嵩明县| 湖南省| 康马县| 东方市| 威海市| 辽源市| 夹江县| 昌黎县| 隆尧县| 双鸭山市| 息烽县| 和顺县| 游戏| 辉南县| 徐闻县| 吕梁市| 曲阳县| 仁寿县| 长顺县| 斗六市| 霍林郭勒市| 九台市| 余庆县| 类乌齐县| 通州市| 当阳市| 镇康县| 和田市| 巫山县| 永城市| 石嘴山市| 扎赉特旗| 黄龙县| 贵德县| 苏尼特左旗| 阿勒泰市| 苏尼特右旗| 庆安县| 黑水县|