JS中多种方式创建对象详解

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);

以上这篇JS中多种方式创建对象详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

时间: 2016-03-21

js中创建对象的几种方式

前言 不管是哪门语言,千变万化不离其宗,深入理解其本质,方能应用自如.对应到js,闭包,原型,函数,对象等是需要花费大功夫思考.理解的.本文穿插了js原型和函数的相关知识,讨论了批量创建对象的几种方式以及它们的优缺点. 正文 说起创建对象,最容易想到的便是通过对象字面量方式直接定义一个对象吧,但这种方式只能创建少量,单独且相互间无联系的对象.若要批量创建对象,该如何? 工厂模式 工厂模式非常直观,将创建对象的过程抽象为一个函数,用函数封装以特定接口创建对象的细节.如下所示: function c

js创建对象几种方式的优缺点对比

比较js中创建对象的几种方式 1.工厂模式 function createObj(name, sex){ var obj = new Object(); obj.name = name; obj.sex = sex; obj.sayName = function(){ alert(this.name); } return obj; } var person = createObj('Tom', 'man'); 缺点:①无法确定对象的类型(因为都是Object). ②创建的多个对象之间没有关联.

JS对象创建的几种方式整理

最近一直在看JS高级程序设计这本书,有空来梳理一下几种创建对象的方式.话不多说,直接步入正题. 第一种:Object构造函数创建 var Person = new Object(); Person.name = 'Nike'; Person.age = 29; 这行代码创建了Object引用类型的一个新实例,然后把实例保存在变量Person中. 第二种:使用对象字面量表示法 var Person = {};//相当于var Person = new Object(); var Person =

js中创建对象的几种方式示例介绍

JavaScript中的所有事物都是对象:字符串.数组.数值.函数等.JS中并没有类的概念, 但我们可以利用JS的语法特征,以类的思想来创建对象. 原始方法 复制代码 代码如下: <script type="text/javascript"> var obj = new Object(); obj.name = "Koji"; //为对象添加属性 obj.age = 21; obj.showName = function(){ //为对象添加方法 ale

JavaScript创建对象的方式小结(4种方式)

本文实例总结了JavaScript创建对象的方式.分享给大家供大家参考,具体如下: 潜意识里,JavaScript不能算是面向对象的语言,要算也只能说是趋向面向对象的一种语言,至少它不能很好的吻合面向对象最基本的三大特性(继承.封装.多态),当然有很多人就认为JavaScript是面向对象语言,好像也说得没错,因为面向对象也能在JavaScript中实现,比如说继承.封装吧也都可以在JavaScript中实现,但是实现方便吗?所以我觉得很疑惑.看到网上有一网友评价的很好,"面向对象只是一种思想,

javascript创建对象、对象继承的实用方式详解

本文约定:不特殊声明的情况下,属性代指属性或方法. 创建对象.对象继承实际上是一回事:我们所需要的实例对象通过构造函数获得私有属性.通过原型链获得共享的属性.什么是好的方式?私有属性通过构造函数的方式获得(不考虑实例中自定义私有属性)且不需要重写,共享属性通过原型链找到且不需要重复创建. 普适的方式 组合使用构造函数模式和原型模式创建对象 function HNU_student(name) { this.name = name; this.sayName = function() { retu

js创建对象的方式总结

本文实例总结了js创建对象的方式.分享给大家供大家参考.具体如下: 复制代码 代码如下: <script type="text/javascript"> //1. 通过字面值来创建对象 var obj = {hobby:'篮球',girlf:'美女'}; document.write(obj.hobby + '和' + obj['girlf']); //2. 通过new Object方式来创建对象,Object为系统自带的构造函数 var obj2 = new Object

js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式)

在上篇文章给大家介绍了javascript面向对象基础,本篇文章继续深入学习javascript面向对象,JS的语法非常灵活,简单的对象创建就有好几种不同的方法.这些过于灵活的地方有时候确实很让人迷惑,那么今天我们就来梳理一下JS中常用的创建对象的几种方法吧. 前言 虽然使用 Object构造函数 或者使用 对象字面量 可以很方便的用来创建一个对象,但这种方式有一个明显的缺点:使用一个接口创建多个对象会产生很多冗余的代码.因此为了解决这个问题,人们开始使用以下几种方式来常见对象. 工厂模式 该模

学习javascript面向对象 掌握创建对象的9种方式

本文为大家分享了javascript创建对象的9种方式,供大家参考,具体内容如下 [1]使用Object构造函数 [缺点]使用同一个接口创建很多对象,会产生大量重复代码 var person = new Object(); person.name = "Nicholas"; person.age = 29; person.job = "Software Engineer"; person.sayName = function(){ alert(this.name);

js创建对象的几种常用方式小结(推荐)

第一种模式:工厂方式 复制代码 代码如下: var lev=function(){ return "我们"; }; function Parent(){ var Child = new Object(); Child.name="脚本"; Child.age="4"; Child.lev=lev; return Child; }; var x = Parent(); alert(x.name); alert(x.lev()); 说明: 1.在函数

vue动态绑定class的几种常用方式小结

本文实例讲述了vue动态绑定class的几种常用方式.分享给大家供大家参考,具体如下: 对象方法 最简单的绑定(这里的active加不加单引号都可以,以下也一样都能渲染) :class="{ 'active': isActive }" 判断是否绑定一个active :class="{'active':isActive==-1}" 或者 :class="{'active':isActive==index}" 绑定并判断多个 第一种(用逗号隔开) :

JS刷新父窗口的几种方式小结(推荐)

浮层内嵌iframe及frame集合窗口,刷新父页面的多种方法 <script language=JavaScript> parent.location.reload(); </script> <script language=JavaScript> parent.location.reload(); </script> 弹出子页面 <script language=JavaScript> window.opener.location.reloa

JS实现继承的几种常用方式示例

本文实例讲述了JS实现继承的几种常用方式.分享给大家供大家参考,具体如下: 1,原型链继承 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>原型链继承</title> </head> <body> <script> /** * 优点: * 实例是父类的实例也是子类的实例

浅谈js中的三种继承方式及其优缺点

第一种,prototype的方式: //父类 function person(){ this.hair = 'black'; this.eye = 'black'; this.skin = 'yellow'; this.view = function(){ return this.hair + ',' + this.eye + ',' + this.skin; } } //子类 function man(){ this.feature = ['beard','strong']; } man.pr

JS函数的几种定义方式分析

本文实例讲述了JS函数的几种定义方式.分享给大家供大家参考,具体如下: JS函数的定义方式比较灵活,它不同于其他的语言,每个函数都是作为一个对象被维护和运行的. 先看几种常用的定义方式: function func1([参数]){/*函数体*/} var func2=function([参数]){/*函数体*/}; var func3=function func4([参数]){/*函数体*/}; var func5=new Function(); 上述第一种方式是最常用的方式,不用多说. 第二种

详解js 创建对象的几种方法

在js中创建对象的方法可分为6种,分别是:基本模式.工厂模式.构造函数模式.原型模式.组合模式.动态原型模式,接下来分别看下这几种模式的写法吧 一.基本模式 var person = new Object(); person.name = "孙悟空"; person.weapon = "棒子"; person.run = function () { return this.name + "武器是" + person.weapon; } 二.工厂模

详解js创建对象的几种方法及继承

创建对象 通过Object构造函数或对象字面量创建单个对象 这些方式有明显的缺点:使用同一个接口创建很多对象,会产生大量的重复代码.为了解决这个问题,出现了工厂模式. 工厂模式 考虑在ES中无法创建类(ES6前),开发人员发明了一种函数,用函数来封装以特定接口创建对象的细节.(实现起来是在一个函数内创建好对象,然后把对象返回). function createPerson(name,age,job){ var o=new Object(); o.name=name; o.age=age; o.j

Python第三方库的几种安装方式(小结)

对于python开发用户而言,经常需要安装一些python的第三方库,但是第三方库的安装经常出错,以下给大家介绍一下python安装第三方库的几种常用方式: pip安装 无论是Windows.Linux还是Mac,都可以通过pip这个包管理工具来安装第三方库.最简单的安装方式就是: pip install requests pip默认是通过国外的源进行下载,速度太慢,且经常容易报错:因此推荐大家几个国内常用的安装源: 新版ubuntu要求使用https源,要注意. 清华:https://pypi

git pull时冲突的几种解决方式(小结)

仅结合本人使用场景,方法可能不是最优的 1. 忽略本地修改,强制拉取远程到本地 主要是项目中的文档目录,看的时候可能多了些标注,现在远程文档更新,本地的版本已无用,可以强拉 git fetch --all git reset --hard origin/dev git pull 关于commit和pull的先后顺序,commit-->pull-->push 和 pull-->commit-->push的顺序,两种情况都遇到过代码冲突.解决方法如下: 2. 未commit先pull,