JavaScript數據類型、函數、對象

一. 什麼是JS

JS是JavaScript縮寫，有如下特色：
    （1）基於對象
    JS自己就有一些現成的對象可供程序員使用，例如：Array，Math，String。。。
    JS並不排除你能夠自已按必定的規則建立對象

   （2）事件驅動

   （3）解釋性
    每次運行JS代碼時，得須要將原代碼一行一行的解釋執行
    相對編譯型語言（例如：Java、C++）執行速度相對較慢

   （4）基於瀏覽器的動態交互網頁技術
    若是JS嵌入到HTML中，能夠不須要服務器支持，直接由瀏覽器解釋執行

   （5）嵌入在HTML標籤中
    JS必須嵌入到一個名叫<script src="引入外部js文件"></script>的標籤中，方可運行
腳本語言

二. JS中的三種類型

（1）基本類型：number，string，boolean
    number 包含正數，負數，小數
    string 由''或""定界
    boolean 由true或false，但js中的boolean也包含更多狀況，例如：存在表示true，不存在表示false

var num = 100; var str = "哈哈"; var flag = false; window.alert(num); window.alert(str); window.alert(flag);

var num = 100;
        var str = "哈哈";
        var flag = false;
        window.alert(num);
        window.alert(str);
        window.alert(flag);

　　

頁面會依次彈出三個對話框顯示這三個值。

（2）特殊類型：null，undefined
    null表示一個變量指向null
    undefined表示一個變量指向的值不肯定

<script type="text/javascript">
        //多個script快中的內容，能夠互相訪問
        //alert(flag);
        //window.alert(str);
        var person = null;
        var card;
        if(card == undefined){
            alert("card變量暫時沒有值");
        }else {
            alert(card);
        }
    </script>

　　

（3）複合類型：函數，對象，數組
    對象包含內置對象和自定義的對象

三. JS中有三種定義函數的方式

（1）正常方式：function mysum(num1,num2){return num1+num2;}

function add(num1,num2){
            return num1 + num2;
        }
        window.alert("10+20=" + add(10,20));

（2）構造器方式：new Function("num1","num2","return num1+num2;")

var add = new Function("num1","num2","return num1+num2");
        window.alert("100+200=" + add(100,200));

　　

（3）直接量或匿名或無名方式：var mysum = function(num1,num2){return num1+num2;}

var add = function(num1,num2){
            return num1 + num2;
        }
        alert(add("100+200=" + 100,200));

　　

四. JS中的四種對象

（1）內置對象 ：Date，Math，String，Array，...

<script type="text/javascript">
        //Date
        //var str = new Date().toLocaleString();
        //window.document.write("<font size='44' color='red'>"+ str +"</font>");

        //Math
        /*for(var i=1;i<=10;i++){
            document.write(Math.floor(Math.random()*9)+1+"<br/>");
        }*/

        //String
       /* var str = "Hello你好";
        var size = str.length;
        alert(size);*/

        //Array
        var array = new Array("語文","數學","英語",true,123);
         for(var i=0;i<=10;i++){
         document.write(array[i] + " ");
         }

    </script>

　　

（2）自定義對象：Person，Card，...

function Student(id,name,sal){
            //this指向s引用
            this.id = id;
            this.name = name;
            this.sal = sal;
        }
        var s = new Student(1,"波波",7000);
        document.write("編號:" + s.id + "<br/>");
        document.write("姓名:" + s.name + "<br/>");
        document.write("薪水:" + s.sal + "<br/>");

　　

（3）瀏覽器對象： window，document，status，location，history...

<script type="text/javascript">
      /*  var url = "test.html";
        window.open(url);*/

        //status
        /*var nowStr = new Date().toLocaleString();
        window.status = nowStr;*/

        //location
      /*var url = "test.html";
        window.location.href = url;*/

        //history,演示刷新
        window.history.go(0);
        //0 -- 刷新
        //1 -- 前進
        //-1 -- 後退

    </script>

　　

（4）ActiveX對象：ActiveXObject("Microsoft.XMLHTTP"),...

五. 演示JS對象的屬性，方法和事件的使用

（1）window.location.href

//跳轉到test.html頁面
var url = "test.html";
            window.location.href = url;

（2）form.submit()

<form action="/test.html" method="POST">
        <input type="button" value="提交到服務端" onclick="doSubmit()"/>
    </form>
    <script type="text/javascript">
        function doSubmit(){
            //表單提交
            document.forms[0].submit();
        }
    </script>

　　

(3) inputElement.constructor = 函數

(4）document.createElement(「img」)

(5) imgElement.style.width/height