js內容回顧

1. 內容回顧
    JavaScript語法基礎
        1. 引入方式
            1. 在script標籤中直接寫
            2. 寫在單獨的JS文件中,經過script標籤的src屬性來導入
        2. 變量
            1. 命名規則: 字母\數字\下劃線和$組成,數字不能開頭
            2. 聲明變量: 要用var 關鍵字
            3. 動態類型: 同一個變量能夠保存不一樣類型的數據
        3. 數據類型
            1. 數字類型(number類型)
                1. 100
                2. 11.11
                3. NaN(not a number)
            2. 字符串類型(string類型)
                1. 內置的屬性和方法
                    .length
                    
                    ...
                parseInt("100")     --> 獲得number類型的100
                parseFloat("11.11") --> 獲得number類型的11.11
            3. 布爾類型(boolean類型)
                true和false
                
                ""\0\null\undefined\NaN都是假
            4. 數組(array)
                ["alex", 18]
                經常使用屬性和方法
                
                數組的遍歷:
                    for (var i=0;i<a.length;i++){
                        console.log(i, a[i]);
                    }
            5. null和undefined
                null: 表示值爲空,多在手動清空一個變量的時候使用
                undefined: 聲明瞭一個變量可是沒有給它賦值時,它就是undefined
                
                函數沒有返回值的話默認返回的是undefined
                
                (衛生紙的例子)
            6. typeof 判斷變量類型
                typeof "123"     --> string
                typeof 123       --> number
                typeof true      --> boolean
                
                typeof null      --> object
                typeof undefined --> undefined
                
                typeof [11, 33]  --> object
                
            7. 運算符
                算術運算符  +-*/ ++ -- % 
                邏輯運算符  && || !
                比較運算符  > >= < <= == != === !==
                    null == undefined  --> true
                    null === undefined --> false
                賦值運算符 = -= += *= /=
                
            8. 流程控制
                1. if else
                2. if(){...}else if(){...}else{...}
                3. while(){...}
                4. switch (today){
                    case 1:
                    ...
                    break;
                    case 2:
                    ...
                    break;
                    default:
                    ...
                }
                5. for (條件){...}
                6. 三運運算
                    var x = 10;
                    var y = 20;
                    var a = x>y?x:y           Python中:a = x if x > y else y
            9. 函數
                1. 三種定義方式
                    1. function func(a,b){...}
                    2. var sum = function (a,b){...}
                    3. (function(a,b){...})(10, 20)
                2. 函數的傳參沒有限制
                    在函數體內部經過arguments對象
                    arguments.length
                3. 全局變量和局部變量
                    函數體內部定義的是局部變量,函數執行完以後就銷燬(刪除)
                    所有變量在窗口關閉以後銷燬(刪除)
                
                4. 做用域
                    函數執行的時候必定要回頭看函數的定義階段
                5. 詞法分析(瞭解便可)
                    在真正執行代碼以前,會先進行詞法分析!!!
                    詞法分析會生成一個AO對象!!!
                    三條規則:
                        1. 看有沒有函數參數
                        2. 看有沒有局部變量聲明
                        3. 看有沒有函數聲明
    2. 面試題:
        
                
    3. 內置對象和方法
        1. 內置對象介紹
        2. Date對象
            1. 如何建立一個Date對象
            2. Date對象的經常使用方法
        3. RegExp
            注意三個坑
        4. Math
            跟數學相關的方法
            
    4. JS
        1. JS語法基礎
        2. BOM        --> 操做瀏覽器
        
            window對象
                location.href                        --> 獲取當前的網址
                location.href="http://www.sogo.com"  --> 跳轉到指定的網址
                location.reload()                    --> 從新加載當前頁
            
            多少毫秒以後執行
                var t = setTimeout(f,5000)
                clearTimeOut(t)
                
            每隔多少毫秒以後執行
                var t = setInterval(f,5000)
                clearInterval(t)
            
            
        3. DOM        --> 操做文檔(HTML\CSS)
                
                
3. 做業:
        1. 整理今日課上內容的博客(筆記)
        2. CSS小米商城的做業繼續寫
        3. 預習DOM內容:http://www.cnblogs.com/liwenzhou/p/8011504.html

 

課上截圖：

1     字符串的倆種寫法：就是圖中的兩個方法

js內置方法介紹：

 

js自定義對象：

便利對象中內容：（同Python字典相似）

 

json類型之間的互相轉化。

var str1 = '{"name": "Alex", "age": 18}';
var obj1 = {"name": "Alex", "age": 18};
// JSON字符串轉換成對象
var obj = JSON.parse(str1); 
// 對象轉換成JSON字符串
var str = JSON.stringify(obj1);

 

js正則表達式：

//RegExp對象

//建立正則對象方式1
// 參數1 正則表達式(不能有空格)
// 參數2 匹配模式：經常使用g(全局匹配;找到全部匹配，而不是在第一個匹配後中止)和i(忽略大小寫)

// 用戶名只能是英文字母、數字和_，而且首字母必須是英文字母。長度最短不能少於6位 最長不能超過12位。

// 建立RegExp對象方式（逗號後面不要加空格）
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");

// 匹配響應的字符串
var s1 = "bc123";

//RegExp對象的test方法，測試一個字符串是否符合對應的正則規則，返回值是true或false。
reg1.test(s1);  // true

// 建立方式2
// /填寫正則表達式/匹配模式（逗號後面不要加空格）
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;

reg2.test(s1);  // true

// String對象與正則結合的4個方法
var s2 = "hello world";

s2.match(/o/g);         // ["o", "o"]             查找字符串中 符合正則 的內容
s2.search(/h/g);        // 0                      查找字符串中符合正則表達式的內容位置
s2.split(/o/g);         // ["hell", " w", "rld"]  按照正則表達式對字符串進行切割
s2.replace(/o/g, "s");  // "hells wsrld"          對字符串按照正則進行替換

// 關於匹配模式：g和i的簡單示例
var s1 = "name:Alex age:18";

s1.replace(/a/, "哈哈哈");      // "n哈哈哈me:Alex age:18"
s1.replace(/a/g, "哈哈哈");     // "n哈哈哈me:Alex 哈哈哈ge:18"      全局匹配
s1.replace(/a/gi, "哈哈哈");    // "n哈哈哈me:哈哈哈lex 哈哈哈ge:18"  不區分大小寫

// 注意事項1：
// 若是regExpObject帶有全局標誌g，test()函數不是從字符串的開頭開始查找，而是從屬性regExpObject.lastIndex所指定的索引處開始查找。
// 該屬性值默認爲0，因此第一次仍然是從字符串的開頭查找。
// 當找到一個匹配時，test()函數會將regExpObject.lastIndex的值改成字符串中本次匹配內容的最後一個字符的下一個索引位置。
// 當再次執行test()函數時，將會從該索引位置處開始查找，從而找到下一個匹配。
// 所以，當咱們使用test()函數執行了一次匹配以後，若是想要從新使用test()函數從頭開始查找，則須要手動將regExpObject.lastIndex的值重置爲 0。
// 若是test()函數再也找不到能夠匹配的文本時，該函數會自動把regExpObject.lastIndex屬性重置爲 0。

var reg3 = /foo/g;
// 此時 regex.lastIndex=0
reg3.test('foo'); // 返回true
// 此時 regex.lastIndex=3
reg3.test('xxxfoo'); // 仍是返回true
// 因此咱們在使用test()方法校驗一個字符串是否徹底匹配時，必定要加上^和$符號。

// 注意事項2(說出來你可能不信系列)：
// 當咱們不加參數調用RegExpObj.test()方法時, 至關於執行RegExpObj.test("undefined"), 而且/undefined/.test()默認返回true。
var reg4 = /^undefined$/;
reg4.test(); // 返回true
reg4.test(undefined); // 返回true
reg4.test("undefined"); // 返回true

 

 

 

math 方法：

 

 

js dom 

 

 

dom 定時器：

隔一段時間執行，注意特別費內存，若是多了的話。