javascript 链式调用+构造函数
前几天面试,有一个问题是使用构造函数实现链式调用,后面查看了一些简单的资料,整理一下
首先,先说一下JS 中构造函数和普通函数的区别,主要分为以下几点
1、构造函数也是一个普通函数,创建方式和普通函数一样,但构造函数习惯上首字母大写 2、构造函数和普通函数的区别在于:调用方式不一样。作用也不一样(构造函数用来新建实例对象) 3、调用方式不一样。
a. 普通函数的调用方式:直接调用 person();
b.构造函数的调用方式:需要使用new关键字来调用 new Person(); 4、构造函数的函数名与类名相同:Person( ) 这个构造函数,Person 既是函数名,也是这个对象的类名 5、内部用this 来构造属性和方法
如果我想新建一个构造函数,并新建其实例对象,那么我会这么做,举个栗子:
        function Person(name,job,age){
            this.name=name;
            this.job=job;
            this.age=age;
            this.sayHi=function(a){
                console.log(a)
                return this
            }
            this.sayHello=function(b){
                console.log(b)
            }
        }
可以看到如果我调用此构造函数的话,新建的对象会有五个属性,包括:name,job,age和两个函数属性,如下
var student = new Person("小k","coder","28");
console.log(student);

可以看到我在写构造函数的时候在 sayHi 中有 return this ,sayHello 中没有
此时我分别按不同的顺序链式调用两个函数参数,会得到不同的结果:
console.log(student.sayHi("hi").sayHello("hello"))
console.log(student.sayHello("hello").sayHi("hi"))

可以看到,如果我没有return this 的话链式调用是不成功的,因为sayHello默认的返回值是underfind,而underfind是没有sayHi 方法的。
由此可见,要实现链式调用,必须在构造函数的函数属性中return this,即:将this指向的本对象作为返回值,
this默认的指向为函数运行上下文,
当然this的指向并没有这么简单,此文不做赘述。
javascript 链式调用+构造函数的更多相关文章
- Javascript链式调用案例
		jQuery用的就是链式调用.像一条连接一样调用方法. 链式调用的核心就是return this;,每个方法都返回对象本身. 下面是简单的模拟jQuery的代码, <script> win ... 
- javascript链式调用实现方式总结
		方法链一般适合对一个对象进行连续操作(集中在一句代码).一定程度上可以减少代码量,缺点是它占用了函数的返回值. 一.方法体内返回对象实例自身(this) function ClassA(){ this ... 
- Javascript 链式操作以及流程控制
		春节过后,感觉过年吃的油腻的食品转化的脂肪都长到 脑子去了. 根本转不动啊 上班第一天 实在是写不动代码了, 顺手打开多天为看的 收件箱,查看查看邮件,看看春节期间 风云变幻的前端圈又有哪些大事发生. ... 
- js链式调用 柯里化
		var d = 1; d.add(2).add(3).add(4) //输出10 写出这个add函数 Number.prototype.add = function(x){ return this + ... 
- javascript方法链式调用和构造函数链式调用对比
		先说一下方法链:B的实例从A继承了A中的同名方法,如果B的方法重载了A中的方法,B中的重载方法可能会调用A中的重载方法,这种方法称为方法链. 构造函数链:子类的构造函数B()有时需要调用父类的构造函数 ... 
- JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承
		说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象J ... 
- [js高手之路] 设计模式系列课程 - jQuery的链式调用与灵活的构造函数
		一.我们从一个简单的构造函数+原型程序开始 var G = function(){}; G.prototype = { length : 5, size : function(){ return th ... 
- JavaScript 链式结构序列化详解
		一.概述 在JavaScript中,链式模式代码,太多太多,如下: if_else: if(...){ //TODO }else if(...){ //TODO }else{ //TODO } swi ... 
- 如何写 JS 的链式调用 ---》JS 设计模式《----方法的链式调用
		1.以$ 函数为例.通常返回一个HTML元素或一个元素集合. 代码如下: function $(){ var elements = []; ;i<arguments.length;i++){ v ... 
随机推荐
- 小记---------网页之htmlunit
			HtmlUnit是一款开元的Java页面分析工具,可以有效的使用htmlunit分析页面大汉的内容,项目可以模拟浏览器运行,被誉为Java浏览器的开元实现,这个没有界面的浏览器 API的使用 ... 
- Python自学笔记之计算机基础
			osi七层协议应用层-表示层-会话层-传输层-网络层-数据链路层-物理层 无线网协议 ethernet 物理层:网线,光纤 数据链路层:arp协议 mac地址,广播 在广播域内传播 网络层:ip地址标 ... 
- Druid + spring 配置数据库连接池
			1. Druid的简介 Druid是一个数据库连接池.Druid是目前最好的数据库连接池,在功能.性能.扩展性方面,都超过其他数据库连接池,包括DBCP.C3P0.BoneCP.Proxool.JBo ... 
- Oracle常用函数(3)
			1)to_char()函数,将日期转换为字符串表示 SQL> select to_char(sysdate,'yyyy"年"mm"月"dd"日& ... 
- Git 设置 用户名 和 邮箱
			git config --global user.name "Vincent" git config --global user.email "********@qq.c ... 
- FileUtils.writeByteArrayToFile方法
			FileUtil类是Apache Commons IO库里面的一个类,是与文件相关的一个辅助类,我写了一个可运行的java文件 import java.io.*; import org.apache. ... 
- 2019-11-29-Roslyn-使用-Directory.Build.props-文件定义编译
			title author date CreateTime categories Roslyn 使用 Directory.Build.props 文件定义编译 lindexi 2019-11-29 08 ... 
- linux命令详解——tar
			tar [-cxtzjvfpPN] 文件与目录 .... [参数]: -c :建立一个压缩文件的参数指令(create 的意思): -x :解开一个压缩文件的参数指令! -t :查看 tarfile ... 
- Delphi 帮助的使用
- 接口测试参数化详解(Jmeter)
			简介 接口测试是目前最主流的自动化测试手段,它组合不同的参数向服务器发送请求,接受和解析响应结果,通过测试数据的交换逻辑来验证服务端程序工作的正确性.我们在测试过程中需要考虑不同的输入组合,来覆盖不同 ... 
