The beginning of the nonsense: Sometimes difficult to read the source code for me personally design logic may be difficult to understand, thought can not reach the heights, iOS OC, or swift RX figure, will be used, but the understanding of the source, it’s really hard to do fine, and many of the class is by some object “open branch leaf”, so, According to their own understanding of his ideas to write a simple small demo, pure ideas, code general.

What is a sequence? What is a subscription?

Sequence: A column is a group, a set, and an order is an order. Well, in fact, object-oriented programming is also procedural programming. An object is a collection of variables + methods. So, if you’re procedural oriented, you want your code to be logical, and sometimes you add callbacks to order your tasks to meet asynchronous requirements. Then, if there is too much code, the code becomes less readable. So do a task sequence out of the can be at a glance? A sequence of tasks is a collection of tasks that are executed in an orderly fashion, with an elegant “dot syntax” added to make it perfect.

Subscription: In fact, the subscription itself can be personally understood as the final result of who takes over the task queue. In RAC on iOS, there are many differences in subscription, such as: hot signal subscription (understand to watch live, you can not see the past), cold signal subscription (understand to buy food, you come, people buy you, and, you can have as many as there is).

Simple JS demo to understand

Start by creating three files:

Wrx. HTML file simple code

Here it’s simple, just referring to two other JS files and, of course, writing a chain of methods to call.


<! DOCTYPEhtml>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="./wrx.js" type="text/javascript"></script>
		<script src="./person.js" type="text/javascript"></script>
	</head>
	<body>
	</body>
	<script>
		var person = new Person();
		// Create an instance object of the Person class, display the name, load the data, and execute the login method
                person.wrx.showMyName().loadData().login().next(function(obj){
			console.log(obj);
		});
	</script>
</html>

Copy the code

Person.wrx The WRX property here puts it on Object.prototype. WRX, so that every class has one of these WRX objects.

Wrx.js file simple code

Wrx. js file is mainly for chain call processing and task execution.

The WRX class is defined here
function WRX() {
	// Save the data from the last task
        this.obj = null;
        // Save the callback method to execute for the subscription
	var _next = null;
        // Save the task queue (actually is an array, queue can be defined as a collection and execution order, such as: asynchronous queue, synchronous queue)
	var _missionQueue = [];
        // Next task creation method, here do two things, 1, save the task, 2, return this, in order to continue the "dot syntax"
	this.doNextWRXResult = function(cb){
		_missionQueue.push(cb);
		return this;
	}
	// This can be interpreted as a task completed to publish
	this.sendNext = function(obj){
		this.obj = obj;
                // It is important to note that subscribed method calls are made after all tasks have finished, in order to obtain the final result of the task queue.
		if(_missionQueue.length == 0){
			_next(this.obj);
		}
                // Since the publishing logic, whether asynchronous or synchronous, ends with this function, the next task is called here
		this.doMission();
	}
	// This is the last place for the outside world to call, for example, when different classes need to call the method to pass arguments.
	this.next = function(cb){
		var that = this;
		_next = cb;
                // Start task execution
		this.doMission();
	}
	// Execute the task sequence after the.next method, and add a timer when executing the task, which is also not added, to ensure that the task queue execution is placed after the current chain call function.
	this.doMission = function(){
		if(_missionQueue.length > 0) {var that = this;
			setTimeout(function(){
				var missionCB = _missionQueue[0];
				_missionQueue.splice(0.1);
				missionCB(that);
			},0); }}}// Factory method
function FactoryWRX(){
	return new WRX();
}

/ / bind the prototype
Object.prototype.wrx = FactoryWRX();
Copy the code

Simple code for the Person.js file

The person method is declared as this.wrx, which gives the method to the WRX object of the current object instance, and the method body is populated with this.wrx.donextwrxResult, which is saved to the task queue.

function Person() {
	// Synchronous call
        this.wrx.showMyName = function(){
		return this.wrx.doNextWRXResult(function(wrx){
			wrx.sendNext("WSL");
		});
	}
	
        // Simulate an asynchronous request
	this.wrx.loadData = function(){
		return this.wrx.doNextWRXResult(function(wrx){
			setTimeout(function(){
				wrx.sendNext(wrx.obj + "I don't want to talk anymore.");
			},5000);
		});
	}
	
        // Simulate an asynchronous request
	this.wrx.login = function(){
		return this.wrx.doNextWRXResult(function(wrx){
			setTimeout(function(){
				wrx.sendNext(wrx.obj + 'Login successful');
			},1000); }); }}Copy the code

Method execution effect

Three method implementations

Two method executions

Single method execution

Ok, demo is very simple, no level, mainly to help understand some programming ideas. It is said that there are 400 ways to prove the Pythagorean theorem, but the Pythagorean theorem was put forward only once. So, design patterns are the gateway to another world.

Bad code, no laughing matter.