/* 第一种定义类的方法 */
var cls = new Object();
cls.name = "wyf";
cls.showName = function(){
console.log(this.name);
}
cls.showName();

/* 第二种定义类的方式 */
function MyCls(){
var instance = new Object();
instance.name = "wyf";
instance.showName = function(){
console.log(this.name);
}
return instance;
}
var cls = new MyCls();
cls.showName();

/* 第三种定义类的方式,构造函数方式 */
function Cls(name){
this.name = name;
this.showName = function(){
console.log(this.name);
}
}
var cls = new Cls("wyf");
cls.showName();
var cls1 = new Cls("zz");
cls1.showName();
//此种方式和前两种方式有共同的缺点就是 每个对象都会生成showName方法,造成了内存的浪费 。

/* 第四种定义类的方法,原型方法 */
function Cls(){}
Cls.prototype.name = "wyf";
Cls.prototype.showName = function(){
console.log(this.name);
}
var cls = new Cls();
cls.showName();
//此种方法的缺点是,每个对象都指向了内存中同一个属性的地址,修改一个对象的属性值,其它对象的同一个属性的属性值都会变化。

/* 第五种创建类的方法:结合构造函数和原型方法 */
function Cls(name){
this.name = name;
}
Cls.prototype.showName = function(){
console.log(this.name);
}

var cls = new Cls("wyf");
cls.showName();
var cls1 = new Cls("zz");
cls1.showName();
cls.name = "dd";
cls.showName();
cls1.showName();

/* 第六种创建类的方法:Object.create() */
var Cls = {
name:"wyf",
showName:function(){
console.log(this.name);
}
};

var cls = Object.create(Cls);
cls.showName();

var cls1 = Object.create(Cls);
cls1.name = "test";
cls1.showName();

cls.name = "aa";
cls.showName();
cls1.showName();
//此种方法不能实现私有属性和私有方法,实例对象之间也不能共享数据,对"类"的模拟不够全面。

/* 第七种创建类的方法:极简主义法 */
var Cls = {
age:20,//共有属性
createInstance:function(){
var cls = {};
var i = 0;//私有方法
cls.name = "wyf";
cls.showName = function(){
console.log(this.name + " " + i);
}
return cls;
}
}

var cls = Cls.createInstance();
cls.showName();
var cls1 = Cls.createInstance();
cls1.showName();
cls.name = "dd";
cls.showName();
cls1.showName();
//此种方式容易理解,结构清晰。其实此种方式和第二种方式一样。在每个对象内部都生成了一个showName方法。

转自:https://www.cnblogs.com/wyf-gis/p/4551719.html

Javascript创建类的七种方法的更多相关文章

  1. javascript创建类的6种方式

    javascript创建类的7种方式 一 使用字面量创建 1.1 示例 var obj={}; 1.2 使用场景 比较适用于临时构建一个对象,且不关注该对象的类型,只用于临时封装一次数据,且不适合代码 ...

  2. [转]Javascript定义类的三种方法

    作者: 阮一峰 原文地址:http://www.ruanyifeng.com/blog/2012/07/three_ways_to_define_a_javascript_class.html 将近2 ...

  3. Javascript使用function创建类的两种方法

    1.使用function类 //myFunction.js var CMyFunc=function() { //类的公共方法,供外部调用 this.Func1=function() { var i= ...

  4. JavaScript创建类的三种方式

    //第一种 创建类方法. // 用方法模拟 构造函数. function classobj() { this.name = 'xiaoming'; } classobj.text = 'text'; ...

  5. [转] 用javascript修改css伪类的几种方法

    用javascript修改css伪类的几种方法: Modify pseudo element styles with JavaScript http://pankajparashar.com/post ...

  6. Javascript创建类和对象

    现总结一下Javascript创建类和对象的几种方法: 1.原始的创建方法: <script type="text/javascript"> var person = ...

  7. MFC控件编程之 按钮编辑框.静态文本的使用,以及访问控件的七种方法.

    MFC控件编程之 按钮编辑框.静态文本的使用以及访问控件的七种方法. 一丶按钮.静态文本的通用属性. 他们都有一个属性.就是可以输入标题内容.以及可以自定义控件ID. 创建一个MFC Dlg对话框. ...

  8. Javascript刷新页面的几种方法:

    Javascript刷新页面的几种方法: 1    history.go(0) 2    window.location.reload() window.location.reload(true)  ...

  9. java创建线程的三种方法

    这里不会贴代码,只是将创建线程的三种方法做个笼统的介绍,再根据源码添加上自己的分析. 通过三种方法可以创建java线程: 1.继承Thread类. 2.实现Runnable接口. 3.实现Callab ...

随机推荐

  1. wordpress如何屏蔽wp-json(禁用REST API)

    最近网友问ytkah怎么在网站日志文件中发现蜘蛛爬行了很多次的/wp-json/目录,在robots文件中disallow掉了爬虫还是访问了那个目录,能不能直接在程序中直接改呢?通过查询相关文档发现W ...

  2. UE4程序及资源加密保护方案

    UnrealEngine4外壳加密 . Virbox Protector 解决代码反汇编和反dump代码,解决软件盗版与算法抄袭. 虚幻引擎4是由游戏开发者为开发游戏而制作的.完整的游戏开发工具套件. ...

  3. [Java in NetBeans] Lesson 11. While Loops

    这个课程的参考视频和图片来自youtube. 主要学到的知识点有:(the same use in C/C++) 1. while loop while(i < max){} will keep ...

  4. [LeetCode] 661. Image Smoother_Easy

    Given a 2D integer matrix M representing the gray scale of an image, you need to design a smoother t ...

  5. 实验源码,DES,AES,RSA,椭圆曲线

    https://pan.baidu.com/s/1CPA-bnLmcJR_AFsNImhUjQ

  6. sqli-labs(五)——盲注(boolean盲注以及时间盲注)

    第八关: 没有查询信息,输入id=1' 报错 ,也没有报错信息,这里应该是个盲注 使用boolean的盲注吧 先判断boolean的盲注可行 输入id=1' and '1'='1' %23 页面正常 ...

  7. UVA 11168 Airport(凸包)

    Airport [题目链接]Airport [题目类型]凸包 &题解: 蓝书274页,要想到解析几何来降低复杂度,还用到点到直线的距离公式,之后向想到预处理x,y坐标之和,就可以O(1)查到距 ...

  8. ubuntu修改时区

    1.网上大部分解决办法是命令tzselect,然后选择亚洲-->中国->上海,但很遗憾,一点效果没有: 2.后找到解决办法,运行命令dpkg-reconfigure tzdata,选择As ...

  9. gedit emacs

    emacs常用操作: 1)C-g:退出当前命令 2)C-x C-f:搜索文件打开 3)C-s:向前搜索 C-r:向后搜索 4)C-x 2:水平分割窗口 C-x 3:竖直分割窗口 5)C-x o:切换窗 ...

  10. Visual Studio快捷键查询

    Ctrl+E,D —-格式化全部代码  Ctrl+E,F —-格式化选中的代码  CTRL + SHIFT + B生成解决方案  CTRL + F7 生成编译  CTRL + O 打开文件  CTRL ...