JavaScript基礎語法

JavaScript基礎語法javascript

 

1、JavaScript的歷史html

JavaScriptNetScape公司推出的,最初叫LiveScript,後面才更名JavaScriptjava

微軟推出了基於IE瀏覽器的Jscript                           數組

 

2、JavaScript的做用、運行機制瀏覽器

做用:ide

表單驗證spa

頁面動態效果htm

動態改變頁面內容對象

 

運行機制:blog

wKiom1gIwiaDHiNgAAEtnfbdCd0495.png

 

3、JavaScript的基本語法

wKiom1gIwjSDrmWJAAAwAl4t6r8078.png

ECMAScript:核心語法

DOM:文檔對象模型

BOM:瀏覽器對象模型

 

ECMAScript 描述瞭如下內容:

  • 語法

  • 類型

  • 語句

  • 關鍵字

  • 保留字

  • 運算符

  • 對象

DOM

wKiom1gIwkKiBAUGAABGm8sZXEs400.png

 

BOM

 

wKioL1gIwk-Q3USLAAA3lDrUWRc373.png

 

◆語法結構:

<scripttype="text/javascript「>

    <!--

          JavaScript 語句;

    -->

</script>

說明:<!--  -->是爲了兼容老版本不支持JavaScript腳本的瀏覽器

 

案例一:

wKiom1gIwlzgkOADAAAdy5jSuNk808.png

 

 

JavaScript三種使用方式

1.內部JavaScript

<script type="text/javascript「>

   <!--

         JavaScript 語句;

   -->

</script >

 

2.外部JavaScript

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

3.行內JavaScript

<input name="btn"type="button" value="彈出消息框"  onclick="javascript:alert('歡迎你');"/>

 

 

 

 

◆核心語法

1.註釋

<html>

<head>

<title>第一個JavaScript程序</title>

</head>

<body>

<script type="text/javascript">

//單行註釋

/*

多行註釋

多行註釋

*/

document.write("Hello world");

</script>

</body>

</html>

 

2.變量

JavaScript是弱類型的語言,定義時不須要直接指定變量的類型,統一使用var

 

案例一:先聲明,再賦值

var age,name;

age = 10;

name = 「xm」

案例二:聲明同時賦值

var age = 10;

var name=」xm」;

案例三:不聲明,直接賦值

age = 10;

name = 「xm」

 

3.數據類型

數值型             

字符型             

布爾型             

null空值

undefined未定義

 

3  typeof運算符返回值以下:

2  undefined:變量被聲明後,但未被賦值

2  string:用單引號或雙引號來聲明的字符串

2  booleantruefalse(沒有雙引號的)

2  number:整數或浮點數

2  objectjavascript中的對象,數組和null

 

案例:


        var age = 20.5

        var name = "xm"

        document.write(typeof age);

        document.write("<br/>");

        document.write(typeof name);

 

4.運算符

wKiom1gIwmmzbtv2AAAk2PvZ2C4290.png

 

 

5.邏輯控制
        
順序結構

         分支結構:

                  if…else…

                  switch

         循環結構

                  while

                  do…while

                  for

 

         循環中斷

                  break:結束整個循環

                  continue: 跳過當前這一次循環

 

6.輸入輸出

3  alert():js彈出提示信息。

alert(「提示信息」);

3  prompt():提示信息,並得到輸入的值。

prompt(「提示信息」, 「輸入框種的默認值」);

prompt(「請輸入姓名」, 「張三」);

prompt(「請輸入姓名」);

 

3  confirm():顯示帶有一段消息以及確認按鈕和取消按鈕的對話框。

          

<script type="text/javascript">

var x = confirm("是否清空購物車?");

if(x){

alert("購物車已清空,請從新選擇商品!");

}else{

alert("請付款!");

}

</script>

 

         案例:

wKiom1gIwnXwVQcAAAEp14tXSTw574.png

<html>

<head>

<script type="text/javascript">

var a = prompt("請輸入你第一個數:");

var b = prompt("請輸入你第二個數:");

var oper = prompt("請輸入運算符:","eg: +  -  *  /");

a = Number(a);

b = Number(b);

if(oper=="+"){

var sum = a+b;

alert(a+"+"+b+"="+sum);

}else if(oper=="-"){

var sum = a-b;

alert(a+"-"+b+"="+sum);

}else if(oper=="*"){

var sum = a*b;

alert(a+"*"+b+"="+sum);

}else if(oper=="/"){

var sum = a/b;

alert(a+"/"+b+"="+sum);

}

</script>

</head>

<body>

</body>

</html>


 

7.語法約定

3  代碼區分大小寫

3  每一行能夠沒有分號,可是建議統一帶上

3  命名變量

變量名須要遵照兩條簡單的規則:

·        第一個字符必須是字母、下劃線(_)或美圓符號($)

·        餘下的字符能夠是下劃線、美圓符號或任何字母或數字字符 

相關文章
相關標籤/搜索