说到javascript的链式编程
说到javascript的链式编程 ， 相信很多前端者就不由大脑的想到jquery的链式操作.
很多人最早开始接触链式操作 ， 就是从这开始的 。
实例代码一：
$“.box”.height200.width200
这段代码就是给一个类名称为.box的元素 设置高度 ， 又设置宽度 。
实例代码二：
实例代码二运行后结果如下：
文章图片
报错了 ， 说 width 不是一个函数 ，这是为什么呢？
明明jquery中有这width这个方法啊
实际上JQ大致原理是这样的：
//以下为原理说明 ， 非JQ源码
var obj = 封装...
return obj 。
【说到javascript的链式编程】$.prototype.width = function（val）
if（val）
修改宽度...
return this； //当函数有参时 ， 操作完成 ， 返回JQ对象本身
} else {
return 宽度； //当函数无参时 ， 则返回宽度（number类型）
$.prototype.height = function（val）
if（val）
修改高度...
return this； //当函数有参时 ， 操作完成 ， 返回JQ对象本身
} else {
return 高度； //当函数无参时 ， 则返回高度（number类型）
文章图片
我们无法对着一个数字调用方法 ， 因此链式调用就中断了 ， 过程如下图：
文章图片
总结：
jquery的链式编程 ， 一般用于设置操作 ， 不能会用于获取操作 。
因为设置操作不必返回设置后的结果 ， 而获取必须返回具体的值 。
链式调用的核心 ， 就是函数在执行完成后 ， 返回了this ， 即当前对象
接下来 ， 我们自己用javascript来练习一下
this.age=20；//默认值为20 。
//通过原型给 Person构造函数上添加一个设置年龄的方法
Person.prototype.setAge=function（num）
this.age=num 。
//通过原型给 Person构造函数上添加一个获取年龄的方法
return this.age 。
链式调用
错误提示：没有getAge属性
我们又把上面的Person构造函数代码改动一下 加上retrun this 。
//通过原型给 Person构造函数上添加一个设置年龄的方法
Person.prototype.setAge=function（num）
this.age=num 。
return this 。
再次运行
再次总结
javascript的链式编程的核心就是 return this 。
链式编程的优点：
代码变得简洁 ， 优雅 。
链式编程的缺点：
过长的链式 ， 会容易造成操作不明确 ， 难以维护 ， 不利于理解 。
本文相关词条概念解析：
编程
【说到javascript的链式编程】编程是编写程序的中文简称 ， 就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码 ， 并最终得到相应结果的过程 。 为了使计算机能够理解人的意图 ， 人类就必须要将需解决的问题的思路、方法、和手段通过计算机能够理解的形式告诉计算机 ， 使得计算机能够根据人的指令一步一步去工作 ， 完成某种特定的任务 。 这种人和计算机之间交流的过程就是编程 。 编程：设计具备逻辑流动作用的一种“可控体系”【注：编程不一定是针对计算机程序而言的 ， 针对具备逻辑计算力的体系 ， 都可以算编程】例子：①比如编写一段代码程序②编写一个控制设备体系 。
推荐阅读
- 趣头条|带奕歌外拍一下
- TA潮报|周迅就不会玩P图， 生活状态跟普通人一般，素颜都敢路面
- 癌症肿瘤|“吞口水就像是吃碎玻璃渣子”，说到癌痛，92岁院士落泪了！
- 固态硬盘|固态硬盘的寿命一般有多长，你了解过吗？
- 综艺|《乘风破浪的姐姐》收官：打破传统女团定义，她们说到做到了吗？
- 安静的等待|《幸福到万家》男主敲定了？看清是谁后，赵丽颖有压力了
- 莫小帅|手机这么玩，以后谁还戴套
- 趣事箩筐|从美国去俄罗斯怎么去？飞机还是火车？都不用
- 比特币|比特币矿霸——吴忌寒
- 游戏迷小刘|公布特斯拉活动结束时间，玩家：请说到做到，“吃鸡”光子不藏了