javascript基礎知識_基礎知識

來源:互聯網
上載者:User

1、var msg;//聲明一個變數,在沒有給此變數賦值以前,該變數名為:undefined

2、msg = "hello";//不適用var則可以聲明一個全域變數,但是此變數因為是全域的,所以容易引起其他調用的一些問題,故不推薦

3、javaScript有5種基礎資料型別 (Elementary Data Type),Undefined、Null、Boolean、Number和String;以及一種複雜資料類型:Object

4、var num=076;//代表的八進位,以0開頭,假如後面的數值超出8的範圍,例:08、079等,則按十進位解析

5、var num=0x22;//代表十六進位

6、NaN->Not a Number;//非數字,NaN不和任何值相等,包托它自己;判斷一個值是否可以轉換為數值的方式:isNaN(*),*為所要進行轉化的資料

7、向Number轉化時,false->0;true->1;""->0;"00022"->22;"helloworld"->NaN;註:採用的是Number()方式

8、假如採用parseInt()方式進行轉化則與7(對字串來說)不同,基本原理如下:

1)對String的第一個非空白字元進行解析,若是空格則跳過,假如是非數字或者負號,則直接返回NaN;
2)對接下去的字元繼續解析,直到遇到非數字或者解析完成,返回已經解析的內容;
3)如果解析到字串的非空白字元以0x開頭且後面加16進位字元則轉換成16進位,若是0開頭且後面加8進位字元則轉換為8進位;

例:"1234blue"->1234;""->NaN;"0xA"->10;"070"->56;" 22.5"->22;"   12 457 blue"->12;解析時只跳過1)中出現的空格

9、還可以採用parseInt(*,*)方式,後面一個變數代表的是所要轉換的進位;可選16,10,8,2等,例parseInt("10",16)->16,此時不需要再添加0x或者0

10、toString()方法一般不必使用參數,true->"true",都是按照字串來轉換,但是當由數字轉換為String時,可以添加參數,用於設定進位

例:var num = 10->String-------num.toString()->"10";num.toString(2)->"1010";num.toString(8)->"12";

11、在JavaScript中以32位元據表示一個數,左移<<不會改變符號位,例:2<<5;-->64即:10->1000000

12、右移分為兩種:有符號右移和無符號右移:

1)有符號右移:>>只移動資料位元,不移動符號位:-64>>5 ---->-2
2)無符號右移:>>>所有的都要移動,因此負數移動之後會變為正數,且此正數一般非常大

12、switch語句中的case非常強大,可以是數值,也可以是字串甚至運算式

13、javaScript中function()中可以不添加參數,對於其來說其實是由arguments[]接收的

14、javascript沒有塊級範圍,如下例子:

複製代碼 代碼如下:
if(true)
{
    var color = "blue";
}
alert(color);

會列印出blue出來,這個僅限於alert語句是位於全域環境中,但是在類C語言中則不會出現此種情況,一般都會銷毀for函數等迴圈函數除外,在javascript中也會銷毀。

15、instance of 語句用於判斷是否屬於某種資料類型,或者某種對象:person instanceof Object //變數person是Object?若是則返回true

16、將變數值設定為null可以解除對此變數的引用,javascript的垃圾收集器在下次運行時會將其回收

17、參考型別與類相似,但是不是一碼事!建立一個參考型別有兩種方法:
1)

複製代碼 代碼如下:
var person = new Object();//Object是javascript中最常用的一個參考型別
person.name = "zhangsan";
person.age = 30;

2)

複製代碼 代碼如下:
var person = {
    name : "zhangsan",
    age : 30    //注意此處沒有","!
};

3) 是2)與1)的結合

複製代碼 代碼如下:
var person = {};
person.name = "zhangsan";
person.age = 30;

上述3種方法中第二種是最常用的

18、對象有三種:user-defined-object(使用者自訂對象),native-object(內建對象)和host-object(宿主對象)
其中native-object是內建在javascript中的對象,如Array、Math和Date等,而host-object是瀏覽器提供的對象。

19、JavaScript中開啟一個新的視窗用:window.open(url,name,features),這三個參數都是可選擇的,說明如下:

1)url是要開啟的視窗的地址
2)name是新視窗的名字,可以通過name與新視窗進行通訊
3)features是一個以","分割的字串,如"height:300,width:200",其內容是新視窗的各種屬性

20、可以在html文檔中直接調用javascript功能,這個得使用javascript:xxxxxx的方式,其中javascript被稱為javascript偽協議
例,有某方法:function test(){}
<a href="javascript:test()">test</a>//此種方法就是使用javascript偽協議進行調用javascript方法,此種方法非常不提倡,因為不同瀏覽器對此種偽協議的支援是不一樣的。

21、很多節點的內容並不在其value中,如:<p id="desc">Hello world</p>,此時可以用var text = document.getElementById("desc").firstChild.nodeValue;
此處text得到的值為:Hello World

22、在html文檔中插入一個新元素的方法:

1)建立一個新的元素(包括其內容等)
2)把這個新元素插入節點數

說明:1)建立新元素的方法:var para = document.createElement("p");//建立一個<p></p>
此時這個元素已經具有了<p>的所有屬性,但是裡面還沒有內容,並且並未插入到文檔中
然後用var txt = document.createTextNode(text)方法建立一個文本節點內容,將這個文本節點內容插入到<p>中

2)parent.appendChild(child)//方法可以將某個child元素插入到parent元素下
包括兩部分的工作:1-將文本節點插入到<p>節點下,para.appendChild(txt);2-將<p>節點插入到其他節點下

23、set和get方法也可以為一個對象設定屬性,稱之為儲存空間屬性,它可以實現比較複雜的運算,如:

複製代碼 代碼如下:
var m = {
    x : 1,//資料屬性
    y : 1,

    get r() {return Math.sqrt(this.x*this.x + this.y*this.y);},//儲存空間屬性,此種屬性寫法:set(或get) 屬性名稱(param(set方法有)) {函數體}
    set r(newvalue) {
      var oldvalue = Math.sqrt(this.x*this.x + this.y*this.y);
      var radio = newvalue/oldvalue;
      this.x *= ratio;
      this.y *= ratio;
    }
}

24、數組的操作:

1)length屬性工作表示長度
2)join()方法:

複製代碼 代碼如下:
var a = [1,2,3];
a.join()----->"1,2,3"
a.join(" ");----->"1 2 3"
a.join("");----->"123"

3)reverse()//將數組中的元素顛倒順序
複製代碼 代碼如下:
var a = [1,2,3];a.reverse().join()--->"3,2,1"

4)sort()//將數組中的元素排序並返回排序後的數組
sort()//按照字母表的順序進行排序

複製代碼 代碼如下:
sort(function(a,b){//a、b指的是數組中的元素
    if(a>b)
    {
        return 1;
    }
    else if()
    {
        return -1
    }
    else
    {
        return 0;
    }
}
)//此種方法可以自由定義自己所需要的排序方式

5)concat()//建立並返回一個新的數組,它用於串連數組,它串連的是數組中的元素而不是數組本身

複製代碼 代碼如下:
var a = [1,2,3]
a.concat(4,5)----->[1,2,3,4,5]
a.concat([4,5])----->[1,2,3,4,5]
a.concat([4,5],[6,7])----->[1,2,3,4,5,6,7]
a.concat(4,[5,[6,7]])----->[1,2,3,4,5,[6,7]]

6)slice()返回指定數組的一個片段,可以寫兩個參數或者一個參數,一個參數代表是從參數當前位置開始一直到結尾,兩個參數是指從第一個參數到第二個參數
參數-1,指定了最後一個元素,即倒數第一個元素,而-3則指定了倒數第三個元素

複製代碼 代碼如下:
var a = [1,2,3,4,5];
a.slice(0,3);----->[1,2,3]
a.slice(3);----->[4,5]
a.slice(1,-1);----->[2,3,4]
a.slice(-3,-2);----->[3]

25、window.location = "http://www.jb51.net/";//可以用於開啟網頁

26、setTimeout()//兩個參數,一為回呼函數,二為回調時間,說明是多少毫秒之後調用此回呼函數,如:

複製代碼 代碼如下:
setTimeout(function(){alert("Hello World");},2000);//兩秒之後彈出對話方塊
clearTimeout(h);//用於取消setTimeout的調用,var h = setTimeout(func,time);

27、某個元素的單擊事件:var tempelement = document.getElementById("xx");tempelement.onclick = function(){alert("Hello");};

28、var nowtime = new Date();nowtime.toLocaleTimeString();可以顯示目前時間(註:是時間而不包含日期)

29、setInterval(func,time);//它用來註冊指定的時間之後重複調用的函數,func是重複調用的函數,time是指定的時間,單位毫秒
而clearInterval(h);是用於取消註冊的事件,其中的h是var h = setInterval(func,time);

30、無論是setTimeout還是setInterval放time設定為0時,都不是立即執行,而是將這個方法放入到隊列中,等待前面的狀態執行完畢之後才執行

31、window.location.href//可以獲得當前document載入的URL地址,window.location.search//可以得到當前文檔中?字元後面的內容,一般用於
檢測索引值對即name=value的情況

32、window的navigator屬性可以包含多個屬性:
1)appName----->Web瀏覽區的全稱
2)appVersion----->瀏覽器廠商和版本
3)userAgent----->通常包含appVersion和其他的資訊,沒有一定的格式
4)platfrom----->在其運行瀏覽器的作業系統,甚至有可能使硬體
5)onLine----->此屬性如果存在的話表示當前瀏覽器是否串連到網路
6)geolocation----->用於確定使用者地理位置資訊的介面

33、Screen對象可以獲得有關視窗顯示的大小和可用的顏色數量的資訊

34、window提供了三種對話方塊
1)alert-->提示對話方塊
2)confirm()----->也是顯示一條資訊,但是要求使用者確定或者取消,例:var correct = confirm("hello world"); if(correct){return true}
3)prompt()----->顯示一條資訊,等待使用者輸入並返回那個字串

35、window提供了模態對話方塊的顯示方案:showModalDialog(param1,param2,param3)//
參數一:用以指定提供對話方塊HTML內容的URL
參數二:可以是一個任意值,這個值在對話方塊裡的指令碼中可以通過window.dialogArguments屬性的值訪問。
參數三:是一個非標準列表,包含以分號隔開的name=value對,如果提供了這個參數就可以配置對話方塊的尺寸和其他屬性,用dialogwidth和dialogheight來
設定對話方塊視窗的大小,用"resizable = yes"來允許使用者改變視窗大小

36、name屬性也可以用來獲得某些元素,但是name屬性只在少數html元素中有效:表單<form>,表單元素,<iframe>和<img>元素
document.getElementsByName();//獲得所有name屬性群組成的數組

37、由於曆史原因,只有<form>,<img>和那些有href屬性的<a>,才有document.forms.id//name為form標籤的id,其他元素是不可以的

38、getElementsByClassName();可以取得parent節點下的相同的className的子節點

39、Node節點的重要屬性說明如下:
1)parentNode----->給節點的父節點,假如是document對象則它的父節點是null
2)childNodes----->唯讀類數組節點,它是該節點的子節點
3)firstChild和lastChild,該節點的第一個子節點和最後一個子節點
4)nextSibling、previoursSibling,該節點的兄弟節點的前一個和後一個
5)nodeType----->該節點的節點類型,是返回一個數值,9代表document節點,1代表Element節點,3代表Text節點,8代表Comment節點,11代表DocumentFragment節點
6)nodeValue----->text節點或Comment節點的常值內容
7)nodeName----->元素的標籤名,以大寫形式表示

40、在Html中可以建立一個可編輯的地區元素,方法:

複製代碼 代碼如下:
<div id="editor" contenteditable>Click to Edit</div>,可以通過innerHTML 屬性擷取其中的內容;
var editor = document.getElementById("editor"); alert(editor.innerHTML);//顯示所有內容,包括<br>等

41、window.onload中載入兩個function的方法window.onload=function(){
    //此處寫兩個function
    func1();
    func2();
}

42、對Element設定css屬性的方法:

複製代碼 代碼如下:
var tip = document.createElement("dd");//建立一個元素
tip.style.cssText = "position:absolute;bottom:0;height:20px;width:380px;padding:10px;color:#fff;background:#fff;";//設定元素的css屬性

查看更多JavaScript的文法,大家可以關註:《JavaScript 參考教程》、《JavaScript代碼風格指南》,也希望大家多多支援雲棲社區。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.