變數命名
變數名：字母 數字 下劃線 美元符$
jquery: $ $.each() $ === jQuery
underscore( js的一個函式庫) : _ _.each()
關鍵字 : if for
保留字 : class
推薦有意義的命名：
buttonCancel button_cancel btnCancel
資料型別和堆疊
基本型別（可以修改） : 4 str true undefined null
參考型別（不能修改） : { } [ ]
var score = 40; score = 50;
上面屬于覆寫，不屬于修改
var str = "hello"; var newStr = str.replace("h", ""); document.write( str + "/" + newStr);
字串操作回傳新的字串，原字串沒有改變
var obj = {}; console.log(obj); obj.name = "cyy"; obj.age = 25; obj.name = "cyy2"; delete obj.age; console.log(obj);
參考型別的屬性可以添加，可以修改，可以洗掉
var name = "cyy"; name.age = 25; console.log(name.age);//undefined
基本型別不能添加屬性
str.replace()
1->Number
"str"->String
不是基本型別有屬性和方法，而是通過基本型別找到其包裝物件，包裝物件會把屬性和方法借給該基本型別的變數
基本型別保存在堆疊記憶體中，按值訪問（直接訪問）
參考型別保存在堆記憶體中，但是地址保存在堆疊記憶體中，按參考訪問（需要中轉）
變數比較和值的賦值
var obj1 = { age: 24, num: 1 } var obj2 = { age: 24, num: 1 } console.log(obj1 === obj2);//false
基本型別的比較就是值的比較，只要值相等即為相等
參考型別，實際上是開辟了各自的記憶體空間，雖然內容相等，但是并不是一個地址
只有當指向同一個參考的時候，才為相等
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
var obj1 = {
age: 24,
num: 1
}
var obj2 = obj1;
console.log(obj1 === obj2);//true
</script>
</body>
</html>
此時obj2保存的是obj1的地址，因此相等
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
var obj1 = {
age: 24,
num: 1
}
var obj2 = {
age: 24,
num: 1
}
function equelObj(a, b){
for(var i in a){
if(a[i] !== b[i]) return false;
}
return true;
}
console.log(equelObj(obj1, obj2));//true
</script>
</body>
</html>
以上方式可以比較兩個物件的內容是否相等
function equelArr(a, b){ if(a.length !== b.length) return false; for(var i=0; i<a.length;i++){ if(a[i] !== b[i]) return false; } return true; }
以上方式比較兩個陣列的內容是否相等
var name1 = "cyy"; var name2 = name1; console.log(name2);//cyy name2 = "cyy2"; console.log(name1);//cyy
基本型別復制是值的復制，兩個變數互不干涉
var obj1 = { name: "cyy", age: 24 } var obj2 = obj1; obj2.age++; console.log(obj2.age);//25 console.log(obj1.age);//25
參考型別復制是地址的復制，二者指向同一個地址，一個改變另一個也會發生改變
var obj1 = { name: "cyy", age: 24 } function copyObj(a){ var newObj = {}; for(var i in a){ newObj[i] = a[i]; } return newObj; } console.log(copyObj(obj1));
以上方法是復制一個物件的內容，但不是參考的同一個地址
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
var obj1 = {
name: "cyy",
age: 24,
hobby: []
}
function copyObj(a){
var newObj = {};
for(var i in a){
newObj[i] = a[i];
}
return newObj;
}
console.log(copyObj(obj1));
</script>
</body>
</html>
該方式屬于淺拷貝，如果物件中某個屬性本身是參考型別，則復制時又會該屬性又會指向同一個地址，需要用到遞回解決
jquery 中的 $.extend 既可以進行淺拷貝，又可以進行深拷貝
不使用新的變數，來對換兩個變數的值
var a = 3; var b = 4; a = a + b; //a=7 b = a - b; //b=3 a = a - b; //a=3
一個很奇葩的規則：賦值才會改變參考的地址，但是添加與修改內容不會改變地址
var a=[4]; var b=a;//此時b與a指向同一個空間 a=[4] b=[4] a=[4,44];//此處a被重新賦值，指向了另一個空間；b仍舊指向原來的空間 console.log(a);//(2) [4, 44] console.log(b);//[4] a=b;//此時a又指向了b的空間 a=[4] b=[4] b.push(44); console.log(a);//(2) [4, 44]
引數傳遞和型別檢測
function add(a,b){ return a+b; } console.log(add(3,4));//7
a,b是形參，3,4是實參
function addName(obj){ obj.name="cyy"; } var me={}; addName(me); console.log(me.name);//cyy
參考型別的引數傳遞（實質上也是值傳遞）
function addName(obj){ obj.name="cyy";//me.name=cyy（值傳遞) obj={};//obj指向了一個新的地址，但是me依舊指向老的地址 obj.name="cyy2";//對新的地址進行操作 } var me={}; addName(me); console.log(me.name);//cyy
以上證明：由于參考型別作為引數時，實質上也是值傳遞，因此當形參被指向新的地址時，并沒有對實參進行操作，因為二者并不是指向同一個地址
typeof 檢測資料型別，回傳值都是字串型別
陣列和物件都是回傳object
instanceof Array 判斷是否是陣列的實體
instanceof Object 判斷是夠是object的實體（陣列也是Object的實體，所有東西都是object的實體）
console.log([] instanceof Array);//true console.log({} instanceof Array);//false console.log([] instanceof Object);//true console.log({} instanceof Object);//true
不用第三個引數，對換兩個參考型別的變數值
var a = {name: 'xm'}, b = [4]; a=[a,b];//[{name: 'xm'}, 4] b=a[0];//b={name: 'xm'}; a=a[1];//a=[4]
null是Null型別，屬于基本型別
console.log(typeof null);//object console.log(null instanceof Object);//false
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/149814.html
標籤：JavaScript
上一篇：兩種存盤思路
下一篇：JavaScript面向物件編程