JavaScript的一个重要功能就是面向对象的功能,通过基于对象的程序设计,可以用更直观、模块化和可重复使用的方式进行程序开发。

一组包含数据的属性和对属性中包含数据进行操作的方法,称为对象。比如要设定网页的背景颜色,所针对的对象就是document,所用的属性名是bgcolor,如document.bgcolor="blue",就是表示使背景的颜色为蓝色。

    JavaScript中的所有事物都是对象:字符串、数值、数组、函数此外,JavaScript允许自定义对象。所以javasript中的对象可以跟为内置对象和自定义对象两大类。javascript中的内置对象对于我们来说并不陌生,如Date(日期)对象、Array(数组)对象、Boolean(逻辑)对象、Global对象等。与之对应的是自定义对象的创建跟使用。在其他面向对象的语言中,对象的创建方式几乎都一致有一个统一的标准,然而由于javascript的灵活性,使得对象的定义跟创建都很灵活,没有统一的标准。正是由于没有标准,所以用起来稍不注意就会给代码带来隐患。

 

简单对象创建方式

  1. var Cat;
  2. Cat.name="tom";//添加属性并赋值
  3. Cat.age=2;
  4. Cat.sayHello=function(){
  5. alert("喵喵!");}
  6. Cat.sayHello();

工厂方式

  1. functionCreateCat(){
  2. var Cat=new object();
  3. Cat.name="Tom";//添加属性并赋值
  4. Cat.age=2;
  5. Cat.sayHello=function(){
  6. alert("喵喵!");
  7. }
  8. return Cat;
  9. }
  10. Cat.sayHello();//调用对象方法

每个对象都有自己的sayHello方法,所以开发者在此基础上有做了新的改进

  1. function say(){
  2. alert("喵喵!");
  3. }
  4. functionCreateCat(){
  5. var Cat=new object();
  6. Cat.name="Tom";//添加属性并赋值
  7. Cat.age=2;
  8. Cat.sayHello=say;
  9. return Cat;
  10. }

构造函数方式

  1. function Cat(name,age){
  2. this.name=name;//this当前对象
  3. this.age=age;
  4. this.sayHello=function(){
  5. alert("喵喵!");
  6. }
  7. }
  8. var cat =new Cat("Tom",5,);//实例化/创建对象
  9. cat.sayHello();//调用方法

缺点同最初工厂方法一样每个对象都有自己的方法或函数。

原型方式

  1. function Cat(){
  2. }
  3. Cat.prototype.name="Tom";
  4. Cat.prototype.sayHello=function(){
  5. alert("喵喵!");
  6. }
  7. var cat =new Cat();
  8. cat.sayHello();

    原型方式实现了属性和函数的共享,解决了工厂及构造函数的不能共享函数的问题,同时也带来了新的问题。原型方式不能通过构造函数初始化属性,当属性是常量或函数时没有问题,当属性为对象时此时多个对象就会共享此属性即所有对象的此属性指针指向同一对象。

 

  1. function Cat(){
  2. }
  3. Cat.prototype.name="Tom";
  4. Cat.prototype.legs=newArray("leftfront","leftbehind","rightfront","rightbehind");
  5. Cat.prototype.sayHello=function(){
  6. alert("喵喵!");
  7. }


此时Cat类型所有对象的legs属性都共享一个数组对象。

 

混合模式(原型和构造函数)

  1. function Cat(name,age){
  2. this.name=name;
  3. this.age=age;
  4. }
  5. Cat.prototype.sayHello=function(){
  6. alert("喵喵!");
  7. }
  8. var cat =new Cat("Tom",27);
  9. cat.sayHello();

动态原型

  1. function Cat(name,age){
  2. this.name=name;
  3. this.age=age;
  4. if(typeofCat.initialized=="undefined"){
  5. Cat.prototype.sayHello=function(){
  6. alert("喵喵!");
  7. }
  8. Cat._initialized=true;
  9. }
  10. }

该方法使用标志(_initialized)来判断是否已给原型赋予了任何方法。该方法只创建并赋值一次,与传统的OOP语言,这样的代码更像其它面向对象语言中的定义。

总结

javascript自定义对象主要解决的就是在创建对象时保证属性和方法的创建,并且该类型的所有都象都不共享属性而必须保证该类型的所有对象必须共享函数或方法。目前使用最广泛的是混合的构造函数/原型方式。此外,动态原型方式也很流行,在功能上与构造函数/原型方式等价。不过不要单独使用构造函数或原型模式,因为这两种方式往往会给代码引入问题。

几类javascript常用的创建对象方法的更多相关文章

  1. php面向对象类中常用的魔术方法

    php面向对象类中常用的魔术方法   1.__construct():构造方法,当类被实例化new $class时被自动调用的方法,在类的继承中可以继承与覆盖该方法,例: //__construct( ...

  2. JavaScript常用对象的方法和属性

    ---恢复内容开始--- 本文将简单介绍JavaScript中一些常用对象的属性和方法,以及几个有用的系统函数. 一.串方法 JavaScript有强大的串处理功能,有了这些串方法,才能编写出丰富多彩 ...

  3. JavaScript常用定义和方法

    1.字符串一些常用方法,注意,调用这些方法本身不会改变原有字符串的内容,而是返回一个新字符串.toUpperCase()把一个字符串全部变为大写: var s = 'Hello'; s.toUpper ...

  4. JavaScript常用函数和方法

    alert('Hello World!') //方法用于显示带有一条指定消息和一个 OK 按钮的警告框. //定义js函数 function Foo(name) { console.log(name) ...

  5. JavaScript常用标签和方法总结

    什么是javascript?   (1) JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的 脚本语言. (2) JavaScript是由Nets ...

  6. java网络编程ServerSocket类 和Socket类的常用构造方法及其方法

    Socket类Socket(InetAddress address, int port) 创建一个流套接字并将其连接到指定 IP 地址的指定端口号.Socket(String host, int po ...

  7. Python 类的常用内置方法

    类的内置方法(魔法方法): 凡是在类内部定义,以__开头__结尾的方法,都是类的内置方法,类的内置方法,会在满足某种条件下自动触发. 1.1__new__ __new__:在___init__触发前, ...

  8. javascript 常用array类型方法

    concat:基于当前数组中的所有项创建一个新数据,会创建当前数组一个副本,然后将接受到的参数放到数组末尾,最后返回新数组.如果没有参数,则复制当前数组并返回副本. slice:基于当前数组中一个或多 ...

  9. JavaScript 常用数组函数方法专题

    1. 由字符串生成数组 split() 分割字符串,并将分割的部分作为一个元素保存在一个新建的数组中. var str1 = "this is an emample to using the ...

随机推荐

  1. 手脱JDPack

    1.PEID查壳 JDPack 2.载入OD,入口是一个pushad入栈,可以使用ESP,下硬件访问断点,shift+F9 0040E000 > pushad ; //入口 0040E001 E ...

  2. LINUX安全加固操作

    1.禁止Ctrl-Alt-Delete组合键重启系统 vi /etc/inittab #ca::ctrlaltdel:/sbin/shutdown -t3 -r now 如果还存在下面的文件,则需要注 ...

  3. python--生成器协程运算

    生成器 一.yield运行方式 我们定义一个如下的生成器: def put_on(name): print("Hi {}, 货物来了,准备搬到仓库!".format(name)) ...

  4. Python入门记录

    最近看到Python3.7版本已经发布了,安装了Aconda最新的版本.安装完成后测试: 在Python程序里有两种办法查看Python版本信息: import sys # 查看版本 print(sy ...

  5. Spring Boot + Swagger

    前言: 在互联网公司, 微服务的使用者一般分为两种, 客户端和其他后端项目(包括关联微服务),不管是那方对外提供文档 让别人理解接口 都是必不可少的.传统项目中一般使用wiki或者文档, 修改繁琐,调 ...

  6. html5的web存储详解

    以前我们在本地存储数据都是用document.cookie来存储的,但是由于其的存储大小只有4K左右,解析也很复杂,给开发带来了诸多的不便.不过现在html5出了web的存储,弥补了cookie的不足 ...

  7. CF767 C.Garland DFS

    LINK 题意:给定一棵树,每个节点拥有权值,问能否找到两个点,断开它们与父节点的边能使树分成权值和相等的三部分.权值可以为负 思路:进行两遍DFS,第一遍找最深的子树和为sum/3的节点,标记掉找到 ...

  8. 【IDEA】 Can't Update No tracked branch configured for branch master or the branch doesn't exist. To make your branch track a remote branch call, for example, git branch --set-upstream-to origin/master

    IDEA点击GIT更新按钮时,报错如下: Can't UpdateNo tracked branch configured for branch master or the branch doesn' ...

  9. 微信小程序开发(二)创建小程序

    安装完“微信Web开发者工具”后,手机扫描二维码进入页面. 点击“添加项目”,填入之前获得的AppID(无AppID可忽略),输入项目名称“Hello WXapplet”,选定本地文件夹作为项目目录. ...

  10. 图片异或(xor)getflag

    题目地址:https://files.cnblogs.com/files/nul1/flag_enc.png.tar 这题是源于:网鼎杯minified 经过测试隧道红色最低通道异常.其余均正常.所以 ...