a=new b()和a=b(),其本質的區別在哪?

function a(b){

this.b=b

this.c=function(){

console.log(this.b)

}

}

d=new a("b")

d.c()

第二種

function a(){}

a.b="b"

a.c=function(){

console.log(this.b)

}

d=a

d.c()

a.b="bb"

d.c()

第二種方法,也可以做到參數可變,所以實在想不出第一種有什麼好處,更一般的,我們直接調用a,就像jq一樣,搞不懂的就是很多框架都需要new,還望賜教。


對比了題主寫的兩段代碼,似乎是問通過構造函數生成的對象和單例對象的區別(第二段代碼雖然是函數,但所有屬性都是掛載到函數上,然後調用函數的屬性和方法,其實就是把函數當成普通對象,只是把賦值的過程做了一層封裝)。

通過構造函數創建對象和直接創建對象都可以,通過構造函數更接近於面向對象編程的思維,而且更方便創建多個不同實例,然後共用原型上的方法。

而通常框架和庫其實基本都是構造函數,即使沒有顯示用 new 調用,比如 jquery,雖然是直接通過$() 就可以運行,但實際內部經過了實例化,貼一段源碼

jQuery = function( selector, context ) {

// The jQuery object is actually just the init constructor "enhanced"
// Need init if jQuery is called (just allow error to be thrown if not included)
return new jQuery.fn.init( selector, context );
}

而 jquery 屬於命令式編程,所以這樣的封裝更有利函數調用

當然像 vue 通過 new Vue(),創建一個 vue 實例,而每一個組件對應一個 vue 實例,除了根組件其它組件都是內部實例化,而 vue 屬於聲明式編程,這樣寫更接近語義。

再說一下 React,每個組件都是一個類,所以組件這樣寫

class App extends Component {
render() {
return (
&& );
}
}

組件內部實例化,當然,根組件的渲染是函數調用用,ReactDOM 是單例對象

所以構造函數是一種更通用的設計模式,框架和庫一般這樣寫,事實上寫業務代碼,更多的是單例對象,所以通常都是直接創建對象。


你給a添加原型屬性和方法看看,不new的時候能訪問到?

首先要知道new操作符到底幹嘛了:新建一個對象,給新對象添加原型屬性和方法,this指向,返回對象。

可以去看看函數是如何調用的以及js的一些知識,高級程序設計和權威指南都有介紹的,另外還有博客等等。


提問提錯了,a=b() 的意思是用 a 接收 b 方法調用後的返回值。


推薦閱讀:

使用markdown製作的html幻燈片有哪些?
node.js 已經淡出眾多開發者的視野了嗎?
如何評價 Node.js 8.0 ?

TAG:前端開發 | JavaScript | Nodejs | 前端工程師 | React |