javascript中创建对象的几种不同方法

方法一:最直白的方式:字面量模式创建

 <script>
var person={
name:"小明",
age:20,
sex:"男",
hobby:function(){
console.log("打篮球");
}
};
</script>

这种方法代码量多,用于“一开始就确定好内部数据类型的”对象创建。

方法二:调用系统构造函数创建

 <script>
var per=new Object();
per={};
per.name="小明";
per.age="20";
per.hobby=function(){
console.log("打篮球");
};
</script>

这种方法可以先调用Object来创建一个空的对象,然后动态地在后面添加对象需要的属性,但是代码量也很多。当创建一个跟它相似的对象时可能会重复使用到添加属性的代码语句,不够简洁。

方法三:工厂模式创建

 <script>
function createPerson(name,age){
var p=new Object();
p.name=name;
p.age=age;
p.hobby=function(){
console.log("打篮球");
};
}
var person1=createPerson("小明","20");
var person2=createPerson("小米","18");
</script>

这种方法可以解决方法二的问题,即要创建多个相似的对象时只需要调用多次函数就好,但是工厂模式创建对象无法识别对象的类型,它们都是Object()构造函数创建,都是Object类型(所有的对象都是Object的后代),不像其他方法Array()、Date()等.

方法四:自定义构造函数创建

构造函数就是一个普通的函数,创建方式和普通函数没有区别,不同的是构造函数习惯上首字母大写。另外就是调用方式的不同,普通函数是直接调用,而构造函数需要使用new关键字来调用。

 <script>
function Person("name","age"){
this.name=name;
this.age=age;
this.hobby=function(){
console.log("打篮球");
};
}
var person1=new Person("小明","20");
var person2=new Person("小米","18");
</script>

这种方法与工厂模式创建有几个不同点:1.函数名Person是大写,而工厂模式的函数creatPerson是小写(习惯上这样用而已);2.该方法没有return语句,而工厂函数创建有return;3.该方法直接将属性和方法赋值给了this对象,而工厂模式没有出现this对象;4.该方法通过new操作符来实例化一个对象,而工厂模式实例化对象直接调用函数即可。

要创建Person的新实例,必须使用new操作符。用这种方式调用构造函数实际上会经历以下四个步骤:

1.创建一个新对象;2.将构造函数的作用域赋给新对象(因此this就指向了这个新对象);3.为这个新对象添加属性;4.返回新对象。

这种方法虽然好用,但也不是没有问题。例如当你需要创建100个Person,这100个对象都是单独的个体,它们之间的私有属性是不相等的,当创建100个这样的对象时,加入一个对象中有一个方法,那创建100个对象就要创建100个方法,但是这些方法都是一样的功能,就没有这个必要去浪费内存空间。所以开始就有了下面的方法五了。

方法五:原型模式创建对象

原型模式有一个强大的功能就是可以实现数据共享,从而节省空间,比如上面的100个对象有100个功能一样的方法,那我完全可以让这100个对象共用一个方法。

 <script>
function Person(name,age)
{
this.name=name;
this.age=age;
}
Person.prototype.eat=function()
{
console.log("吃东西");
}
var p1=new Person("小米",30);
var p2=new Person("小明",20);
</script>

如上需要共享的数据就可以写在原型对象(prototype)中,不需要共享的数据写在构造函数Person中,

以后用new Person创建的每一个对象,都可以享用到prototype里面的属性和方法,而构造函数Person里的属性和方法则根据创建对象时传入的参数不同来决定。

   <script>
2 function Student(name,age,sex){
3 this.name=name;
4 this.age=age;
5 this.sex=sex;
6 }
7 Student.prototype={
8 constructor:Student,
9 height:"180",
10 weight:"55kg",
11 study:function(){
12 console.log("学习好开心");
13 },
14 eat:function(){
15 console.log("好好吃");
16 }
17 };
18 var stu=new Student("张飞",20,"男");
19 stu.eat();//好好吃
20 stu.study();//学习好开心
21 </script>

关于构造函数、原型对象、实例对象的指向关系,表述如下:

构造函数可以实例化对象;
构造函数中有一个属性叫prototype,是构造函数的原型对象;
构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数;
实例对象的隐含属性(__proto__)指向的是该构造函数创造的原型对象;

以上资料,部分参考自《javaScript高级语言程序设计(第三版)》,如有错误,并无误导之意,请前辈不吝指出!感谢!

javascript中创建对象的几种不同方法的更多相关文章

  1. JavaScript中创建对象的三种方式!

    JavaScript中创建对象的三种方式! 第一种 利用对象字面量! // 创建对象的三种方式! // 1 对象字面量. var obj = { // 对象的属性和方法! name: 'lvhang' ...

  2. JavaScript中创建对象的三种模式

    JS中,便于批量创建对象的三种模式: 1.工厂模式:用一个函数封装创建对象的细节,传入必要的参数,在函数内部new一个对象并返回. 缺点:创建的对象无法识别类型(全是Object) 2.构造函数模式: ...

  3. JavaScript中创建对象的几种模式

    代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  4. javascript中创建对象的几种方式

    1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的值. var person = new Object(); person.name=&q ...

  5. JavaScript中创建对象的5种模式

    构造函数模式 实现方式: function Person(name, age, job) { this.name = name; this.age = age; this.job = job; thi ...

  6. 深入理解JavaScript中创建对象模式的演变(原型)

    深入理解JavaScript中创建对象模式的演变(原型) 创建对象的模式多种多样,但是各种模式又有怎样的利弊呢?有没有一种最为完美的模式呢?下面我将就以下几个方面来分析创建对象的几种模式: Objec ...

  7. Java中创建对象的几种方式

    Java中创建对象的五种方式: 作为java开发者,我们每天创建很多对象,但是我们通常使用依赖注入的方式管理系统,比如:Spring去创建对象,然而这里有很多创建对象的方法:使用New关键字.使用Cl ...

  8. javascript中创建对象的方式总结

    javascript中创建对象的方式总结 具体代码如下: //创建对象的方式: //创建方式一 var person=new Object(); person.name='jack'; person. ...

  9. 实现JavaScript中继承的三种方式

    在JavaScript中,继承可以通过三种手法实现原型链继承 使用apply.call方法 对象实例间的继承.     一.原型链继承 在原型链继承方面,JavaScript与java.c#等语言类似 ...

随机推荐

  1. 去掉字符串前后的空格和Tab

    <script language=Javascript>function String.prototype.Trim() {return this.replace(/(^\s*)|(\s* ...

  2. springcloud-eureka简单实现

    请参考 spring+cloud为服务实战 第三章 一.创建Eureka服务 1.使用Idea创建一个项目 结构如下: 2.pom.xml配置: <?xml version="1.0& ...

  3. gj3 Python数据模型(魔法函数)

    3.1 什么是魔法函数 类里面,实现某些特性的内置函数,类似 def __xx__(): 的形式. 不要自己定义XX,并不是和某个类挂钩的 class Company(object): def __i ...

  4. Java synchronized关键字的理解

    转载自:http://blog.csdn.net/xiao__gui/article/details/8188833 在Java中,synchronized关键字是用来控制线程同步的,就是在多线程的环 ...

  5. MongoDB操作数据库的几个命令(自己用)

    本文以配置百度的Clouda为源头:http://cloudajs.org/docs 继而安装node.js:http://nodejs.org/download/(直接安装,简单) 和MongoDB ...

  6. 基于NLP和GAN的小说影视化

    轮廓: https://tieba.baidu.com/p/1271120336 着色:

  7. Window 下好用的同步备份工具(来自微软)SyncToy

    SyncToy 简单好用,满足备份的基本需求.

  8. java基础-day3

    第03天 java基础知识 今日内容介绍 u 选择流程控制语句 u 循环流程控制语句 u 控制循环语句 第1章   选择流程控制语句 1.1  顺序结构的基本使用 1.1.1 顺序结构概述 是程序中最 ...

  9. Tomcat服务器(一)

    一.tomcat目录中重要的文件: bin 存放启动和关闭的脚本 conf  存放配置文件 logs 日志文件 webapps 存放部署的项目 work 工作目录 Web应用开发好后,若想供外界访问, ...

  10. EasyUi TreeGrid/DataGrid getChecked BUG

    问题描述 步骤一,选中左边树一个节点,然后出现相应的数据,选中进行保存.如,我选中了前4个节点,上图: 步骤二,我再选tree中第二个节点,进行相应的选中和取消选中treegrid中的节点,并保存. ...