DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> JavaScript核心語法總結(推薦)
JavaScript核心語法總結(推薦)
編輯:JavaScript基礎知識     

本文介紹了JavaScript的基本(常用)語法,供大家參考。

Overview

先說一下Javascript該怎麼寫。兩種形式,一種是直接把JavaScript寫在HTML頁面裡,另一種是存在*.js文件裡然後在頁面內引用。

直接寫時,即可以放在<head> </head>內,也可以放在<body> </body>內。一般函數是放在<head>區的,具體的執行代碼是在<body>區裡的。例如,在body裡寫:

<body>
<script>
   document.writeln("haha <br/> ");
</script>
</body>

引用方式

<script type="text/javascript" src="js_css/menutree.js"></script>

執行順序與生命期

JavaScript是從上到下依次執行/解析的。在調用一個function或時,必須保證該function已經被解析/聲明了。這也是一般要把function定義放在<head>內的原因。

所有的function與變量只在本頁面內有效,當離開頁面後,新的頁面內無法訪問上一頁內聲明的變量或函數。如果一定要訪問的話,可以用Cookie也存一下,到下一頁再讀出來。

syntax - 變量

變量定義就以var開頭即可,就可以定義了一個變量了。放在函數體內的就認為局部變量,外面的就是全局變量。需要指出的是,JavaScript的語法是很亂的,變量也有別的定義方法。但是希望大家不要使用其他亂七八糟的語法,就使用這種最常見的語法就可以,足夠用,而且省腦筋。

關於變量大家需要明白

(1) 變量是弱類型的,一個整數甚至可以與字符串直接相加,得到一個字符串

(2) 所謂全局變量,也只是在當前頁面內有效,當頁面被unload跳到另一個頁面時,所有的變量都被銷毀了。這些全局變量跟流覽器(也稱為User Agent)內嵌變量有區別,每個頁面都自動有window, document這些內嵌對象。

(3) 不區分單引號還是雙引號

<script>
  // 變量定義
  var nNumOfBytes = 10;
  var fPercent = 0.32;
  var strYourName = ‘Mr.Known';
  var pRect = new Object();

</script>

syntax - 函數

<script>
  function goToUrl(strUrl)
  {
    location.href = strUrl;
  }
</script>

函數可以在HTML事件/ FORM / JavaScript 中被調用,如:

HTML元素事件回調:

<body onload="goToUrl('http://www.jb51.net')" >

FORM元素事件回調

<select name="somelist" onchange="onSomeThingChanged()">

超鏈接目標

<a href="javascript:goToUrl('www.jb51.net')" > go </a>

直接在JavaScript中調用

<script>
    goToUrl(”www.jb51.net");
</script>

syntax - 類

一般的JavaScript是不需要使自定義類的,就是說一般不會到達這麼復雜的程度。因為是腳本語言嘛,隨便寫幾句就好。一是難調試,二是不便閱讀。但是如果一定要寫什麼復雜的功能,如菜單樹之類的,那麼就得寫一點類來完成了。

同樣,類在JavaScript裡也是有2種定義格式的,我們會下面的格式就好了,另一種格式很爛,還是不要知道為好。

先來個不帶構造參數的:

<script>
  function SampleClass()
  {
    // 變量變量定義
    this.nId = 10;
    
    // 成員函數定義
    this.plusId = function (nPlus)
    {
      return this.nId + nPlus;
    }
  }
</script>

再來一個造參數的類

function MenuItem(l, h, t)
  {
    this.label = l;
    this.href = h;
    this.target = t;
    
    this.toHtml = function()
    {
      var html = "<a href='" + this.href + "' ";
        
      if(this.target != null)
        html += (" target='" + this.target + "' ");
        
      html += " >" + this.label + "</a>";      
      return html;
    }
  }

創建類的實例

var item = new MenuItem("haha", http://www.jb51.net, null);

關於類,注意以下幾點:

(1) 不要從頭寫一個類,請從我這裡copy過去再改,這樣就不會有那些莫名其妙的麻煩了

(2) 在成員函數裡引用成員變量,一定要加this.,不然引用不到

(3) 成員函數如果想返回值,就用return,想return什麼類型都不必事先聲明,直接return就好

(4) 對於學習C++和Java的程序員來說,要明白var p = new SomeClass();這句中的new其實就是創建一個對象並返回其指針

(5) 考慮使用Object類

syntax - Object類

JavaScript語法很亂的,腳本語言嘛,要求不要太高。雖然可以自定義類,但大數多情況下都不需要自己聲明一個類,可以直接使用Object類來定義一個結構,而無需事先聲明這個結構的形式。
如:

function createObject()
{
  var obj = new Object();
  obj.x = 10;
  obj.y = 11;
  return obj;
}

看到沒,這個函數隨意的創建了一個object,為其添加成員 x, y,並沒有通知任何人(無prototype聲明)。而使用者也是直接就可以調用其 o.x , o.y,無需要猜測。

<script>
  var o = createObject();
  document.writeln("x=" + o.x + ", y=" + o.y);  
</script>

不過為了安全起見,也可以寫成這樣:

var o = createObject();

  if(o.x != null && o.y != null)
  {
    document.writeln("x=" + o.x + ", y=" + o.y);  

  }

syntax - 數組Array

<script>
  // 創建
  var a = new Array();
  // 遍例
  for(var i=0; i<a.length; i++)
  {
    var e =   a[i];  
  }
  // 添加
  var item = new MenuItem("000");
  this.itemArray.push(item);
</script>

怎麼刪除一個元素?記得是直接賦值為null,過後測一下再補充。

數組作為成員變量

function Menu()
{
  this.itemArray = new Array();
 
  this.addItem = function(l, h, t)
  {
    var item = new MenuItem(l,h,t);
    this.itemArray.push(item);
  };        
}

以上這篇JavaScript核心語法總結(推薦)就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved