JavaScript 相關知識
阿新 • • 發佈：2017-05-17
start gif coo 獲取時間 對象 繼續 decimal auto input
一、數組
var a = [1,2,3,4]; console.log(a.length); // 4 a.push(5); console.log(a); // [1, 2, 3, 4, 5] var ret = a.pop(); console.log(ret); // 5 a.unshift(‘aaa‘); // 頭部插入元素 console.log(a); // ["aaa", 1, 2, 3, 4] var ret1 = a.shift(); //頭部移除元素 console.log(ret1); // aaa var ret2 = a.slice(1,3); // 切片， console.log(ret2); // [2,3] // obj.splice(start, deleteCount, value, ...) 插入、刪除或替換數組的元素 console.log(a); a.splice(1,0,‘first‘); // 指定位置插入元素 a.splice(2,1,‘second‘); // 指定位置替換元素 a.splice(2,1); //指定位置刪除元素 console.log(a); var b = [‘22‘]; console.log(b.concat(a)); // 連接字符串 ["22", 1, "first", 3, 4] console.log(a.join(‘-‘)); // 拼接字符串 1-first-3-4 console.log(a.reverse()); // 反轉字符串 [4, 3, "first", 1] console.log([3,2,5].sort()) //對number數組進行排序
1、序列化
序列化就是將JavaScript中的數據類型轉換成字符串，反序列化的過程則相反
var a = ‘ss‘; ret = JSON.stringify(a); // ‘ss‘ 序列化 console.log(ret); console.log(JSON.parse(ret)); // ss 反序列化
2、轉義
一般使用在URL中字符的轉義等，下面來看一下具體的用法
// 轉義 其中escape() unescape()主要是對cookies使用 var a = ‘http://www.baidu.com?name=李傑‘; console.log(encodeURI(a)); // http://www.baidu.com?name=%E6%9D%8E%E6%9D%B0 console.log(decodeURI(encodeURI(a))); // http://www.baidu.com?name=李傑 console.log(encodeURIComponent(a)); // http%3A%2F%2Fwww.baidu.com%3Fname%3D%E6%9D%8E%E6%9D%B0 console.log(decodeURIComponent(encodeURIComponent(a))); // http://www.baidu.com?name=李傑
3、eval
JavaScript中的eval是Python中eval和exec的合集，既可以編譯代碼也可以獲取返回值。
console.log(eval(‘1+2*5-5‘)); // 6 console.log(eval(a = 1)); // 1 聲明了一個局部變量a值為1
4、正則表達式
JavaScript中支持正則表達式，其主要提供了兩個功能：
- test(string) 用於檢測正則是否匹配
- exec(string) 用於獲取正則匹配的內容
註：定義正則表達式時，“g”、“i”、“m”分別表示全局匹配，忽略大小寫、多行匹配。下面來簡單的看一下使用
var a = /\d+h/; console.log(a.test(‘123h434‘)); // true 檢測正則是否匹配，表單數據驗證可用到 console.log(a.test(‘12a34‘)); // false console.log(a.exec(‘123h434‘)); // ["123h", index: 0, input: "123h434"] 獲取正則匹配內容 console.log(a.exec(‘123e434‘)); // null
5、時間
在JavaScript中，Date對象用來表示日期和時間。JavaScript中提供了時間相關的操作，分別為獲取時間和設置時間，時間操作中分為兩種時間，統一時間(UTC),以及本地時間（東8區）
var now = new Date(); now.getFullYear(); now.getMonth(); // 6, 月份，註意月份範圍是0~11，6表示7月 now.getDate(); // 7, 表示7號 now.getDay(); // 3, 表示星期三 now.getHours(); // 19, 24小時制 now.getMinutes(); // 49, 分鐘 now.getTime(); // 1435146562875, 以number形式表示的時間戳
二、語句
1、條件語句
if(條件){ }else if(條件){ }else{ } switch(name){ case ‘1‘: age = 123; break; case ‘2‘: age = 456; break; default : age = 777; }
2、循環語句
var names = ["alex", "tony", "rain"]; for(var i=0;i<names.length;i++){ console.log(i); console.log(names[i]); } var names = ["alex", "tony", "rain"]; for(var index in names){ console.log(index); console.log(names[index]); } while(條件){ // break; // continue; }
3、異常處理
try { //這段代碼從上往下運行，其中任何一個語句拋出異常該代碼塊就結束運行 } catch (e) { // 如果try代碼塊中拋出了異常，catch代碼塊中的代碼就會被執行。 //e是一個局部變量，用來指向Error對象或者其他拋出的對象 主動跑出異常 throw Error(‘xxxx‘) } finally { //無論try中代碼是否有異常拋出（甚至是try代碼塊中有return語句），finally代碼塊中始終會被執行。 }
三、函數
1、函數類型
JavaScript中函數基本上可以分為一下三類,普通函數，匿名函數，自執行函數,此外需要註意的是對於JavaScript中函數參數，實際參數的個數可能小於形式參數的個數，函數內的特殊值arguments中封裝了所有實際參數。
// 普通函數 function func(arg){ return true; } // 匿名函數 var func = function(arg){ return "tony"; } // 自執行函數 (function(arg){ console.log(arg); })(‘123‘)
2、函數作用域
JavaScript中每個函數都有自己的作用域，當出現函數嵌套時，就出現了作用域鏈。當內層函數使用變量時，會根據作用域鏈從內到外一層層的循環，如果不存在，則異常。下面就是一個簡單其實就是簡單的閉包。
name = ‘jason‘; function f1() { var name = ‘kobe‘; function f2() { console.log(name); } return f2; } ret = f1(); ret(); //打印出kobe f2函數的作用域已經定死，上一級作用域為f1
四、面向對象
// 面向對象，沒有class 用function定義 function Person(name,age) { this.name = name; // Person充當構造函數 this.age = age; // this指代對象 } // 使用原型保存類中的函數，如果放在person中，則每創建一個 // 對象都會在內存中創建一份，這樣會浪費內存 Person.prototype = { Show:function () { console.log(this.name,this.age); } }; Person.prototype.Show2 = function () { console.log(this.name,this.age) }; person1 = new Person(‘jason‘,18); person1.Show(); // jason 18 person1.Show2() // jason 18
javascript補充
- 為了強制使用var定義變量，可以在代碼開始加上‘use strict‘,這樣未被var聲明的變量將會報錯，前提是瀏覽器支持該模式
- 可以用轉義字符
\,‘I\‘am "ok"‘ - 要獲取字符串某個指定位置的字符,可以使用s[1]下表進行操作， 如果對s[1] = ‘f‘賦值的話，不會報錯，原字符串也不會改變。調用字符串的相關方法只會產生一個新的字符串
- 對數組進行操作，var f = [1,2],f[4] = 5,超過了數組長度，但是不會報錯，相反數組f變成了 [1, 2,undefined × 2, 5]這一點需要特別註意，此外如果在pycharm中運行的話，不會出現上述情況但是會在數組中增加一個鍵值對。因此千萬要註意自己操作數組的時候不要越界
- 數組切片，
arr.slice(3)表示從索引3開始到結束，arr.slice(0, 3)表示從索引0開始，到索引3結束,arr.slice()可以復制一個數組。 - 對象，每個對象的屬性用逗號分隔，訪問不存在的屬性會返回一個undefined,可以通過delete 刪除某一屬性，當然也可以直接動態的添加某一屬性，要判斷一個對象是否有某個屬性，可以使用 in 比如 onsole.log(‘name‘ in xiaoming),但是這樣可以能有一個問題，如果xiaoming繼承了某一屬性，那麽判斷這一屬性也會成功，所以最好用 xiaoming.hasOwnProperty(‘name‘)
- 函數傳參的時候，可以多傳，也可以少傳，少傳的話，未被傳入的參數會被定義為undefined,在函數內部用arguments獲取到所有函數傳入的參數，
- 函數內部的變量會"提前聲明"，具體的請看下面的代碼
function foo() { var x = ‘Hello, ‘ + y; alert(x); // Hello, undefined var y = ‘Bob‘; } foo(); // 對於上述foo()函數，JavaScript引擎看到的代碼相當於： function foo() { var y; // 提升變量y的申明 var x = ‘Hello, ‘ + y; alert(x); y = ‘Bob‘; }
9.不在任何函數內定義的變量就具有全局作用域,實際上，JavaScript默認有一個全局對象window，全局作用域的變量實際上被綁定到window的一個屬性
var a = ‘hello‘; console.log(window.a); console.log(a); function foo() { console.log(‘foo‘); } foo(); window.foo();
可以看到上面兩種方式的執行效果一樣，JavaScript實際上只有一個全局作用域。任何變量（函數也視為變量），如果沒有在當前函數作用域中找到，就會繼續往上查找，最後如果在全局作用域中也沒有找到，則報ReferenceError錯誤。全局變量會綁定到window上，不同的JavaScript文件如果使用了相同的全局變量，或者定義了相同名字的頂層函數，都會造成命名沖突，並且很難被發現。減少沖突的一個方法是把自己的所有變量和函數全部綁定到一個全局屬性中。例如：
// 唯一的全局屬性MYAPP: var MYAPP = {}; // 其他變量: MYAPP.name = ‘myapp‘; MYAPP.version = 1.0; // 其他函數: MYAPP.foo = function () { return ‘foo‘; };
10. Array的sort()方法默認把所有元素先轉換為String再排序，結果‘10‘排在了‘2‘的前面，因為字符‘1‘比字符‘2‘的ASCII碼小。
JavaScript 相關知識