使用函数做自动化

function createObj(nick, age){
var obj = {
nick: nick,
age: age,
printName: function(){
console.log(this.nick);
}
};
return obj;
} var obj3 = createObj('Byron', 30);
obj3.printName();

我们通过创建一个函数来实现自动创建对象的过程

有型一些

要想让我们构造出的函数有型一些,我们需要了解一些额外知识

  • function作为构造函数(通过new操作符调用)的时候会返回一个类型为function的name的对象

  • function可以接受参数,可以根据参数来创建相同类型不同值的对象

  • function实例作用域内有一个constructor属性,这个属性就可以指示其构造器

new

new 运算符接受一个函数 F 及其参数:new F(arguments...)。这一过程分为三步:

  1. 创建类的实例。这步是把一个空的对象的 proto 属性设置为 F.prototype 。
  2. 初始化实例。函数 F 被传入参数并调用,关键字 this 被设定为该实例。
  3. 返回实例。

根据这几个特性,我们可以改造一下创建对象的方式

function Person(nick, age){
this.nick = nick;
this.age = age;
this.sayName = function(){
console.log(this.nick);
}
}
var p1 = new Person();

instanceof

instanceof是一个操作符,可以判断对象是否为某个类型的实例

p1 instanceof Person; // true
p1 instanceof Object;// true

instanceof判断的是对象

1 instanceof Number; // false

问题

构造函数在解决了上面所有问题,同时为实例带来了类型,但可以注意到每个实例printName方法实际上作用一样,但是每个实例要重复一遍,大量对象存在的时候是浪费内存

构造函数

  • 任何函数使用new表达式就是构造函数

  • 每个函数都自动添加一个名称为prototype属性,这是一个对象

  • 每个对象都有一个内部属性 __proto__(规范中没有指定这个名称,但是浏览器都这么实现的)
    指向其类型的prototype属性,类的实例也是对象,其proto属性指向“类”的prototype

prototype

通过图示我们可以看出一些端倪,实例可以通过__prop__访问到其类型的prototype属性,这就意味着类的prototype对象可以作为一个公共容器,供所有实例访问。

抽象重复

我们刚才的问题可以通过这个手段解决

  • 所有实例都会通过原型链引用到类型的prototype

  • prototype相当于特定类型所有实例都可以访问到的一个公共容器

  • 重复的东西移动到公共容器里放一份就可以了

看下代码

function Person(nick, age){
this.nick = nick;
this.age = age;
}
Person.prototype.sayName = function(){
console.log(this.nick);
} var p1 = new Person();
p1.sayName();

这时候我们对应的关系是这样的

终于有个靠谱的构建对象的方式了

js构造函数的更多相关文章

  1. JS构造函数的用法和JS原型

    $(function(){ var rec = new Rectangle(5, 10); //alert(rec.width + "*" + rec.height + " ...

  2. 谈谈JS构造函数

    //构造函数 //使自己的对象多次复制,同时实例根据设置的访问等级可以访问其内部的属性和方法 //当对象被实例化后,构造函数会立即执行它所包含的任何代码 function myObject(msg) ...

  3. Class和普通js构造函数的区别

    Class 在语法上更加贴合面向对象的写法 Class 实现继承更加易读.易理解 更易于写 java 等后端语言的使用 本质还是语法糖,使用 prototype Class语法 typeof Math ...

  4. js 构造函数 & 静态方法 & 原型 & 实例方法

    js 构造函数 & 静态方法 & 原型 & 实例方法 ES5 "use strict"; /** * * @author xgqfrms * @licens ...

  5. 深入研究js构造函数和原型

    很快就要从新浪离职了,最近心情比较轻松,抽点空整理一下构造函数和原型的机理. 我们都知道,在经典设计模式中我们最常用的就是工厂模式.构造函数模式.原型模式这几种,听起来‘模式’好像很高大上的样子,实际 ...

  6. js构造函数,索引数组和属性的属性

    本文主要介绍和小结js的构造函数,关联数组的实现方式和使用,及不可变对象和它的实现方式及他们使用过程中要注意的点 <script> function p(){ var len=argume ...

  7. JS构造函数原理与原型

    1.创建对象有以下几种方式: ①.var obj = {}; ②.var obj = new Object(); ③.自定义构造函数,然后使用构造函数创建对象 [构造函数和普通函数的区别:函数名遵循大 ...

  8. js 构造函数(construction)与原型(prototype)

    1.面向对象:js原型 java有class和instance,js仅仅有构造函数(function Cat(name,age){this.name=name;this.age=age}),为了实现数 ...

  9. JS构造函数、对象工厂、原型模式

    1.对象创建的3中方法 1.1.对象字面量 var obj = { name: "mingzi", work: function () { console.log("wo ...

  10. 完整原型链详细图解之JS构造函数、原型 原型链、实例化对象

    一.首先说一下什么是构造函数: 构造函数:用来在创建对象时初始化对象.特点:构造函数名一般为大写字母开头:与new运算符一起使用来实例化对象. 举例: function Person(){} //Pe ...

随机推荐

  1. J2EE项目应用开发过程中的易错点

    场景一 实体类型与数据库类型不一致,在进行条件查询过程中不走索引 分析 字段值类型和数据库定义的字段类型不一致时,MySQL就会在内部做数据转化, 它的处理行为就会和我们期望的有些不一样,当我们使用整 ...

  2. java 注解Annotation

    什么是注解?  注解,顾名思义,注解,就是对某一事物进行添加注释说明,会存放一些信息,这些信息可能对以后某个时段来说是很有用处的. java注解又叫java标注,java提供了一套机制,使得我们可以对 ...

  3. JobControl管理多job依赖完整示例

    处理 复杂的要求的时候,有时一个mapreduce程序是完成不了的,往往需要多个mapreduce程序,这个时候就要牵扯到各个任务之间的依赖关系,所谓 依赖就是一个MR Job 的处理结果是另外的MR ...

  4. ArrayList、Vector、LinkedList的区别及其优缺点? (转载)

    原文链接:http://blog.csdn.net/wangzff/article/details/7296648 ArrayList,LinkedList,Vestor这三个类都实现了java.ut ...

  5. c#局域网文件搬移

    /// kongxiang--2013.7.23 /// using System;using System.Collections.Generic;using System.Linq;using S ...

  6. php正则失效-最大回溯(pcre.backtrack_limit)/递归限制

    有时候,我们觉得,没有什么可以让我们快乐,我们甚至忘记了如何微笑.但是,当我们被一群乐观.欢乐的人包围的时候,他们从内心深处散发出来的欢迎一定会感染你. 这组照片中,你会看到真正的幸福和快乐的面孔,我 ...

  7. swift-计算器(斯坦福公开课)

    看了斯坦福老头的课,真心觉得,我的中文怎么也变的这么垃圾了.是关于iOS8的课程,用swift写的,一个计算器应用的制作,看看人家的课,再看看咱们学校的课(不过垃圾学校,纯粹觉得大学浪费了),废话啊, ...

  8. 05顺序队列_Queue--(栈与队列)

    #include "stdio.h" #include "stdlib.h" #include "io.h" #include " ...

  9. post 提交数据

    1 默认:application/x-www-form-urlencoded 在网页表单中可设置 enctype的值,如果不设,默认是 application/x-www-form-urlencode ...

  10. dubbo监控活跃线程数

    telnet对应dubbo服务的ip+端口号 status -l 其中的active就是当前的活跃线程数 通过程序定时探测写入DB,再查询渲染出来就好了 监控报警,如果已经有监控平台,可以通过一定的规 ...