04、js-基礎
阿新 • • 發佈:2020-09-06
1 """ 2 ECMAjavascript 3 4 ECMAjavascript5 -- es5 5 6 ECMAjavascript6 -- es6 7 8 ECMAjavascript 三部分 9 10 """
一、javascript引入方式
""" 方式1:script標籤中寫js程式碼 <script> js程式碼 </script> 方式2:建立.js結尾的檔案,寫js程式碼,通過script標籤的src屬性來引入 <script src="xx.js"></script> 建議放到body標籤下面"""
二、變數
// 宣告變數時 可以不用var. 如果不用var 那麼它是全域性變數. // 變數命名,首字元只能是字母,下劃線,$符,區分大小寫 var a = 10; 宣告變數 var b; 只宣告沒有賦值,預設值為undefined
三、資料型別
1、數值型別
// number型別 var a = 11; var b = 11.11; typeof a; number typeof b; number // + - * / % 都行,沒有取整
2、字串
var s = '欣慰'; typeof s; //"string" //索引取值:s[0]; s.charAt(1); /切片: s.substring(起始值,結束值); 都是索引值 /移除兩端空格: var a = ' hello '; a.trim(); a.trimLeft(); a.trimRight();
3、布林型別
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script> console.log(true); console.log(false);var y=1; if(1){ y = y+1; alert(y) } else { y = y-1; alert(y) } </script> </body> </html>
4、undefined和null型別
""" Undefined: 型別只有一個值,即 undefined。當宣告的變數未初始化時, 該變數的預設值是 undefined。 當函式無明確返回值時,返回的也是值 "undefined"; null: 變數不用了,就可以給變數賦值為null,--- object型別 """
四、陣列
var names = [11,22,33]; //陣列常用方法: names[0] //索引,索引也是從0開始的 //尾部追加移除 names.push(ele) // 尾部追加元素 //示例:a.push('xx'); -- [11, 22, 33, "xx var ele = names.obj.pop() // 尾部移除一個元素 //示例:a.pop(); -- [11, 22, 33] //頭部插入移除 names.unshift(ele) // 頭部插入元素 //示例:a.unshift('ssss'); -- ["ssss", 11, 22, 33] var ele = obj.shift() // 頭部移除一個元素 //示例:a.shift(); -- [11, 22, 33] names.splice(index,0,ele) // 在指定索引位置插入元素 //names.splice(從哪刪(索引),刪幾個(個數),刪除位置替換的新元素(可不寫,可寫多個)) names.splice(index,1,ele) // 指定索引位置替換元素 names.splice(index,1) // 指定位置刪除元素 //示例: a.splice(1,2) -- [11, 22, 33] a.splice(1,1,'xx','oo','asdf'); -- [11, "xx", "oo", "asdf", 33] //切片 names.slice(start,end) // 切片 //示例:a.slice(1,3);-- [22, 33] names.reverse() // 原陣列反轉 //示例:a.reverse(); -- [44, 33, 22, 11] names.join(sep) // 將陣列元素連線起來以構建一個字串 //示例: var a = ['ni','hao','ma',18] //a.join('+'); -- "ni+hao+ma+18" names.concat(val,..) // 連線陣列 //示例: var a = [11,22]; var b = ['aa','bb'] //var c = a.concat(b); c --[11, 22, "aa", "bb"] names.sort() // 對原陣列進行排序 //很尬! //需要自己定義規則: function compare(a,b){ return a - b; 當大於0時,兩個資料換位置 }; //使用: a.sort(compare); 升序排列
五、自定義物件型別
// 宣告 info = { name:'武沛齊', "age":18 } var a = {username:'xx',password:'123'}; //可以不加引號 typeof info; "object" // 常用方法 var val = info['name'] // 獲取,通過鍵取值必須加引號, info.name 也是可以的 info['age'] = 20 // 修改 info['gender'] = 'male' // 新增 delete info['age'] // 刪除
建立物件:
var a = new String('ss') typeof a; 'object'
六、流程控制
var a = 0; if(a > 1){ console.log('1111'); // var hhhh = document.getElementById('d1'); // hhhh.innerText = '彭于晏'; }else if(a<1){ console.log('2222'); }else { console.log('3333'); }
七、運算子
1、比較運算子
// > < == != >= <= === !== var a = 2; var b = '2'; a == b; true 弱等於 a === b; false 強等於 a != b; false a !== b; true
2、算數運算子
// + - * / % ++ -- // ++ 自增 1 // -- 自減 1 var a = 2; // a++ 先執行邏輯 在+1 // ++a 先+1 在執行邏輯 // 簡單示例: if (++a === 4){ console.log('xxx'); } else{ console.log('ooo'); };
八、迴圈
1、for迴圈
// 迴圈陣列 // 方式1: for (var i in a){ console.log(i,a[i]); } // 方式2 for (var i=0;i<a.length;i++){ console.log(i,a[i]); } for (var i=0;i<10;i++){ console.log(i); } // 迴圈自定義物件 var d = {name:'chao', age:18}; for (var i in d){ console.log(i,d[i]); } //不能用下面的屬性取值的方法 for (var i in d){ console.log(i,d.i); }
2、while迴圈
var a = 0; undefined while (a < 10){ console.log(a); a++; }
九、函式
1、普通函式
function f1(a,b){ return a+b; } // 執行: f1(1,2) -- 3 function f1(a,b){ return a,b; }; // f1(1,2); // 不能返回多個值: 2
2、匿名函式
var a = function (a,b){ console.log('xxx'); } var d = {'xx':'oo','f':function (a,b){ console.log('xxx'); }}; // 執行:d.f(1,2);
3、自執行函式
(function () { alert('自執行函式!') })()
十、json序列化
import json // JSON var d_json = JSON.stringify(d); // 序列化 var xx = JSON.parse(d_json); // 反序列化