完美世界辰东,yy玄幻小说排行榜完本,盗墓笔记小说txt下载

javascript中的面向?qū)ο?/h1>

2024-05-06 15:19:10

字體：大中小

供稿：網(wǎng)友

相信大家對(duì)javascript中的面向?qū)ο髮?xiě)法都不陌生，那還記得有幾種創(chuàng)建對(duì)象的寫(xiě)法嗎？相信大家除了自己常寫(xiě)的都有點(diǎn)模糊了，那接下來(lái)就由我來(lái)幫大家回憶回憶吧！

1. 構(gòu)造函數(shù)模式

通過(guò)創(chuàng)建自定義的構(gòu)造函數(shù)，來(lái)定義自定義對(duì)象類(lèi)型的屬性和方法。

function cons(name,age){ this.name = name; this.age = age; this.getMes = function(){  console.log(`my name is ${this.name},this year ${this.age}`); }}var mesge = new cons('will',21);mesge.getMes();

2. 工廠模式

該模式抽象了創(chuàng)建具體對(duì)象的過(guò)程，用函數(shù)來(lái)封裝以特定接口創(chuàng)建對(duì)象的細(xì)節(jié)

function cons(name,age){ var obj = new Object(); obj.name = name; obj.age = age; obj.getMes = function(){  console.log(`my name is ${this.name},this year ${this.age}`); } return obj;}var mesge = cons('will',21);mesge.getMes();

3. 字面量模式

字面量可以用來(lái)創(chuàng)建單個(gè)對(duì)象，但如果要?jiǎng)?chuàng)建多個(gè)對(duì)象，會(huì)產(chǎn)生大量的重復(fù)代碼

var cons = { name: 'will', age : 21, getMes: function(){  console.log(`my name is ${this.name},this year ${this.age}`); }}cons.getMes();

4. 原型模式

使用原型對(duì)象，可以讓所有實(shí)例共享它的屬性和方法

function cons(){ cons.prototype.name = "will"; cons.prototype.age = 21; cons.prototype.getMes = function(){  console.log(`my name is ${this.name},this year ${this.age}`); }}var mesge = new cons();mesge.getMes();var mesge1 = new cons();mesge1.getMes();console.log(mesge.sayName == mesge1.sayName);//true

5. 組合模式

最常見(jiàn)的方式。構(gòu)造函數(shù)模式用于定義實(shí)例屬性，而原型模式用于定義方法和共享的屬性，這種組合模式還支持向構(gòu)造函數(shù)傳遞參數(shù)。實(shí)例對(duì)象都有自己的一份實(shí)例屬性的副本，同時(shí)又共享對(duì)方法的引用，最大限度地節(jié)省了內(nèi)存。該模式是目前使用最廣泛、認(rèn)同度最高的一種創(chuàng)建自定義對(duì)象的模式

function cons(name,age){ this.name = name; this.age = age; this.friends = ["arr","all"];}cons.prototype = { getMes : function(){  console.log(`my name is ${this.name},this year ${this.age}`); }}var mesge = new cons("will",21);var mesge1 = new cons("jalo",21);console.log(mesge.friends);mesge.friends.push('wc'); //還可以操作數(shù)組哈O(∩_∩)O！console.log(mesge.friends);console.log(mesge1.friends);mesge.getMes();mesge1.getMes();console.log(mesge.friends === mesge1.friends);console.log(mesge.sayName === mesge1.sayName);

最后在告訴你個(gè)秘密，ES6引入了類(lèi)（Class），讓對(duì)象的創(chuàng)建、繼承更加直觀了

// 定義類(lèi)class Cons{ constructor(name,age){  this.name = name;  this.age = age; } getMes(){  console.log(`hello ${this.name} !`); }}let mesge = new Cons('啦啦啦~',21);mesge.getMes();

上一篇：JS+html5制作簡(jiǎn)單音樂(lè)播放器

下一篇：TypeScript入門(mén)-接口