javascript一些比較難理解的知識點

原文出處：http://www.javashuo.com/article/p-rxdsbktm-h.html

看了一下這篇文章，本身也手敲了一遍

    //一、 當即執行函數   做用：將var變量的做用域限制於函數內，這樣能夠避免命名衝突。注意：避免報錯 在開頭加分號

    ;
    (function() {
        console.log("一、當即執行函數")
    })()

    //二、閉包   
    ;
    (function() {
        console.group("二、閉包")

        function f1() {
            var n = 0

            function f2() {
                n++
                console.log("n=" + n)
            }
            return f2
        }
        var result = f1()

        try {
            console.log(n) //undefind 
        } catch(e) {
            //            console.log(e)
        }

        result() //輸出1
        result() //輸出2
        result() //輸出3
        console.groupEnd()
    })()

    //三、使用閉包定義私有變量

    ;
    (function() {
        console.group("三、使用閉包定義私有變量")

        function Pronduct() {
            //            this.name = "mike";
            var name

            this.setName = function(v) {
                name = v
            }
            this.getName = function() {
                return name
            }
        }

        var k = new Pronduct()
        k.setName('amy')
        console.log(k.name) //undefined
        console.log(k.getName()) //輸出amy
        console.groupEnd()
    })()

    //四、prototype
    //每一個JavaScript構造函數都有一個prototype屬性，用於設置全部實例對象須要共享的屬性和方法。
    //prototype屬性不能列舉。JavaScript僅支持經過prototype屬性進行繼承屬性和方法。

    ;
    (function() {
        console.group("4.prototype")

        function Rectangle(x, y) {
            this._length = x;
            this._breadth = y;
        }
        Rectangle.prototype.getData = function() {
            return {
                length: this._length,
                breadth: this._breadth
            }
        }
        var x = new Rectangle(3, 4);
        var y = new Rectangle(5, 8);
        console.log(x.getData()) //輸出{length:3,breadth:4}
        console.log(y.getData()) //輸出{length:5,breadth:8}
        console.groupEnd()
    })()

    //五、模塊化
    ;
    (function() {
        console.group("5.模塊化")
        var module = (function() {
            var N = 5;

            function print(x) {
                console.log("The result is:" + x)
            }

            function add(a) {
                var x = a + N;
                print(x)
            }
            return {
                description: "This is descriptione",
                add: add
            }
        })()

        console.log(module.description) //輸出 "This is descriptione"
        module.add(5) //輸出 The result is：10
        console.groupEnd()
    })()

    //6.變量提高

    //JavaScript會將全部變量和函數聲明移動到它的做用域的最前面，這就是所謂的變量提高(Hoisting)。
    //也就是說，不管你在什麼地方聲明變量和函數，
    //解釋器都會將它們移動到做用域的最前面。所以咱們能夠先使用變量和函數，然後聲明它們。

    //七、柯里華
    //柯里化，即Currying，能夠是函數變得更加靈活。咱們能夠一次性傳入多個參數調用它；
    //也能夠只傳入一部分參數來調用它，讓它返回一個函數去處理剩下的參數。
    ;
    (function() {
        console.group('7.柯里華')
        var add = function(x) {
            return function(y) {
                return x + y;
            }
        }
        console.log(add(1)(1)) //輸出2
        var add1 = add(1)
        console.log(add1(2)) //輸出3
        var add10 = add(10)
        console.log(add10(2)) //輸出12
        console.groupEnd()
    })()

    //8.apply,call與bind方法
    //call  指定this值調用函數
    ;
    (function() {
        console.group('8.apply,call與bind方法')
        var user = {
            name: "mike",
            whatIsYourName: function() {
                console.log(this.name)
            }

        }
        console.group("call")
        user.whatIsYourName() //輸出 mike

        var user2 = {
            name: "amy"
        }
        user.whatIsYourName.call(user2) //輸出amy
        console.groupEnd()

        //apply apply方法與call方法相似。二者惟一的不一樣點在於，apply方法使用數組指定參數，而call方法單獨指定：
        ;
        (function() {
            console.group('apply')
            var user = {
                greet: "hello",
                greetUser: function(userName, name) {
                    console.log(this.greet + " " + userName + ' ' + name)
                }
            }
            var user2 = {
                greet: "hey"
            }

            user.greetUser.call(user2, 'mike', "ak") //輸出 hey mike ak
            user.greetUser.apply(user2, ['amy', "ak"]) //輸出 hey amy ak
            console.groupEnd()
        })()
        //bind 
        ;
        (function() {
            console.group('bind')
            var user = {
                greet: "Hello!",
                greetUser: function(userName) {
                    console.log(this.greet + " " + userName);
                }
            };

            var greetHola = user.greetUser.bind({
                greet: "Hola"
            });
            var greetBonjour = user.greetUser.bind({
                greet: "Bonjour"
            });

            greetHola("Rahul") // 輸出"Hola Rahul"
            greetBonjour("Rahul") // 輸出"Bonjour Rahul"
            user.greetUser('mike')
            console.groupEnd()
        })()

    })()