Javascript 知識點精簡

文章目錄

• 如何在HTML中引入JS？
• 浮點數不要用 == 來進行判斷
•     boolean 類型
• 函數
• 我們在Javascript中聲明的函數被載入到哪了？
• global對象的 eval()方法
• 自訂對象
• 遍曆對象的所有元素(屬性,方法)
• with 結構的用法

如何在HTML中引入JS？

    所有重新導向的HTML標籤內都可以嵌入javascript代碼，例如：
        <a href="javascript:alert('OK')"></a>
        <form action="javascript:alert('OK')"></form>
        <script>alert("Hello")</script>
        <script src="test.js"></script> 可以匯入多個js

 

浮點數不要用 == 來進行判斷

    var num=0;
    for(var i=0;i<10;i++){
        num += 0.1;
    }
    alert(num); // num:0.9999999999999

 

    boolean 類型

        不同於.NET只判斷true或false,JS裡 0, 0.00, "", null 返回的都是 false

函數

普通聲明：

function test(){};
function test(arg1,arg2..argN){}

匿名函數：

var test = function(){
               }

回呼函數：（僅靠傳遞變數搞不定的，可以傳遞函數）

function test(a,b,funA){
    return funA(a,b); //  方法執行由使用者傳入的函數決定 最典型的樣本是 數組的sort()方法可以接收指定的定序
}

函數調用方式：

function test(){
    alert("Hello");
}
test();

var fun1 == test;
fun1();  //  函數也能賦值給變數,因此函數也是資料類型的一種
alert(fun1); // result:輸出整個函數的聲明(這裡指的聲明包括 函數名 和 程式碼片段)

函數參數：

function numAdd(num1,num2){
    return num1 + num2;
}
numAdd(3,5) // 常規調用
numAdd(2,4,6,8,10) // 非常規調用呢?其實fun也可以改寫成下面這樣:
function numAdd(){
    var result = 0;
    for(var i=0;i<arguments.length;i++){
        result += arguments[i];
    }
    return result;
}
alert(numAdd(2,4,6,8,10)); // result:30

參數的預設值

function test(a,b){
    if(typeof(a) == "undefined")
        a=1;
    if(typeof(b) == "undefined")
        b=2;
}
function test(a,b){
    if(!a)
        a=1;
    if(!b)
        b=2;
}
function test(a,b){ // 最簡潔的方式   

    a = a? a:1;
    b = b? b:2;
}

 

我們在Javascript中聲明的函數被載入到哪了？

答案是：window 對象。JS中，函數也是基於對象調用的，由於 window 對象可以省略，因此我們可以直接調用自己寫過的函數!

 

global對象的 eval()方法

global 對象的 eval()方法相當於JS程式中的代碼解析器 可以執行合法的字串,樣本:

var str = "var a="+ f +";a+=a"
var f = 5;
eval(str);
alert(a); // 10

註：如果不執行 eval 方法是擷取不到變數a的

 

自訂對象

由於沒有Class的類的概念,而對象又是要new出來的 因此要通過函數才能建立出對象。

方式一：這個方法是最初設計的原型和構思

function person(){

}
var p = new person();
p.name = "XJ"; // property
p.age = 30;
p.play = function(){ // method
    document.write("Playing......");
}

方式二：

var person = new Object();
person.name = "XJ"; // property
person.age = 30;
person.play = function(){ // method
    document.write("Playing......");
}

方式三：

function person(){
    var p = new Object();
    p.name = "XJ"; // property
    p.age = 30;
    p.play = function(){ // method
        document.write("Playing......");
    }
    return p;
}
擷取對象: var p = person();

方式四：

function person(name,age,play){
    this.name=name;
    this.age=age;
    this.play=play;//method
}
var p = new person("xj","30",function{
    document.write("Playing......");
});
alert(p.name);
p.play();

 

遍曆對象的所有元素(屬性,方法)

for(var tmpName in p){     

    alert(p[tmpName]);
}

注意：這裡獲得的都是元素名,而不是元素的值,for..in對於數組而言擷取的是索引。這是有別於C#中foreach的。

 

with 結構的用法

with(document){
    write("Hello");
}

with 語句塊可以讓使用對象的屬性和方法變的文法更為簡單，適用於多次操作一個對象的成員時。