• <nav id="wkkge"><strong id="wkkge"></strong></nav>
  • <menu id="wkkge"></menu>
  • JavaScript教程
    JavaScript基礎語法
    JavaScript事件和事件句柄
    JavaScript HTML DOM對象
    JavaScript BOM編程
    JavaScript JSON

    JavaScript數據類型

     

     

    JavaScript中有5種數據類型:4種原始類型(基本數據類型)Undefined、Boolean、Number、String。1種引用數據類型—Object,自定義的函數也是一種引用數據類型,可以看做Object類型的子類型。ES6規范中又添加了一種新的類型:Symbol。

     

    JavaScript是松散類型的,因此需要有一種手段來檢測給定變量的數據類型,typeof運算符就是負責提供這方面信息的操作符。對一個值使用typeof操作符可能返回下列某個字符串:

     

    ●  "undefined"——如果這個值未定義;

     

    ●  "boolean"——如果這個值是布爾值;

     

    ●  "string"——如果這個值是字符串;

     

    ●  "number"——如果這個值是數值;

     

    ●  "object"——如果這個值是對象或null;

     

    ●  "function"——如果這個值是函數;

     

    語法有三種寫法:

     

    ● typeof 變量名

     

    ● typeof(變量名)

     

    ● typeof 函數名

     

    示例:

     

    <html>
    	<head>
    		<title>js中的數據類型</title>
    
    		<script language="javascript">
    			
    			/*
    				回顧java語言中的數據類型:
    					基本數據類型:byte,short,int,long,float,double,boolean,char
    					引用數據類型:Object...
    				
    				Javascript中的數據類型:
    					原始數據類型:Undefined,Boolean,Number,String
    					引用數據類型:Object
    
    					注意:自定義的函數,其實也是一種類型,
    					這個類默認繼承Object類型。所以Function
    					也屬于引用數據類型。
    				
    				JS中的數據類型的類型名就是一個擺設,沒用:
    					String s = "abc"; //Error
    					//js中變量的聲明不需要指定數據類型,是一種弱類型的語言
    					//JS程序因為是不需要編譯的,直接運行,所有變量的數據類型
    					//在程序運行階段確定。
    					var s = "abc";
    					s = false;
    				
    				關于 typeof 運算符:
    
    				語法有三種寫法:
    						1.typeof 變量名
    						2.typeof(變量名)
    						3.typeof 函數名
    					
    					typeof運算符的運算結果一定是“String”類型,并且只有以下6種結果:
    						"undefined"
    						"boolean"
    						"string"
    						"number"
    						"object"
    						"function"
    				typeof運算符主要存在的意義是判斷變量的數據類型。
    			*/
    
    			var i; //系統會默認賦值 undefined, undefined是一個值,屬于Undefined類型。
    
    			alert(typeof(i) == "undefined"); //true
    			alert(typeof(i) == undefined); //false
    
    			if(typeof i == "undefined"){
    				i = 100;
    				alert(i);
    			}
    
    			var v = '中國';
    			if(typeof v == "number"){
    				alert(v + 10);
    			}else{
    				alert("它不是一個數字!");
    			}
    			
    			//Object類是一種引用數據類型
    			//Object是JS中內置的。
    			//Object既是一個函數的名字,也是一個類名。
    			var o = new Object();
    
    			alert(typeof(o)); //"object"
    			
    			//User類中有一個屬性username
    			User = function(a){
    				this.username = a;
    			}
    
    			o = new User("SMITH");
    			alert(typeof(o)); //"object"
    			alert(typeof(User)); //"function"
    		</script>
    	</head>
    	<body>
    	</body>
    </html>

     

     

    Undefined類型

     

    Undefined類型只有一個值,即特殊的undefined。在使用var聲明變量但未對其加以初始化時,這個變量的值就是undefined。

     

    例如:

     

     var message;
    alert(message == undefined) //true

     

    示例:

     

    <html>
    	<head>
    		<title>Undefined類型</title>
    		<script language="javascript">
    			
    			/*
    				Undefined類型只有1個值,這個值就是undefined
    				如果一個變量只聲明,沒有手動賦值,則系統默認賦值undefined
    			*/
    			var i;
    			var i1 = undefined;
    
    			alert(i); //alert方法會使用()中的非字符串類型轉換成字符串類型。
    			alert(i1);//"undefined"
    			alert( i == i1); //true
    		</script>
    	</head>
    </html>

     

     

    Boolean類型

     

    該類型只有兩個字面值:true和false。這兩個值與數字值不是一回事,因此true不一定等于1,而false也不一定等于0。

     

    雖然Boolean類型的字面值只有兩個,但JavaScript中所有類型的值都有與這兩個Boolean值等價的值。要將一個值轉換為其對應的Boolean值,可以調用類型轉換函數Boolean(),例如:

     

      var message = 'Hello World';
        var messageAsBoolean = Boolean(message);

     

    在這個例子中,字符串message被轉換成了一個Boolean值,該值被保存在messageAsBoolean變量中。可以對任何數據類型的值調用Boolean()函數,而且總會返回一個Boolean值。至于返回的這個值是true還是false,取決于要轉換值的數據類型及其實際值。下表給出了各種數據類型及其對象的轉換規則。

     

     

    這些轉換規則對理解流控制語句(如if語句)自動執行相應的Boolean轉換非常重要,例如:

     

    ?var message = 'Hello World';
    
    ????if(message)
    
    ????{
    
    ????????alert("Value is true");
    
    ????}

     

    運行這個示例,就會顯示一個警告框,因為字符串message被自動轉換成了對應的Boolean值(true)。由于存在這種自動執行的Boolean轉換,因此確切地知道在流控制語句中使用的是什么變量至關重要。

     

    示例:

     

    <html>
    	<head>
    		<title>Boolean類型</title>
    
    		<script language="javascript">
    			/*
    				Boolean類型只有兩個值:true、false
    				Boolean類型提供一個Boolean(數據)函數.
    				Boolean(數據) 函數:
    					1.該函數的作用是:將非Boolean類型轉換成Boolean類型。	
    					2.該函數的運算結果一定是:true、false
    					3.轉換規則:
    						3.1 所有的“非""字符串”都被轉換成true
    							所有的 "" 被轉換成 false
    						3.2 任何非0的數字包括無窮大(Infinity)都被轉換成true
    							0和 NaN 都被轉換成false
    						3.3 任何“非null”對象都被轉換成 true
    							null 被轉換成false
    						3.4 undefined 是一個值,被轉換成 false
    			*/
    
    			var v1; //undefined
    			alert(Boolean(v1)); //false
    
    			v1 = "abc"; //非"" 字符串
    			alert(Boolean(v1)); //true
    
    			v1 = ""; //""字符串
    			alert(Boolean(v1)); //false
    
    			v1 = 0; //0
    			alert(Boolean(v1)); //false
    
    			v1 = NaN;
    			alert(Boolean(v1)); //false
    
    			v1 = Infinity; //無窮大
    			alert(Boolean(v1)); //true
    
    			v1 = null;
    			alert(Boolean(v1)); //false
    
    			v1 = new Object();
    			alert(Boolean(v1)); //true
    
    	//關于if語句 和java語法結果相同。區別在于if(這里的數據如果不是Boolean
    //類型,系統會自動調用Boolean函數進行類型的轉換)
    			var a = "ABCDEF";
    			if(a){
    				alert(a);
    			}else{
    				alert("空字符串");
    			}
    		</script>
    	</head>
    </html>

     

     

    Number類型

     

    這種類型用來表示整數和浮點數值,還有一種特殊的數值,即NaN(非數值 Not a Number)。這個數值用于表示一個本來要返回數值的操作數未返回數值的情況。

     

    NaN本身有兩個非同尋常的特點。首先,任何涉及NaN的操作(例如NaN/10)都會返回NaN,這個特點在多步計算中有可能導致問題。其次,NaN與任何值都不相等,包括NaN本身。例如,下面的代碼會返回false。

     

    alert(NaN == NaN);    //false

     

    JavaScript中有一個isNaN()函數,這個函數接受一個參數,該參數可以使任何類型,而函數會幫我們確定這個參數是否“不是數值”。isNaN()在接收一個值之后,會嘗試將這個值轉換為數值。某些不是數值的值會直接轉換為數值,例如字符串”10“或Boolean值。而任何不能被轉換為數值的值都會導致這個函數返回true。例如:

     

    alert(isNaN(NaN)); ???//true
    
    alert(isNaN(10)); ???//false(10是一個數值)
    
    alert(isNaN("10")); ???//false(可能被轉換為數值10)
    
    alert(isNaN("blue")); ???//true(不能被轉換為數值)
    
    alert(isNaN(true)); ???//false(可能被轉換為數值1)

     

    示例:

     

    <html>
    	<head>
    		<title>Number類型</title>
    
    		<script language="javascript">
    			/*
    				Number類型包括以下值:
    					整數(0,1,2,3.....)
    					浮點數(1.0,2.0,3.0.....)
    	NaN (這就是一個值,屬于Number類型,表示“不是一個數字”,Not a Number)
    					Infinity (這就是一個值,屬于Number類型,表示無窮大)
    			*/
    			//整數
    			var v1 = 0;
    			var v2 = 100;
    			alert(v2);
    			alert(typeof v2);
    
    			//浮點數
    			var v3 = 3.1;
    			alert(v3);
    			alert(typeof v3);
    
    			//Not a Number
    			var v4 = NaN;
    			alert(v4);
    			alert(typeof v4);
    			
    var v5 = 100/"中國"; //運算結果本該是數字卻沒有返回數字的,則返回NaN
    			alert(v5);
    			alert(typeof v5);
    
    			//Infinity
    			var v6 = 10/0; //除數是0的時候運算結果是無窮大Infinity。
    			alert(v6);
    			alert(typeof v6);
    
    			//js中是:3.333333
    			alert(10/3);  //在java中是 3
    			
    			/*
    				重點:isNaN函數
    				語法:isNaN(變量)  判斷該變量是否是一個數字。
    				“is not a number”
    				isNaN的運算結果是true、false
    				true:不是一個數字
    				false:是一個數字
    			*/
    			var ename = "JACK";
    			if(isNaN(ename)){
    				alert(ename + "不是一個數字");
    			}
    
    			var x = NaN;
    			var y = NaN;
    			//NaN和任何數據都不相等,和自己也不相等。
    			alert(NaN==NaN); //false
    			alert(isNaN(NaN)); //true
    		</script>
    	</head>
    </html>

     

    示例:

     

    <html>
    	<head>
    		<title>Number類型</title>
    
    		<script language="javascript">
    
    			//isNaN
    			function checkAge(age){
    				
    				var ageError = document.getElementById("ageError");
                    // 通過isNaN()判斷用戶輸入的數據是否是一個數值
    				if(isNaN(age)){
    					//alert("年齡必須是數字");
    					ageError.innerHTML = "<font color='red'>年齡必須是數字</font>";
    					return;
    				}
    				if(age<18 || age>50){
    					//alert("年齡不在指定范圍中");
    					ageError.innerHTML = "年齡不在指定范圍中";
    					return;
    				}
    				ageError.innerHTML = "";
    			}
    			function clearError(){
    				var ageError = document.getElementById("ageError");
    				ageError.innerHTML = "";
    			}
    		</script>
    	</head>
    	<body>
    
    		<!--
    			blur是失去焦點 onblur是失去焦點句柄
    		-->
    		<input 
    			type="text" 
    			name="userage" 
    			onblur="checkAge(this.value);"
    			onfocus="clearError();"/>
    		<!--該圖層負責顯示錯誤信息,span不是獨占行的-->
    		<span id="ageError"></span>
    	</body>
    
    </html>

     

    有3個函數可以把非數值轉換為數值:Number()、parseInt()和parseFloat()。第一個函數,即轉型函數Number()可以用于任何數據類型,而另外兩個函數則專門用于把字符串轉換成數值。這3個函數對于同樣的輸入會返回不同的結果。

     

    Number()函數的轉換規則如下:

     

    1.如果是Boolean值,true和false將分別被替換為1和0

     

    2. 如果是數字值,只是簡單的傳入和返回

     

    3.如果是null值,返回0

     

    4.如果是undefined,返回NaN

     

    5.如果是字符串,遵循下列規則:

     

    ● 如果字符串中只包含數字,則將其轉換為十進制數值,即”1“會變成1,”123“會變成123,而”011“會變成11(前導的0被忽略)

     

    ● 如果字符串中包含有效的浮點格式,如”1.1“,則將其轉換為對應的浮點數(同樣,也會忽略前導0)

     

    ● 如果字符串中包含有效的十六進制格式,例如”0xf“,則將其轉換為相同大小的十進制整數值

     

    ● 如果字符串是空的,則將其轉換為0

     

    ● 如果字符串中包含除了上述格式之外的字符,則將其轉換為NaN


    5.如果是對象,則調用對象的valueOf()方法,然后依照前面的規則轉換返回的值。

     

    如果轉換的結果是NaN,則調用對象的toString()方法,然后再依次按照前面的規則轉換返回的字符串值。

     

    var num1 = Number("Hello World");    //NaN
    var num2 = Number("");                //0
    var num3 = Number("000011");        //11
    var num4 = Number(true);            //1

     

    由于Number()函數在轉換字符串時比較復雜而且不夠合理,因此在處理整數的時候更常用的是parseInt()函數。parseInt()函數在轉換字符串時,更多的是看其是否符合數值模式。它會忽略字符串前面的空格,直至找到第一個非空格字符。如果第一個字符串不是數字字符或者負號,parseInt()會返回NaN;也就是說,用parseInt()轉換空字符串會返回NaN。如果第一個字符是數字字符,praseInt()會繼續解析第二個字符,直到解析完所有后續字符或者遇到了一個非數字字符。例如,"1234blue"會被轉換為1234,”22.5“會被轉換為22,因為小數點并不是有效的數字字符。

     

    如果字符串中的第一個字符是數字字符,parseInt()也能夠識別出各種整數格式(即十進制、八進制、十六進制)。為了更好的理解parseInt()函數的轉換規則,下面給出一些例子:

      

    var num1 = parseInt("1234blue");    //1234
    var num2 = parseInt("");            //NaN
    var num3 = parseInt("0xA");            //10(十六進制)
    var num4 = parseInt("22.5");        //22
    var num5 = parseInt(""070);            //56(八進制)
    var num6 = parseInt("70");            //70
    

     

    parsInt()可以把一個string按照同進制進行解析

     

     var num7 = parseInt("10",”2”);        //2(按二進制解析) 2也可以使用”2”
     var num8 = parseInt("10",8);          //8(按八進制解析)
     var num9 = parseInt("10",10);        //10(按十進制解析)
     var num10 = parseInt("10",16);        //16(按十六進制解析)
     var num12 = parseInt("AF",16);        //175

     

    與parseInt()函數類似,parseFloat()也是從第一個字符(位置0)開始解析每個字符。而且也是一直解析到字符串末尾,或者解析到遇見一個無效的浮點數字字符為止。也就是說,字符串中的第一個小數點是有效的,而第二個小數點就是無效的了,因此它后面的字符串將被忽略。例如,”22.34.5“將會被轉換成22.34。

     

    parseFloat()和parseInt()的第二個區別在于parseFloat始終都會忽略前導的零。由于parseFloat()只能解析十進制值,因此它沒有用第二個參數指定基數的用法。

     

    var num1 = parseFloat("1234blue");    //1234
    var num2 = parseFloat("0xA");        //0
    var num3 = parseFloat("22.5");        //22.5
    var num4 = parseFloat("22.34.5");    //22.34
    var num5 = parseFloat("0908.5");    //908.5

     

     

    String類型

     

    String類型用于表示由零或多個16位Unicode字符組成的字符序列,即字符串。字符串可以由單引號(')或雙引號(")表示。

     

      var str1 = "Hello";
        var str2 = 'Hello';

     

    任何字符串的長度都可以通過訪問其length屬性取得

     

     alert(str1.length);        //輸出5

     

    要把一個值轉換為一個字符串有兩種方式。第一種是使用幾乎每個值都有的toString()方法。

     

        var age = 11;
        var ageAsString = age.toString();    //字符串"11"
        var found = true;
        var foundAsString = found.toString();    //字符串"true"

     

    數值、布爾值、對象和字符串值都有toString()方法。但null和undefined值沒有這個方法。

     

    多數情況下,調用toString()方法不必傳遞參數。但是,在調用數值的toString()方法時,可以傳遞一個參數:輸出數值的基數。

     

       var num = 10;
        alert(num.toString());      //"10"
        alert(num.toString(2));     //"1010" ; 2 可以是數值,也可以是sring格式的”2”
        alert(num.toString(8));     //"12"
        alert(num.toString(10));    //"10"
        alert(num.toString(16));    //"a"

     

    通過這個例子可以看出,通過指定基數,toString()方法會改變輸出的值。而數值10根據基數的不同,可以在輸出時被轉換為不同的數值格式。

     

    在不知道要轉換的值是不是null或undefined的情況下,還可以使用轉型函數String(),這個函數能夠將任何類型的值轉換為字符串。String()函數遵循下列轉換規則:

     

    1.如果值有toString()方法,則調用該方法(沒有參數)并返回相應的結果
     

    2.如果值是null,則返回"null"
     

    3.如果值是undefined,則返回”undefined“

      var value1 = 10;
        var value2 = true;
        var value3 = null;
        var value4;
        alert(String(value1));    //"10"
        alert(String(value2));    //"true"
        alert(String(value3));    //"null"
        alert(String(value4));    //"undefined"

     

    示例:

     

    <html>
    	<head>
    		<title>String類型</title>
    		<script language="javascript">
    			/*
    				1.js中的字符串可以使用
    					''  ; ""  都可以。
    				2. js中的字符串有length屬性用來獲取字符串的長度
    				3. js 中的字符串有 prototype屬性,用來給字符串類型動態擴展屬性和方法
    			*/
    			var s1 = 'ABC';
    			alert(s1.length);
    			s1 = "AAAA";
    			alert(s1.length);
    			
    			//Error:這里不能執行。
    			//s1.trim();
    
    			//給字符串類多態擴展屬性和方法,該屬性和方法可以作用到所有字符串對象上。
    			String.prototype.trim = function(){
    				return this.replace(/^\s+/,"").replace(/\s+$/,"");
    			}
    
    			//調用
    			var s1 = "  hello   "
    			s1 =s1.trim();
    			alert(s1 + " ,長度:" + s1.length);
    		</script>
    	</head>
    	<body>
    	</body>
    </html>

     

     

    Object類型

     

    對象其實就是一組數據和功能的集合。對象可以通過執行new操作符后跟要創建的對象類型的名稱來創建。而創建Object類型的實例并為其添加屬性和(或)方法,就可以創建自定義對象。

     

    var o = new Object();

     

    Object的每個實例都具有下列屬性和方法:

     

    constructor——保存著用于創建當前對象的函數


    prototype--------給類型動態擴展屬性(類級別),將作用到所有對象上。(類名.)方式訪問


    hasOwnProperty(propertyName)——用于檢查給定的屬性在當前對象實例中(而不是在實例的原型中)是否存在。其中,作為參數的屬性名(propertyName)必須以字符串形式指定(例如:o.hasOwnProperty("name"))


    isPrototypeOf(object)——用于檢查傳入的對象是否是另一個對象的原型


    propertyIsEnumerable(propertyName)——用于檢查給定的屬性是否能夠使用for-in語句來枚舉


    toString()——返回對象的字符串表示


    valueOf()——返回對象的字符串、數值或布爾值表示。通常與toString()方法的返回值相同。


    示例:

     

    <html>
    	<head>
    		<title>Object類型</title>
    
    		<script language="javascript">
    			/*
    			Object類型是JS中引用數據類型的頂層類型(根類型)。
    			自定義的函數也是一種類型,默認繼承Object類。
    			Object類是JS中內置的。
    			*/
    			//創建Object對象
    			var o1 = new Object();
    			
    			//JS中的對象都有toString方法
    			alert(o1);
    			alert(o1.toString());
    
    			//關于constructor屬性,用來獲取創建該對象的構造函數
    			alert(o1.constructor);
    			
    			//關于prototype屬性,用來給類型動態擴展屬性以及方法
    			Emp = function(ename,sal){
    				this.ename = ename;
    				this.sal = sal;
    
    				/**/
    				this.toString = function(){
    				     return this.ename + "--->" + this.sal;
    				}
    			}
    
    			var e1 = new Emp("KING",5000);
    			
    			//Error
    			//e1.printInfo();
    			
    //動態擴展
    			Emp.prototype.printInfo = function(){
    				document.write(this.ename + "," + this.sal);
    			}
    
    			//調用方法
    			e1.printInfo();
    			alert(e1);
    			alert(e1.toString());
    			alert(e1.constructor);
    		</script>
    	</head>
    	<body>
    	</body>
    </html>

     

    全部教程
  • <nav id="wkkge"><strong id="wkkge"></strong></nav>
  • <menu id="wkkge"></menu>
  • 面对面棋牌游戏