1. 程式人生 > >ECMAScript 5.0 基礎語法(上)

ECMAScript 5.0 基礎語法(上)

if...else 執行 javascrip 標簽 col 引號 條件 ide score

銀子:

   一般來說,一門編程語言的基礎語法都是大同小異的。比如,python的基礎語法,包括:數據類型,變量,作用域,運算符,流程控制(if...else...語句),循環,編碼,數據類型的操作(增刪改查、切片),常用的內置函數,常用的內置模塊,以及規範化的開發結構。JavaScript也是類似的。ECMAScript就是JavaScript最基礎的語法。

一、JS是啥?

  一個網頁開發,主要用的語言組合是html+css+JS,其中,htnl用來搭建頁面的結構(控件,段落,標簽,鏈接什麽的),css用來美化頁面,JavaScript負責交互。

  JS的組成:(1)ECMAScript5.0:語法標準 (2)DOM:操作頁面元素API (3)BOM:操作瀏覽器的部分API

二、JS的引入方式

<!-- 內接式 -->
<script type="text/javascript">
</script>
<!-- 外接式 -->
<script type="text/javascript" src="./JS/text.js"></script>

三、調試語句

<!-- 建議在body之後 書寫腳本js代碼 -->
    <!-- 1.內接式 -->
    <script type="text/javascript">
        // ;分號 作為js代碼一句話的結束符
// 彈出警告框 alert(我彈); // 控制臺輸出 console.log(alex);

四、變量和命名規範

需要用var關鍵字,需要加分號結尾:例如 var a = 100;

命名規範:由英語字母、數字、下劃線組成。跟python和大部分語言類似。

五、基本數據類型

技術分享圖片
 1          // 1.number
 2          // var $  = 100;
 3          // console.log($);
 4          //  typeof 變量名
 5          var a  = 100;
 6
console.log(typeof a); //number 7 8 var b = 5/0; 9 console.log(b); //Infinity 無限大 10 console.log(typeof b); //number類型 11 12 13 // 2.string 14 15 16 var a = ‘alex‘; //單引號 和雙引號 都可以表示字符串 17 console.log(typeof a);//string類型 18 19 var b = ‘‘; 20 console.log(b); 21 console.log(typeof b); 22 23 24 25 26 // + 可能是連字符 也可以是數字的加號 27 28 // 字符串 + 數值 相當於字符串的拼接 29 console.log(‘我‘+‘哎‘+1); 30 // 數字和數字相加 是加號 表示運算 31 console.log(1+2+3); 32 // 小技巧 將數值類型轉換成字符串類型 33 var c = 10+‘‘; 34 console.log(typeof c); 35 36 37 38 // 3.boolean 39 var isShow = 1>1; 40 console.log(typeof isShow); 41 42 // 4.null 空對象 43 var d = null; //空對象 object 44 console.log(typeof d); 45 46 // 5.undefined 未定義的 47 48 var d1; 49 console.log(d1); //值 是undefined 50 console.log(typeof d1); //undefined 數據類型
基本數據類型 技術分享圖片
 1 // 1.將number類型轉換成string類型
 2 
 3         //1>隱式轉換 小技巧
 4         var n1 = 123;
 5         var n2  = ‘123‘;
 6         console.log(n1+n2);
 7 
 8 
 9         //2> 強制轉換
10 
11         // String() toString()
12         var  str1 = String(n1);
13         console.log(typeof str1);
14 
15         var num  = 2334;
16         var numStr = num.toString();
17         console.log(typeof numStr);
18         
19 
20         //2.將字符串類型轉換成number類型
21 
22         var stringNum = ‘131313‘;
23         var num = Number(stringNum);
24         console.log(num);
25         console.log(typeof num);
26 
27 
28         var stringNum2 = ‘13.1313fjkafbh13233dkjf‘;
29         var num2 = Number(stringNum2);
30         console.log(num2);// NaN Not a Number
31         console.log(typeof num2);
32 
33         // parseInt() parseFloat() 解析字符串,並且返回整數和浮點型
34         console.log(parseInt(stringNum2));//13
35         console.log(parseFloat(stringNum2));//13.1313
強制類型轉換

六、流程控制

技術分享圖片
 1 var age = 1313;
 2     if (age == 18) {
 3         //{}相當於作用域
 4         console.log(‘可以去會所‘);
 5     } else if (age == 30) {
 6         console.log(‘該娶媳婦了!!‘);
 7     } else {
 8         console.log(‘隨便你了‘)
 9     }
10     console.log(‘alex‘); //下面的代碼照樣執行
if...else語句 技術分享圖片
// switch
        var gameScore = ‘good‘;

        /*
        if (gameScore  == ‘better‘) {

        }else if(gameScore == ‘good‘){

        }else if(gameScore == ‘best‘){

        }else{
            
        }
        */
        switch (gameScore) {
            case ‘good‘:
                console.log(‘玩的很好‘);
                // switch語句 case表示一個條件,滿足這個條件就會輸出,直到遇到break跳出,如果你的breakb不寫,那麽程序會遇到下一個break停止。這個就是‘case穿透’
                break;
            case ‘better‘:
                console.log(‘玩的老牛逼‘);
                break;
            case ‘best‘:
                console.log(‘恭喜你,吃雞成功‘);
                break;
            default:
                console.log(‘很遺憾,被淘汰了‘);
                break;
        }
switch語句 技術分享圖片
 1 // 1. 初始化循環變量
 2     // 2. 判斷循環條件
 3     // 3. 更新循環變量
 4     // 例子: 打印1~10之間的數
 5 
 6     
 7     // 初始化循環變量
 8     var i = 1;
 9     // 判斷循環條件
10     while (i <= 10) {
11         console.log(i);
12         // 更新循環變量
13 
14         // i = i+1;
15         i+=1;
16     }
17 
18 
19 //do_while循環
20         // 用途 不大,就是不管條件如何 上來先做一次,  然後再去循環
21 
22         var i = 3;
23         do{
24             console.log(i);
25 
26             i+=1;
27         }while(i < 10);
while循環 技術分享圖片
 1         // 輸出1~100之間的數
 2         for(var i = 1; i <= 100; i ++){
 3             console.log(i);
 4         }
 5         
 6 
 7         
 8         // 1.輸出1~100之間所有數之和
 9         var sum = 0;
10         for(var i = 1; i <= 100; i ++){
11             sum = sum + i;
12         }
13         console.log(sum);
14         
15 
16         //2. 將1~100所有是2的倍數在控制臺打印
17         
18         for(var i = 1;i <= 100; i ++){
19             if (i % 2 == 0) {
20                 console.log(i);
21             }
22         }
for循環 技術分享圖片
 1 // document.write 往頁面上寫入內容
 2 
 3         // document.write(‘<h1>alex</h1>‘);
 4 
 5         for(var i = 0; i < 3;i++){ //控制著你的行數
 6             for(var j = 1;j <=6;j++){ //控制的星星
 7                 document.write("*");
 8             }
 9 
10             document.write(‘<br>‘);
11         } 
雙重for循環

上篇(完)!

ECMAScript 5.0 基礎語法(上)