為何想要開一個(gè)javascript文集呢,主要是自己的js基礎(chǔ)太差了,決定從0開始重新學(xué)習(xí),用此系列博客記錄我自己的學(xué)習(xí)路程。
值和引用
在javascript中,我們有兩種方法來(lái)保存數(shù)據(jù):值和引用。這里要提一下js的基本數(shù)據(jù)類型和引用類數(shù)據(jù)類型。
基本數(shù)據(jù)類型:Null,undefined,boolean,String,Number,以及es6新加的symbol(一但創(chuàng)建就不可修改)。
引用類數(shù)據(jù)類型:Object (Function,Array,Date,RegExp)。
對(duì)于基本類型,值都是直接賦值到變量中的;而對(duì)于引用類型,變量的值都是通過(guò)指針指向內(nèi)存中的對(duì)象,同一個(gè)對(duì)象可能會(huì)有多個(gè)變量同時(shí)指向自身,當(dāng)其中某個(gè)變量修改對(duì)象中的值時(shí)候,其他引用此對(duì)象的變量中的值也會(huì)相應(yīng)得改變。
我們來(lái)看點(diǎn)代碼示例:
var a = 5;
var b = 5;
a = 6;
console.log(b); // 這里的答案是5;因?yàn)閍和b都是賦值為基本數(shù)據(jù)類型Number
var a = {};
var b = a;
b.addsth = something;
console.log(a.addsth);// 這里會(huì)發(fā)現(xiàn)a中也有了addsth屬性。因?yàn)閍和b都是對(duì)對(duì)象{}的引用。
var arr = [1, 2, 3];
var testarr = arr;
arr.push(4);
console.log(arr == testarr) // true,因?yàn)閮烧叨际侵赶騕1, 2, 3]這個(gè)數(shù)組對(duì)象。arr改變了原始引用對(duì)象值,導(dǎo)致testarr值也相應(yīng)改變
var arr = [1, 2, 3];
var testarr = arr;
arr = [3, 3, 4];
console.log(testarr) // [1, 2, 3]
// 因?yàn)閮烧弑緛?lái)都是指向同一個(gè)數(shù)組對(duì)象,但后來(lái)arr的指向改變了,testarr并沒有。
作用域
在es6之前,js中只有兩種作用域,那就是全局作用域以及函數(shù)作用域,雖然如此,但使用要格外注意。
var a = '我是全局變量';
function abc () {
var a = '我是局部變量';
console.log(a) // 如方法abc調(diào)用,則答案是'我是局部變量'
}
console.log(a) // 答案是'我是全局變量';
if (true) {
var a = '我是新值'
}
console.log(a) // 答案是'我是新值';
但是在es6中,增加了塊級(jí)作用域,并有了新的定義變量關(guān)鍵詞‘let’;這樣一來(lái),上面代碼修改后運(yùn)行結(jié)果會(huì)有一點(diǎn)區(qū)別。
let a = '我是全局變量'
function abc () {
let a = '我是局部變量';
console.log(a) // 如方法abc調(diào)用,則答案是'我是局部變量'
}
console.log(a) // 答案是'我是全局變量';
if (true) {
let a = '我是新值';
console.log(a) // 答案是'我是新值'
}
console.log(a) // 答案是'我是全局變量';
下面的代碼中,由于沒有在函數(shù)中聲明變量作用域,導(dǎo)致函數(shù)執(zhí)行后,變量變成了全局作用域下的值
var a = 1;
function abc () {
a = 2
}
console.log(a); // 1
abc();
console.log(a); // 2
// 全局作用域下的a被函數(shù)中的變量修改了。
上下文
我們可以用this來(lái)訪問(wèn)上下文,this主要指向你代碼所處的執(zhí)行環(huán)境
var a = 123; // 全局變量a值是123
function change (x) {
this.a = x
}
change(222);
console.log(a); // a的值被修改為222
var obj = {
a: 10
}
obj.change = change
obj.change(20); // obj中a的值被修改為20,因?yàn)榇藭r(shí)obj的change方法中的this,指向的是obj
說(shuō)到改變this指向的方法,不得不說(shuō)一下call(),和apply()兩個(gè)方法:apply的參數(shù)是數(shù)組形式,call的參數(shù)是單個(gè)的值,除此之外在使用上沒有差別,重點(diǎn)
理解這兩個(gè)函數(shù)調(diào)用的 this 改變
function changeColor (color){
var this.style.color = color;
};
// 在window對(duì)象上調(diào)用的時(shí)候無(wú)法運(yùn)行,因?yàn)閣indow對(duì)象沒有style屬性
// 比如現(xiàn)在有個(gè)div
var div = document.getElementById('mydiv');
changeColor.call(div, 'black');
changecolor.apply(div,['black'])
閉包
閉包是一種手段:有權(quán)訪問(wèn)另一個(gè)函數(shù)作用域內(nèi)變量的函數(shù)都是閉包。至少我是這么理解的~~
這里簡(jiǎn)單介紹一下,后面會(huì)有專門的學(xué)習(xí)。
function abc (){
var a = 123;
function cc () {
console.log(a);
}
return cc;
}
var myfun = abc();
myfun(); // 答案123