JavaScript與傳統(tǒng)靜態(tài)語言比較幾點奇葩的地方

1. 變量不用var聲明就能使用，如果變量未賦值默認為undefined，仍然建議使用var聲明，而且更符合未來ES6標準，主要瀏覽器已經(jīng)支持眾多ES6新特性
2. 可直接給對象添加屬性和方法
3. 函數(shù)的參數(shù)類型可以省略
4. javascript默認沒有函數(shù)重載，當然可以通過一些方式實現(xiàn)，感興趣可查相關(guān)資料

1. 通過本地對象直接創(chuàng)建對象

p1=new Object();// 沒有參數(shù)()都可省 person=new Object
p1.firstname="Bill";
p1.lastname="Gates";
p1.age=56;
p1.eyecolor="blue";
p1.showColor=function () {
    console.log(this.eyecolor);
}
console.log(p1); //{firstname: "Bill", lastname: "Gates", age: 56, eyecolor: "blue", showColor: ?}
p1.showColor(); // blue

2. 通過字面量創(chuàng)建對象

p2={firstname:"Bill",lastname:"Gates",age:56,eyecolor:"blue"};

p2.showColor=function () {
    console.log(this.eyecolor)
};

console.log(p2); // {firstname: "Bill", lastname: "Gates", age: 56, eyecolor: "blue", showColor: ?}

p2.showColor(); // blue

本質(zhì)上是第一種方式

3. 工廠函數(shù)創(chuàng)建對象

function createPerson(firstname,lastname,age,eyecolor) {
    var p3=new Object();
    p3.firstname=firstname;
    p3.lastname=lastname;
    p3.age=age;
    p3.eyecolor=eyecolor;
    p3.showColor=function () {
        console.log(this.eyecolor);
    }
    return p3;
}
var p3_fact1=createPerson("Li","Lin",18,"black");

p3_fact1.showColor(); // black

創(chuàng)建對象都重新創(chuàng)建了showColor函數(shù),這種內(nèi)存開銷是沒必要的

4. 定義構(gòu)造函數(shù)，通過構(gòu)造函數(shù)創(chuàng)建對象

function Person(firstname,lastname,age,eyecolor)
{
    this.firstname=firstname;
    this.lastname=lastname;
    this.age=age;
    this.eyecolor=eyecolor;
    this.showColor = function() {
        alert(this.eyecolor);
    };
}

構(gòu)造函數(shù)會重復(fù)生成函數(shù)，為每個對象都創(chuàng)建獨立的函數(shù)版本。與工廠方式差別不大

5. 原型方式創(chuàng)建對象

function Person(){}
Person.prototype.firstname="Bill";
Person.prototype.lastname="Gates";
Person.prototype.age=56;
Person.prototype.color="blue";
Person.prototype.showColor=function () {
    alert(this.color)
}

原型方式的問題:解決了多份函數(shù)對象的問題，引入的問題是不能通過構(gòu)造函數(shù)傳入?yún)?shù)并且原型上的屬性和方法全部會被所有對象共享。

我舉個例子說明：

function Car(){}
Car.prototype.color="blue";
Car.prototype.doors=4;
Car.prototype.drivers=new Array("jack","David");
Car.prototype.showColor=function () {
    alert(this.color);
}
var car1=new Car();
car1.drivers.push("Lily");
var car2=new Car();

console.log(car1.drivers); //["jack", "David", "Lily"]
console.log(car2.drivers); //["jack", "David", "Lily"]

我們預(yù)期的結(jié)果是只給car1加個司機,卻被car2共享了

6. 混合構(gòu)造函數(shù)和原型方式創(chuàng)建對象

function Car(color,doors){
    this.color=color;
    this.doors=doors;
    this.drivers=new Array("jack", "David");
}

Car.prototype.showColor=function () {
    console.log(this.color);
}

var car1=new Car("red",4);
car1.drivers.push("Bruce");
var car2=new Car("blue",5);
console.log(car1.drivers); //["jack", "David", "Bruce"]
console.log(car2.drivers); //["jack", "David"]

這種方式結(jié)合了混合構(gòu)造函數(shù)的和原型方式的優(yōu)點。沒副作用，要說唯一不完美的地方就是不符合傳統(tǒng)面向?qū)ο蟮姆庋b性

7 動態(tài)原型方法

function Car(sColor,iDoors) {
    this.color = sColor;
    this.doors = iDoors;
    this.drivers = new Array("Mike","John");
    if (typeof Car._initialized == "undefined") {
        Car.prototype.showColor = function() {
            alert(this.color);
        };
        Car._initialized = true;
    }
}
var car1=new Car("red",4);
var car2=new Car("blue",5);
console.log(car1.drivers); //["jack", "David"]
console.log(car2.drivers); //["jack", "David"]
car1.showColor(); //red
car2.showColor(); //blue

本質(zhì)上就是混合構(gòu)造函數(shù)和原型方式。優(yōu)點是很符合傳統(tǒng)語言的封裝性，而且原型方法只會被添加一次

怎么樣簡單吧，如果有點幫助，幫忙點個贊O(∩_∩)O謝謝！