定义:在JavaScript中,用new关键字来调用的函数,称为构造函数,构造函数首字母一般大写。

理解:

构造函数就是初始化一个实例对象,对象的prototype属性是继承一个实例对象。

创建对象,并调用函数,new fn,无参;

创建对象,并调用函数,new fn(),带参;

在构造函数中显示调用return,如果返回的值是一个对象,它会代替新创建的对象实例返回。如果返回的值是一个原始类型,它会被忽略,新创建的实例会被返回。

看例子!

        function Person(name, age) {
this.name = name;
this.age = age;
}
var p1 = new Person('lili',10);
console.log(p1);

打印结果:

Person {name: 'lili', age: 10}

创建带参无参对象及调用函数:

        function fn(a) {
this.a = a;
this.b = 20;
return "hello";
} var re = new fn;  //构造函数
console.log(re); var re2 = new fn(200);  //构造函数
console.log(re2); var re3 = fn(90);  //普通函数调用
console.log(re3);

打印结果:

fn {a: undefined, b: 20}
fn {a: 200, b: 20}
hello

理解:

首先定义变量提升;re是创建了一个新对象,并调用了不带参数的函数fn;re2也是创建了一个新对象,并传入参数,隐式操作是var a = 200,并调用函数;re3是函数调用,并传入参数 a = 90。

例:

        function fn() {
this.name = "karen";
return function fm() {
console.log("fm运行了");
this.name = "jack";
}
}
var f1=new fn();
console.log(f1);
console.log(f1.name); //"fm"

理解:f1的结果看fn函数的返回值是不是引用数据,如果是,则返回哪个引用数据,此时是一个fm函数,如果不是一个对象,那么

就返回新创建的对象。

例:

        function fn() {
this.name = "marry";
var obj = {
name: "karen",
fm: function () {
this.name = "jack"
}
}
return obj;
} var f1 = new fn();
console.log(f1.name); //karen var f2 = new((new fn()).fm)();
console.log(f2.name); //jack var f3 = new fn();
var f4 = new(f3.fm)();
console.log(f3.name, f4.name); //karen,jack

理解:

f2:首先new fn()创建一个对象,再调用,返回一个obj对象,再引用成员fm,并创建一个新的对象,再调用name,因此打印jack。

f3和f4是f2拆分的结果,应该能理解。

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. Java 在Word指定段落/文本位置插入分页符

    在Word插入分页符可以在指定段落后插入,也可以在特定文本位置处插入.本文,将以Java代码来操作以上两种文档分页需求.下面是详细方法及步骤. [程序环境] 在程序中导入jar,如下两种方法: 方法1 ...

  2. Python简单爬取Amazon图片-其他网站相应修改链接和正则

    简单爬取Amazon图片信息 这是一个简单的模板,如果需要爬取其他网站图片信息,更改URL和正则表达式即可 1 import requests 2 import re 3 import os 4 de ...

  3. 『现学现忘』Git基础 — 12、Git用户签名(补充)

    目录 1.修改用户签名 2.取消用户签名 3.用户签名的优先级 4.总结本文用到的Git命令 1.修改用户签名 其实很简单,就是重新执行git config命令,换个用户名和邮箱地址就可以了,新配置的 ...

  4. pdf.js 预览文件中文内容丢失

    问题: 在.netcore中使用pdf.js,pdf中有部分中文无法显示 在浏览器控制台发现有报错 发现在pdf.view.js中url路径异常,没有指向cmaps文件,于是调整了正确的相对路径 再次 ...

  5. ubuntu 16.04,ros kinetic 使用husy_gazebo

    我当前使用的是ubuntu 16.04,ros kinetic ,Gazebo版本为7.0.protoc需要确保版本为2.6.1,而我当前的为3.4.0,因此需要将系统中的protoc替换为2.6.1 ...

  6. RabbitMQ 3.9( 基础 )

    1.认识MQ 1.1.什么是MQ? MQ全称:message queue 即 消息队列 这个队列遵循的原则:FIFO 即 先进先出 队列里面存的就是message 1.2.为什么要用MQ? 1.2.1 ...

  7. 流量录制回放工具jvm-sandbox-repeater入门篇——录制和回放

    在上一篇文章中,把repeater服务部署介绍清楚了,详细可见:流量录制回放工具jvm-sandbox-repeater入门篇--服务部署 今天在基于上篇内容基础上,再来分享下流量录制和回放的相关内容 ...

  8. 有关状压DP

    [以下内容仅为本人在学习中的所感所想,本人水平有限目前尚处学习阶段,如有错误及不妥之处还请各位大佬指正,请谅解,谢谢!] 引言 动态规划虽然已经是对暴力算法的优化,但在某些比较特别的情况下,可以通过一 ...

  9. WPF中的依赖属性

    1. WPF中的依赖属性 依赖属性是专门基于WPF创建的.在WPF库实现中,依赖属性使用普通的C#属性进行了包装,使用方法与普通的属性是相同的. 1.1 依赖属性提供的属性功能 资源 数据绑定 样式 ...

  10. 我用13行摆烂了你的oj4

    13行代码AC oj4是怎么回事呢?13行代码AC oj4相信大家都很熟悉,但是13行代码AC oj4是怎么回事呢,下面就让小编带大家一起了解吧.13行代码AC oj4,其实就是13行代码AC oj4 ...