1.工厂方式

<script type="text/javascript">

function createObject(name){

       var p = new Object();

       p.name=name;

       p.say = function(){alert(p.name+'ff');}

       return p;

}

var p1 = createObject("p1");

var p2 = createObject("p2");

alert(p1.name+" "+p2.name);

p1.say();p2.say();

alert(p1.say==p2.say); //false

</script>

问题:每创建一个对象,对象的方法是新对象,浪费资源

 
2、构造函数方式

<script type="text/javascript">

function Person(name){

this.name = name;

this.say = function(){

alert("I am "+this.name);

}

}

var p1 = new Person("wang");

var p2 = new Person("li");

p1.say();

p2.say();

alert(p1.say==p2.say); //false

 

</script>

 

问题:

创建对象时比工厂方法更易于理解。

和工厂方法一样,每个对象都有自己的方法,浪费资源。

 

 
3、原型方式

function Person(){}

Person.prototype.name = "";

Person.prototype.say = function(){

alert("I am "+this.name);

}

 

var p1 = new Person();

var p2 = new Person();

alert(p1.say == p2.say);//true

 

问题:无法在构造方法中传递参数,所有对象共享属性。

优点:对象共方法,节约资源。

 
4、构造方法+原型方式

function Person(name){

       this.name = name;

}

Person.prototype.say = function(){

       alert("I am "+this.name);

}

var p1 = new Person("wang");

var p2 = new Person("li");

p1.say();

p2.say();

alert(p1.say==p2.say); //true

 

优点:解决了前面提到的问题。

问题:封装不够完美。

 
5、动态原形方式

function Person(name){

this.name = name;

if(Person.prototype.say == undefined){

       Person.prototype.say = function(){

              alert("I am "+this.name);

              }

       }

}

var p1 = new Person("wang");

var p2 = new Person("li");

p1.say();

p2.say();

alert(p1.say==p2.say); //true

 

结论:一种完美的解决方案。

 
6、对象的创建 - JSON

var person = {};

 

var girl = {

name:“miss wang”,

age:20,

show = function(){

       alert("my name is " + this.name);

}

}

 

继承的实现方式

1、  对象冒充

 

function People(name){

this.name = name;

this.say = function(){

alert("I am "+this.name);

       }

}

function WhitePeople(name){

this.inherit = People;

this.inherit(name);

delete this.inherit;

 

this.color = function(){

              alert("I am white people.");

}

}

var p = new WhitePeople("wang");

p.say();

p.color();

alert(p instanceof People); //false

结论:支持多重继承,但后面的类可以覆盖前面类的属性和方法。继承后的对象类型和父类对象不匹配

 

2、利用call()和apply()冒充

function People(name,age){

this.name = name;

this.age = age;

this.say = function(){

alert("I am "+this.name+"  "+this.age);

       }

}

function WhitePeople(name,age){

//People.call(this,name,age);//call方式以多个参数进行传值

People.apply(this,[name,age]);//apply方式以数组方式进行传值

 

this.color = function(){

              alert("I am white people.");

}

}

var p = new WhitePeople("wang",34);

p.say();

 

p.color();

 

alert(p instanceof People);

 

 

3、原型链继承

//父类

function People(name){

       this.name = name;

}

People.prototype.say = function(){

       alert("I am "+this.name);

}

 

//子类

function ChinaPeople(name,area){

       People.call(this,name);

       this.area = area;

}

ChinaPeople.prototype = new People();

ChinaPeople.prototype.from = function(){

       alert("I'am from "+this.area);

}

 

var p = new ChinaPeople("wang","si chuan");

p.say();

p.from();

alert(p instanceof People); //true

结论:不支持多重继承,继承后的对象类型和父类对象匹配

js自定义对象和类的更多相关文章

  1. JS 自定义对象 属性

    js自定义对象 一,概述 在Java语言中,我们可以定义自己的类,并根据这些类创建对象来使用,在Javascript中,我们也可以定义自己的类,例如定义User类.Hashtable类等等. 目前在J ...

  2. js自定义对象.属性 笔记

    <一> js自定义对象 一,概述 在Java语言中,我们可以定义自己的类,并根据这些类创建对象来使用,在Javascript中,我们也可以定义自己的类,例如定义User类.Hashtabl ...

  3. js自定义对象

    一,概述 在Java语言中,我们可以定义自己的类,并根据这些类创建对象来使用,在Javascript中,我们也可以定义自己的类,例如定义User类.Hashtable类等等. 目前在Javascrip ...

  4. js自定义对象 (转)

    原文地址:https://sjolzy.cn/js-custom-object.html 29 March 2010 9:53 Monday by 小屋 javascript进阶之对象篇 一,概述 在 ...

  5. JS自定义对象以及相关成绩系统完整案例演示

    [自定义对象] 1.基本概念 ①对象是拥有一系列无无序属性和方法的集合 ②键值对:对象中的数据,用以键值对的形式存在,对象的每个属性和方法,都对应一个键值,以键取值 ③属性:描述对象特征的一系列变量称 ...

  6. JS自定义对象,正则表达式,JQuery中的一些知识点

    一:自定义对象 1.基本概念:①对象:包含一系列无序属性和方法的集合.②键值对:对象中的数据是以键值对的形式存在的,以键取值.③属性:描述对象特征的一系列变量.[对象中的变量]④方法:描述对象行为的一 ...

  7. Node.js自定义对象事件监听与发射

    一.Node.js是以事件驱动的,那我们自定义的一些js对象就需要能监听事件以及发射事件.在Node.js中事件使用一个EventEmitter对象发出,该对象在events模块中.它应该是使用观察者 ...

  8. JS 创建自定义对象的方式方法

    一.概述 还记得刚开始做项目的时候,看到别人封装的js工具类百思不得其解,看来看去看不懂,深挖一下,其实就是自己没有耐下心去看,但是遇到问题不解决,总会遇到的,今天还是遇到了,就去找了找帖子,重新思考 ...

  9. JavaScript---网络编程(4)-Date、Math、Global和自定义对象

    本节博客进行Date对象.Math对象.Global对象和自定义对象的用法演示. 首先是一个out.js文件内容(输出到网页中的自定义输出方法): function println(parma){ d ...

随机推荐

  1. 《修炼之道:.NET开发要点精讲》读书笔记(四)

    委托的作用:1)它允许把方法作为参数,传递给其它的模块:2)它允许我们同时调用多个具有相同签名的方法:3)它允许我们异步调用任何方法. “方法签名”指方法的参数个数.参数类型以及返回值等,具有相同签名 ...

  2. UE4的委托

    UE中委托的使用很广泛,许多Event的触发都有对应的虚函数和委托,虚函数不用讲,只能在派生类中使用,而委托可以在别的类或者蓝图中使用,就应用范围而言,委托的使用更灵活.以AActor的 /** * ...

  3. Qt自定义滚动条(不使用样式表)

    前面使用Qt 样式表实现滚动条,在实际工作中,发现存在一些瑕疵,例如如果在主窗口中绘制背景,则有可能给滚动条染色,还有如果想实现特殊的效果,则必须使用自定义风格,即从QStyle的子类派生出新的类型. ...

  4. PM学习梳理--原型设计

  5. 对Java单例设计模式中懒汉式类定义的讨论

    全世界人民都知道单例设计模式中类的定义分为懒汉式和饿汉式两种,然而今天并不是要把它们做横向比较.实际上,不论饿汉式类的代码看起来有多么美轮美奂,在实际开发中它的效率总是不如懒汉式的.然而在笔试和面试中 ...

  6. CODEFORCES ROUND #740 ANALYSES BY TEAM:RED & BLACK

    A.Alyona and copybooks Problems: 给你一个数n和代价分别为a, b, c.数量不限的1, 2, 3,求将n凑成4的倍数的最小代价 Analysis: cj:取个模随便凑 ...

  7. 别人的Linux私房菜(16)计划任务

    计划任务的种类: at,执行一次就结束的命令    crontab,用户任务循环执行的任务的命令.系统任务编辑/etc/crontab来完成. atd让at生效.crond或cron让crontab生 ...

  8. Qt打包发布exe

    1.首先以 release 方式编译源代码,然后将生成的a. exe 程序放到一个单独的文件夹中. 2.再从开始菜单打开 Qt 命令行工具. 3.在命令行中,进入到第一步中a. exe 程序所在的文件 ...

  9. metasploit生成payload的格式

    转自https://www.cnblogs.com/zlgxzswjy/p/6881904.html Often one of the most useful (and to the beginner ...

  10. Unity3D编辑器扩展(五)——常用特性(Attribute)以及Selection类

    前面写了四篇关于编辑器的: Unity3D编辑器扩展(一)——定义自己的菜单按钮 Unity3D编辑器扩展(二)——定义自己的窗口 Unity3D编辑器扩展(三)——使用GUI绘制窗口 Unity3D ...