浅谈JavaScript创建对象

  好久没写博客了,今天补一下,废话不多说,咱们进入正题。

  在java中,有这么一句话叫”万物接对象“,那么我今天就来说一下在JavaScript中怎么创建对象,当然要与其他语言作对比,作参照,才能更容易理解。

  对象由什么组成,方法与属性(行为)。

  在java中怎么创建对象,无非就是Object obj = new Object(),没错,JavaScript中也可以使用如此,细心的同学会发现,大多数语言在大多数方面有共通之处,

方法一、

   工厂模式:

      对于工厂模式,这个词大家都不陌生,陌生的话脑补一下”工厂“的车间的生产方式,没错,就是那样,举个栗子:

      function dog(name, age, voice){

        var obj = new Object();

        obj.name = name;

        obj.age = age;

        obj.voice = voice;

        obj.bark = function(){

          alert(this.voice);

        }

        return obj;

      }

      var dog_1 = dog("kugou", 12, " o o o ");

      dog_1.bark();

      alert(dog_1.name);

  这个dog函数可以被调用n次(n->∞),每次调用这个函数都会返回一个含有三个属性和一个方法的对象,但是无法用typeof和instance来判断出对象的类型,即对象无法识别,只能判断出dog_1是object,为此,另外一个模式出现了。

方法二、

   构造函数模式,在Java,C++中都有构造函数,而且还差不多,都是函数名跟类名相同,比如:

    Java中:

        public class dog{

          public dog(){

          }

        }

   C++也跟Java一样,在Java和C++中构造函数可以有多个,根据参数的不同而不同,扯远了,拐回来。

   在JavaScript中的原生对象都有原生的构造函数,如Object,Array等...。在运行时自动出现在执行环境中。我们也可以创建自定义的构造函数

    

      function dog(name, age, voice){

        this.name = name;

        this.age = age;

        this.voice = voice;

        this.bark = function(){

          alert(this.voice);

        }

      }

      var dog_1 = new dog("kugou", 12, " o o o ");

      dog_1.bark();

  在与上面的工厂模式相比,少了显示地创建Object对象,直接将属性和方法都赋给了this对象,而且没有return语句。在创建新的dog对象的时候,要用到new关键字,没错就是new,这跟JavaScript中自带的类的创建方式差不多了吧,new一个对象要经过一下步骤:

      ①创建一个新对象

      ②将构造函数的作用域给新对象,<!--this就指向了这个新对象-->

      ③构造函数中的代码,同时给这个对象添加属性

      ④返回新对象

  对象的constructor属性是用来标识对象的如

  alert(dog_1.constructor == dog)

  alert(dog_1 instanceof dog);

方法三、

    原型模式

      我们创建的每一个函数都有一个prototype属性,prototype是个对象,它的用途是包含可以由特定类型的所有实例共享所有的属性和方法。

      function dog(){

      }

      dog.prototype.name = "kugou";

      dog.prototype.age = 12;

      dog.prototype.voice = " o o o ";

      dog.prototype.bark = function(){

        alert(this.voice);

      }

      var dog_1 = new dog();

      dog_1.bark();

  所有prototype都会自动获得一个constructor属性,如:dog.prototype.constructor就是指向dog的,而我们的dog的构造函数是一个空函数,与构造函数不同的是新对象的这些属性和方法是由所有实例共享的,而构造函数就是独自拥有的。想理解原型模式,就得先理解ECMAScript中得原型的性质。

  先讲到这,脑休一下 0.0

时间: 2024-12-29 01:28:57

浅谈JavaScript创建对象的相关文章

浅谈JavaScript中的原型模式

在JavaScript中创建对象由很多种方式,如工厂模式.构造函数模式.原型模式等: <pre name="code" class="html">//工厂模式 function createPerson(name,age,job) { var o = new Object; o.name = name; o.age = age; o.job = job; o.sayName = function() { alert(this.name); } retur

浅谈javascript的原型及原型链

浅谈javascript的原型及原型链 这里,我们列出原型的几个概念,如下: prototype属性 [[prototype]] __proto__ prototype属性 只要创建了一个函数,就会为该函数创建一个prototype属性,指向该函数的原型对象.实例对象是不会拥有该属性的.默认情况下,该原型对象也会获得一个constructor属性,该属性包含一个指针,指向prototype属性所在的函数. Person.prototype.constructor===Person [[proto

浅谈 JavaScript 编程语言的编码规范

对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编码规范也往往被轻视,开发过程中修修补补,最终也就演变成为后续维护人员的恶梦.软件存在的长期价值直接与编码的质量成比例.编码规范能帮助我们降低编程中不必要的麻烦.而 JavaScript 代码是直接发送给客户浏览器的,直接与客户见面,编码的质量更应该受到关注. 本文浅谈 JavaScript 编程中关

浅谈javascript单体【读javascript设计模式第五章节单体有感】

单体,整个运行环境就独有一份,最简单的一种单体就是一个把所有属性和方法都集中在一起的对象,区别于一般的字面量对象,一般字面量对象是对一个物体的描述,集合该物体所具有的一些属性和方法,而单体则包含更多的些逻辑在里面,单体的好处有,划分命名空间,如果用来作为网页包装器,可以使得页面所有变量都封装在一个对象里,大幅度减小网页里的全局变量, 代码如: common.js (function(wz){ $.extend({ init:function(){ var self = this; this.bi

《浅谈JavaScript系列》系列技术文章整理收藏

<浅谈JavaScript系列>系列技术文章整理收藏 1浅谈JavaScript中面向对象技术的模拟 2浅谈javascript函数劫持[转自xfocus]第1/3页 3浅谈javascript 面向对象编程 4老鱼 浅谈javascript面向对象编程 5浅谈javascript的数据类型检测 6浅谈Javascript嵌套函数及闭包 7根据一段代码浅谈Javascript闭包 8浅谈JavaScript编程语言的编码规范 9浅谈Javascript面向对象编程 10浅谈JavaScript

浅谈javascript继承【读javascript设计模式第四章节继承有感】

javascript继承,无任是类式继承,原型式继承还是渗元式继承都是通过不同方法去围绕着prototype转,简单分析下三种不同继承方法是如何围绕prototype转的 一:类似继承,先上关键代码 function extend(subClass,supClass){ var fn = function(){}; fn.prototype = supClass.prototype; subClass.prototype = new fn(); subClass.prototype.constr

浅谈javascript函数劫持

http://www.xfocus.net/articles/200712/963.html 浅谈javascript函数劫持 文章提交:hkluoluo (luoluonet_at_hotmail.com) by luoluo on 2007-11-30 luoluonet_at_yahoo.cn http://www.ph4nt0m.org 一.概述 javascript函数劫持,也就是老外提到的javascript hijacking技术.最早还是和剑心同学讨论问题时偶然看到的一段代码,大

浅谈JavaScript运行机制

浅谈JavaScript运行机制 ? 想要了解一门语言,最好的办法就是了解它的运行机制.掌握了运行机制,能够让我们在开发中少走许多弯路,写出高质量的代码.本文简单介绍什么是JavaScript的运行机制,给刚刚接触JavaScript的小白一个初步的了解,为将来打好基础. 一.JavaScript 代码运行分两个阶段: 1.预解析---把所有的函数定义提前,所有的变量声明提前,变量的赋值不提前 2.执行---从上到下执行(按照js运行机制) 二.JavaScript运行机制的特点 1.JavaS

浅谈JavaScript的面向对象和它的封装、继承、多态

写在前面 既然是浅谈,就不会从原理上深度分析,只是帮助我们更好地理解... 面向对象与面向过程 面向对象和面向过程是两种不同的编程思想,刚开始接触编程的时候,我们大都是从面向过程起步的,毕竟像我一样,大家接触的第一门计算机语言大概率都是C语言,C语言就是一门典型的面向过程的计算机语言.面向过程主要是以动词为主,解决问题的方式是按照顺序一步一步调用不同的函数.面向对象是以名词为主,将问题抽象出具体的对象,而这个对象有自己的属性和方法,在解决问题的时候,是将不同的对象组合在一起使用. //面向过程装