致敬WordPress Hooks,开发了 Javascript 版的钩子。不依托于任何第三方库,可独立运行。
什么是钩子
钩子分为 Action 和 Filter 两种。
- Action:动作,执行到代码这个位置时,同时调用其他方法。
- Filter:过滤器,代码在这个位置可能需要过滤数据,数据通过参数传递给外部方法后返回。
无论WordPress还是Javascript,其目的都是:在代码正常执行过程中为二次开发预留的接口。从而实现:一定程度上无需修改源代码而实现二次开发。可以理解为:
- 编写一套通用的工作流。工作流本身的编写人提前考虑到一些可能的情况。并在考虑到的情况中预埋钩子。
- 接下来,执行人在执行工作流前,预先添加工作流中可能用得到的钩子,然后再执行工作流。当工作流执行到预埋钩子的位置时,被添加的方法得到调用。
Action钩子示例
有下面的工作流:
开始
-步骤1
-步骤2
-步骤3
-步骤4
-结束
在这个流程中,我们提前考虑到:当步骤2执行完成后,可能有其他的功能需要同时执行
。
但是我们不知道何时执行完步骤2。因此使用Action钩子。
于是,工作流(源代码)的编写人(开发人员)在编写源代码时,在步骤2结束的代码后,预埋了“do_action”钩子,并告知了执行人(用户)动作名称。
最终源代码发布给执行人(用户)使用时,就可以通过“add_action”在步骤2执行完成后同时执行工作流以外的联动方法。
Filter过滤器示例
有下面的工作流:
开始
-步骤1
-步骤2
-步骤3
-步骤4
-结束
在这个流程中,我们提前考虑到:步骤3的 数据可能会被再次处理
后流转到下一个步骤。
但是我们不知道步骤3的原始数据,也不知道何时执行完步骤3。因此使用Filter钩子。
于是,工作流(源代码)的编写人(开发人员)在编写源代码时,在步骤3处理完后的数据中,预埋了“apply_filters”钩子,并告知了执行人(用户)过滤器名称。
最终源代码发布给执行人(用户)使用时,就可以通过“add_filter”对步骤3的数据进行外部处理后返回,步骤4就能得到外部处理的结果。
类比WordPress钩子
WordPress钩子同样是这个原理。例如:wp的the_content过滤器。在输出文章数据的时候,如果发现用户添加过the_content过滤器,就使用用户过滤返回后的数据,于是输出的文章内容就是用户使用钩子修改的内容了。
当然,用户在添加这个钩子的时候,并不知道文章内容是什么,所以也不知道如何修改。因此过滤器接收参数。用户在过滤的时候就可以根据原始内容就行过滤。然后再返回。