ECMAScript中的构造函数可用来创建特定类型的对象。我们可以创建自定义构造函数,从而定义对象类型的属性和方法,解决工厂模型中对象识别的问题。

<!DOCTYPE html>
<html>
<head>
<title>构造函数模型</title>
<script type="text/javascript">
function Student(name,age,sex){//构造函数首字母大写,普通函数首字母小写
//直接将属性和方法赋值给this对象
this.name=name;
this.age=age;
this.sex=sex;
this.sayName=function(){
alert(this.name);
};
} /****************************** 构造函数模型 ******************************/
/*创建Student的新实例实际经历的步骤:
(1)创建一个新对象
(2)将构造函数的作用域赋值给新对象(因此this指向了新对象)
(3)执行构造函数中的代码(为新对象添加属性和方法)
(4)返回新对象
*/
var stu1=new Student("Lucy",10,"girl");//使用操作符new
var stu2=new Student("Bob",9,"boy"); //以上的stu1和stu2这两个对象的constructor(构造函数)属性均指向Student
alert(stu1.constructor==Student);//true
alert(stu2.constructor==Student);//true //对象的constructor属性最初是用来表示对象类型的。检测对象类型使用instanceof更可靠
alert(stu1 instanceof Student);//true
alert(stu2 instanceof Student);//true
alert(stu1 instanceof Object);//true
alert(stu2 instanceof Object);//true
/*************************************************************************/ /**************************** 1.构造函数当作函数 **************************/
//当作构造函数
var stu3=new Student("Nike",10,"boy");
stu3.sayName();//"Nike"
//当作普通函数
Student("Greg",13,"boy");//添加到window对象
window.sayName();//"Greg"
//在另一个作用域中调用
var o=new Object();
Student.call(o,"Kristen",8,"girl");
o.sayName();//"Kristen"
/************************************************************************/ /**************************** 2.构造函数模型问题 *************************/
//问题:每个方法都要在每个实例上重新创建一遍,不同实例上的同名函数是不相等的。为解决这一问题于是就有了原型模型
alert(stu1.sayName==stu2.sayName);//false
/************************************************************************/ </script>
</head>
<body>
</body>
</html>

部分摘自《JavaScript高级程序设计(第3版)》

JS面向对象——构造函数模型的更多相关文章

  1. JS面向对象——组合使用构造函数模型与原型模型

    该模型为创建自定义类型最常用的方式. <!DOCTYPE html> <html> <head> <title>组合使用构造函数模型和原型模型</ ...

  2. JS面向对象——组合使用构造函数模型与原型模型中的隐患

    组合使用构造函数模型和原型模型中的问题,使用对象字面量重写原型模型会有隐患(涉及到原型的动态性),如下例: <!DOCTYPE html> <html> <head> ...

  3. JS面向对象——动态原型模型、寄生构造模型

    动态原型模型 组合使用构造函数模型和原型模型,使得OO语言程序员在看到独立的构造函数和原型时很困惑.动态原型模型致力于解决该问题,它把所有的信息封装在构造函数中,通过在构造函数中初始化原型(仅在必要情 ...

  4. js面向对象的实现(example 二)

    //这个方法和上篇文章(js面向对象的实现(example 一))中的方法类似,但是更为简洁 //通过函数赋值的方式来构造对象 //同样通过闭包的方式来封装对象及内部变量 (function () { ...

  5. 浅谈JS面向对象之创建对象

    hello,everybody,今天要探讨的问题是JS面向对象,其实面向对象呢呢,一般是在大型项目上会采用,不过了解它对我们理解JS语言有很大的意义. 首先什么是面向对象编程(oop),就是用对象的思 ...

  6. js面向对象继承

    前言 最近看到js面向对象这章节了,主要学习了原型和面向对象继承关系,为了梳理自己的知识逻辑,特此记录. js的面向对象 先说说我目前了解的js创建对象方法 1.写一个函数,然后通过new创建对象 2 ...

  7. 拖拽系列二、利用JS面向对象OOP思想实现拖拽封装

    接着上一篇拖拽系列一.JavaScript实现简单的拖拽效果这一篇博客将接着对上一节实现代码利用JS面向对象(OOP)思维对上一节代码进行封装; 使其模块化.避免全局函数污染.方便后期维护和调用:写到 ...

  8. JS面向对象笔记二

    菜单导航,<JS面向对象笔记一>,  参考书籍:阮一峰之<JavaScript标准参考教程> 一.构造函数和new命令 二.this关键字 三.构造函数和new命令 四.构造函 ...

  9. 【JavaScript】 JS面向对象的模式与实践 (重点整治原型这个熊孩子 (/= _ =)/~┴┴ )

    参考书籍 <JavaScript高级语言程序设计>—— Nicholas C.Zakas <你不知道的JavaScript>  —— KYLE SIMPSON   在JS的面向 ...

随机推荐

  1. VPX板卡 基于XC7K325T的3U VPX FMC接口数据收发预处理平台

    一.板卡概述       标准VPX 3U板卡, 基于Xilinx公司的FPGAXC7K325T-2FFG900 芯片,pin_to_pin兼容FPGAXC7K410T-2FFG900 ,支持PCIe ...

  2. Flutter-showBottomSheet底部彈出框

    onPressed: () { showModalBottomSheet( context: context, builder: (BuildContext context) { return new ...

  3. windows java jdk安装

    安装 下载地址:https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 勾选协议,选择 ...

  4. 什么是网站TDK?

    什么是网站TDK?可能很多新手站长与SEOer不知道.其实TDK就是网站的标题(title).描述(description)和关键词(keyword),TDK是网站很重要的元素,他是蜘蛛爬取你的网站之 ...

  5. Python 类的属性和实例属性 Python 的动态语言

    #定义一下类, 含有类属性 aaa, >>> class Aa: ... aaa = 10... #对类 Aa实例化出一个实例 a1>>> a1 = Aa() &g ...

  6. firewall&iptables

    一.firewall 查看firewall状态 firewall-cmd --state 如果firewall为关闭状态,先启动firewall systemctl start firewalld 添 ...

  7. PHP curl_escape函数

    curl_escape — 对给定的字符串进行URL编码. 说明 string curl_escape ( resource $ch , string $str ) 该函数对给定的字符串进行URL编码 ...

  8. PHP curl_close函数

    说明 void curl_close ( resource $ch ) 关闭一个cURL会话并且释放所有资源.cURL句柄ch 也会被释放. 参数 ch 由 curl_init() 返回的 cURL ...

  9. STM32 TIM3 PWM输出 4路

    一.设置TIM3的GPIO为推挽输出 void TIM3_IOConfig(void) { GPIO_InitTypeDef GPIO_InitStructure; RCC_APB2PeriphClo ...

  10. powerdesigner 15.1 逆向工程 sqlserver2008 、sqlserver2005 带注释

    第一种方法:在第一个网址里面的代码可以直接赋值到对应位置即可 http://wjqe.blog.163.com/blog/static/19938452011612536439/ 第二种方法:可塑性较 ...