javascript基礎學習(2017-07-12 )

為何想要開一個javascript文集呢,主要是自己的js基礎太差了,決定從0開始重新學習,用此系列博客記錄我自己的學習路程。


值和引用

在javascript中,我們有兩種方法來保存數據:值和引用。這里要提一下js的基本數據類型和引用類數據類型。

基本數據類型:Null,undefined,boolean,String,Number,以及es6新加的symbol(一但創建就不可修改)。

引用類數據類型:Object (Function,Array,Date,RegExp)。

對于基本類型,值都是直接賦值到變量中的;而對于引用類型,變量的值都是通過指針指向內存中的對象,同一個對象可能會有多個變量同時指向自身,當其中某個變量修改對象中的值時候,其他引用此對象的變量中的值也會相應得改變。

我們來看點代碼示例:

var a = 5;
var b = 5;
a = 6;
console.log(b); // 這里的答案是5;因為a和b都是賦值為基本數據類型Number

var a = {};
var b = a;
b.addsth = something;
console.log(a.addsth);// 這里會發現a中也有了addsth屬性。因為a和b都是對對象{}的引用。

var arr = [1, 2, 3];
var testarr = arr;
arr.push(4);
console.log(arr == testarr) // true,因為兩者都是指向[1, 2, 3]這個數組對象。arr改變了原始引用對象值,導致testarr值也相應改變

var arr = [1, 2, 3];
var testarr = arr;
arr = [3, 3, 4];
console.log(testarr) // [1, 2, 3]
// 因為兩者本來都是指向同一個數組對象,但后來arr的指向改變了,testarr并沒有。

作用域

在es6之前,js中只有兩種作用域,那就是全局作用域以及函數作用域,雖然如此,但使用要格外注意。

var a = '我是全局變量';
function abc () {
    var a = '我是局部變量';
    console.log(a) // 如方法abc調用,則答案是'我是局部變量'
}
console.log(a) // 答案是'我是全局變量';
if (true) {
    var a = '我是新值'
}
console.log(a) // 答案是'我是新值';

但是在es6中,增加了塊級作用域,并有了新的定義變量關鍵詞‘let’;這樣一來,上面代碼修改后運行結果會有一點區別。

let a = '我是全局變量'
function abc () {
    let a = '我是局部變量';
    console.log(a) // 如方法abc調用,則答案是'我是局部變量'
}
console.log(a) // 答案是'我是全局變量';
if (true) {
    let a = '我是新值';
    console.log(a) // 答案是'我是新值'
}
console.log(a) // 答案是'我是全局變量';

下面的代碼中,由于沒有在函數中聲明變量作用域,導致函數執行后,變量變成了全局作用域下的值

var a = 1;
function abc () {
    a = 2
}
console.log(a); // 1
abc();
console.log(a); // 2
// 全局作用域下的a被函數中的變量修改了。

上下文

我們可以用this來訪問上下文,this主要指向你代碼所處的執行環境

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,因為此時obj的change方法中的this,指向的是obj

說到改變this指向的方法,不得不說一下call(),和apply()兩個方法:apply的參數是數組形式,call的參數是單個的值,除此之外在使用上沒有差別,重點
理解這兩個函數調用的 this 改變

function changeColor (color){
    var this.style.color = color;
};
// 在window對象上調用的時候無法運行,因為window對象沒有style屬性
// 比如現在有個div
var div = document.getElementById('mydiv');
changeColor.call(div, 'black');
changecolor.apply(div,['black'])

閉包

閉包是一種手段:有權訪問另一個函數作用域內變量的函數都是閉包。至少我是這么理解的~~
這里簡單介紹一下,后面會有專門的學習。

function abc (){
    var a = 123;
    function cc () {
        console.log(a);
    }
    return cc;
}
var myfun = abc();
myfun(); // 答案123
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容