Shulou(Shulou.com)06/02 Report--

How to understand CSP in JavaScript? in view of this problem, this article introduces the corresponding analysis and solution in detail, hoping to help more partners who want to solve this problem to find a more simple and feasible way.

7 examples of Communicating Sequential Processes

What is CSP? Generally speaking, it is a set of solutions for writing parallel code.

This function is included in the Go language, and Clojure is implemented through core.async based on Macro.

Now JavaScript can also be supported through Generator, or the function of ES6.

Why should I care about CSP? Because it is powerful, efficient and simple. What else do you want after all this?:)

All right, tell me the details. How to use it? We use js-csp, and we need generator support for ES6.

That is to say, Node 4 or higher, or the browser code is compiled in Babel

Of course, other compilation tools may also work, but you need to make sure that Generator is supported.

Chrome is supposed to support Generator.

That's too much. Let's take a look at the example.

Example 1: process

The concept to learn is "process". A process can execute code, and that's it in a nutshell. :)

Note: of course, it is not the original process of the operating system, it is simulated in js.

This is the syntax for starting the process: the generator function is passed as an argument to the go function for execution.

Import {go} from 'js-csp'; go (function* () {console.log (' somethingbirds');}); / / terminal output: / = > something!

Example 2: the process can be paused

Use the yield keyword to pause a process to release the occupation of the current process:

Import {go, timeout} from 'js-csp'; go (function* () {yield timeout (1000); console.log (' something else after 1 secondhands');}); console.log ('somethingbirds'); / / terminal output: / = > something! / / = > something else after 1 second!

Example 3: the process waits for data from the pipeline

The second concept to learn is pipeline, which is also one. Pipes are like queues.

Once the process calls take on the pipe, the process pauses until someone else puts data into the pipe.

Import {go, chan, take, putAsync} from 'js-csp'; let ch = chan (); go (function* () {const received = yield take (ch); console.log (' RECEIVED:', received);}); const text = 'something'; console.log (' SENDING:', text); / / use putAsync to put a value ina / / channel from outside a process putAsync (ch, text); / / terminal output: / = > SENDING: something / = > RECEIVED: something

Example 4: processes communicate through pipes

On the other side of the pipe, processes that put data into the pipe are also paused until this process calls take.

The following example is a little more complicated. Try to follow the main line to verify the terminal output:

Import {go, chan, take, put} from 'js-csp'; let chA = chan (); let chB = chan (); / / Process A go (function* () {const receivedFirst = yield take (chA); console.log (' A > RECEIVED:', receivedFirst); const sending = 'cat'; console.log (' A > SENDING:', sending); yield put (chB, sending); const receivedSecond = yield take (chA); console.log ('A > RECEIVED:', receivedSecond) }); / / Process B go (function* () {const sendingFirst = 'dog'; console.log (' B > SENDING:', sendingFirst); yield put (chA, sendingFirst); const received = yield take (chB); console.log ('B > RECEIVED:', received); const sendingSecond = 'another dog'; console.log (' B > SENDING:', sendingSecond); yield put (chA, sendingSecond);}) / / terminal output: / = > B > SENDING: dog / / = > A > RECEIVED: dog / / = > A > SENDING: cat / / = > B > RECEIVED: cat / / = > B > SENDING: another dog / / = > A > RECEIVED: another dog

Example 5: pipes are also queues

Because the pipeline is a queue, when the process takes data from the pipe, other processes cannot get it. So it is a process to push the data, and it is also a process to get the data.

The following example shows that the second process never prints B > RECEIVED: dog

Because * processes have taken the data away.

Import {go, chan, take, put} from 'js-csp'; let ch = chan (); go (function* () {const text = yield take (ch); console.log (' A > RECEIVED:', text);}); go (function* () {const text = yield take (ch); console.log ('B > RECEIVED:', text);}) Go (function* () {const text = 'dog' console.log (' C > SENDING:', text); yield put (ch, text);}); / / terminal output: / = > C > SENDING: dog / / = > A > RECEIVED: dog

Example 6: buffered pipes do not block during put operation

Pipes can be buffered, that is, within a certain amount of data, and put operations can avoid congestion.

In this example, the first two writes do not block the process even if no other process calls take.

However, the number of caches in the pipeline is 2, so the third data blocks the process until other processes take the data.

Import {go, chan, put, buffers} from 'js-csp'; let ch = chan (buffers.fixed (2)); go (function* () {yield put (ch,' value A'); yield put (ch, 'value B'); console.log (' I should printout'); yield put (ch, 'value C'); console.log (' I should not printout');}); / / terminal output: / = > I should print!

Example 7: Dropping And Sliding Buffers

Fixed-size buffers block after N data, and for the first time, there are dropping and sliding controls for buffers.

The buffered dropping means that the pipeline can hold N pieces of data. Add additional data to the pipeline, and the pipeline will discard it.

Buffered sliding can also hold N pieces of data. However, instead of directly discarding new data, the original sliding buffer will be discarded, and the new data will be left in the buffer.

In the following example, value B and value C are discarded in the dropping buffer because there is already value A.

In the second process, when value B is put into the pipeline, value An is discarded.

Then value C is put into the pipe and value B is discarded.

According to how they work, the buffers of dropping and sliding never block!

Let droppingCh = chan (buffers.dropping (1)); let slidingCh = chan (buffers.sliding (1)); go (function* () {yield put (droppingCh, 'value A'); yield put (droppingCh, 'value B'); yield put (droppingCh,' value C'); console.log ('DROPPING:', yield take (droppingCh);}); go (function* () {yield put (slidingCh,' value A'); yield put (slidingCh, 'value B')) Yield put (slidingCh, 'value C'); console.log ('SLIDING:', yield take (slidingCh));}); / / terminal output: / = > DROPPING: value A / / = > SLIDING: value C

After using CSP for a while, writing code in callbacks or Promise is like a Jurassic technique.

I hope ES6's Generator will help CSP become a standard for JavaScript.

Just like what Go already is, and what is becoming in Clojure.

Two other models are also interesting and can be thought of as a little higher than the CSP level:

Functions are also Rx and Actors, which are used in Rx and Erlang, respectively.

I also believe that CSP is great for front-end frameworks.

This is the answer to the question about how to understand CSP in JavaScript. I hope the above content can be of some help to you. If you still have a lot of doubts to solve, you can follow the industry information channel to learn more about it.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.