JS中多種方式創建對象

来源:http://www.cnblogs.com/haoxl/archive/2016/03/07/5250245.html
-Advertisement-
Play Games

1.內置對象創建 var girl=new Object(); girl.name='hxl'; console.log(typeof girl); 2.工廠模式,寄生構造函數模式 function Person(name){ var p=new Object();//內部進行實例化 p.name=


1.內置對象創建

var girl=new Object();
    girl.name='hxl';
    console.log(typeof girl);

2.工廠模式,寄生構造函數模式

function Person(name){
        var p=new Object();//內部進行實例化
        p.name=name;
        p.say=function(){
            console.log('my name is '+ p.name);
        }
        return p;//註:一定要返回
}
var girl=Person('haoxioli');
girl.say();

3.構造函數創建

var Product=function(name){
        this.name=name;
        this.buy=function(){
            console.log('我衣服的牌子是'+this.name);
        }
}
    var pro=new Product('真維斯');
    pro.buy();

4.原型創建,缺點:實例中的每個屬性有可能會不一樣

var Role=function(){}
    Role.prototype.name={nickName:'昵稱'};
    var boy=new Role();
    boy.name.nickName='劉曉兵';
    console.log(boy.name.nickName);//劉曉兵
    var girl=new Role();
    girl.name.nickName='郝曉利';
    console.log(boy.name.nickName);//郝曉利,因為實例對象可以修改原型中的引用對象的值
    console.log(girl.name.nickName);//郝曉利

5.混合模式:原型+構造,可以把不讓實例修改的屬性放到構造函數中,可以修改的放原型中

var Role=function(){
        this.name={nickName:'aaa'};
    }
    Role.prototype.age=30;
    var boy=new Role();
    boy.name.nickName='boy';
    console.log(boy.name.nickName);//boy
    var girl=new Role();
    girl.name.nickName='girl';
    console.log(boy.name.nickName);//boy,實例不會修改構造函數中的值
    console.log(girl.name.nickName);//girl

6.字面量形式

var cat={
        name:'lucy',
        age:3,
        sex:'母'
    };//將對象轉換成字元串
    console.log(JSON.stringify(cat));//{"name":"lucy","age":3,"sex":"母"}
    var dog='{"name":"john","sex":"公"}';
    console.log(JSON.parse(dog).name);//將字元串轉為對象

7.拷貝模式

function extend(tar,source){
        for(var i in source){
            tar[i]=source[i];
        }
        return tar;
    }
    var boy={name:'醉俠客',age:20};
    var person=extend({},boy);
    console.log(person.name);

8.第三方框架

//先引入包
<script src='js/base2.js'></script>
//base2框架,Base.extend及constructor都是固定用法
    var Animal=Base.extend({
        constructor:function(name){
            this.name=name;
        },
        say:function(meg){
            console.log(this.name+":"+meg);
        }
    });
    new Animal('lily').say('fish');

另一個第三方框架

<script src='js/simplejavascriptinheritance.js'></script>
//simplejavascriptinheritance框架,Class.extend及init都是固定用法
    var Person=Class.extend({
       init:function(name){
           this.name=name;
       }
    });
    var p=new Person();
    p.name='over';
    console.log(p.name);

  

  

  


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 效果預覽:http://hovertree.com/code/run/css/x8l6si70.html 請實用Chrome瀏覽器查看效果,手機上也可以. 代碼如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont
  • Node.js寫文件的三種方式: 1、通過管道流寫文件 採用管道傳輸二進位流,可以實現自動管理流,可寫流不必當心可讀流流的過快而崩潰,適合大小文件傳輸(推薦) 2 var readStream = fs.createReadStream(decodeURIComponent(root + filep
  • 原文出處: 攜程設計委員會 現在手機的占比越來越高,各種酷炫頁面層出不窮,這些特效都離不開css動畫。說到css動畫,主流的情況也就無非這兩大類:位移和形變。而我們在寫一個動畫特效的過程中,如何去提升它的性能呢?當然首先我們需要去瞭解一下基本的概念,比如瀏覽器渲染的工作原理等,這些我也在讀了幾位大牛
  • 看到這樣一個問題:為什麼直接在控制台運行{} + []和用console.log({} + [])輸出,兩者結果不一樣? 於是乎打開chrome的控制台運行了一下: 為什麼結果會這樣呢?不得已學習一下JS中的{}吧 複合語句 1 if() { 2 //... 3 }else { 4 //... 5
  • 除了慣例的面對對象的思想,另一種較流行的通過可復用組件創建類的方法是將簡單的類混合到一起。你可能對這種混合的方式比較熟悉或對Scala語言的特性有理解,這種模式在JavaScript社區也有一定的人氣。 混合案例 在下麵的代碼中,我們展示瞭如何在TypeScript中混合模型,看完代碼之後,再分析它
  • 關於JavaScipt對象的基本知識 JavaScript是運用“對象化編程”的,又叫“面向對象編程”的。所謂“對象化編程”,意義是把JavaScript能涉及的領域劃分成各種對象,對象後面還連續劃分對象直至很是詳細為止,整個的編程都以對象為出發點,基於對象。何謂對象,小到一個變數,大到網頁文檔、窗
  • 一個成熟的框架,日期控制是少不了的,在網上也有很多日期控制可以選擇,而主框架用了bootstrap,日期控制也當前要用它自己的, 控制項地址:http://www.bootcss.com/p/bootstrap-datetimepicker/index.htm GitHub上開源地址:https://
  • 有一個功能需要判斷返回頂部按鈕是否顯示。 JS代碼如下: var sTop = document.body.scrollTop; if(sTop>100){ document.getElementById("sm_top").style.display="block"; }else{ documen
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...