Data-Context-Interaction (DCI) and programmable event in javascript

Question

I recently saw the following DCI presentation by Trygve Reenskaug: https://vimeo.com/43536416 It somehow blew my mind. Mmmh, seeing in the code, the interaction between the various software components is an attractive idea.

I tried to find DCI examples in javascript, unsuccessfully. Then I began to wonder. Is a DCI pattern the opposite of a programming pattern?

A programming event is fashionable in javascript, I think, because it allows you to unleash, and because the classic concepts of inheritance are not native to js. I think I understand the benefits of a programmable event, but I also noticed that debugging can be darn complicated when you need to follow an event message.

Is it possible to say that both concepts are opposite? Or was I wrong? Are there some examples of DCI implementation in js that I missed? What should I look at to dig out a concept?

Answer 1

First, event programming or inheritance is orthogonal to DCI. You can do DCI without inheritance and with event programming (or without).

JavaScript is, to some extent, one of the best languages ​​for DCI. Most languages ​​have some problems with the following DCI. In JavaScript, problems can be solved if there is a finalizer, but the lack of a finalizer means that you have to "manage" your value, meaning some kind of noilerplate code.

I wrote an example in JavaScript, which I will post on the Internet at http://fullOO.info , where you will find examples of Trygve, Jim, and I created with some other people also created.

fullOO.info is also the answer to where you could go to learn more about DCI, or you can join the google group to discuss DCI.

An example that I wrote in JS is a canonical money transfer using the DCI example, and the interesting part (that is, everything except the template / library code) can be seen below:

var moneyTransferContext = function(sourcePlayer, destinationPlayer, amount) { var source = { withdraw: function() { var text = "Withdraw: " + amount; this.log.push(text); this.balance -= amount; console.log("Balance: " + this.balance); } }, destination = { deposit: function() { var text = "Deposit: " + amount; this.log.push(text); this.balance += amount; console.log("Balance: " + this.balance); } }; source = assign(source).to(sourcePlayer); destination = assign(destination).to(destinationPlayer); return { transfer: function() { source.withdraw(); destination.deposit(); return this; } }; }, sourceAccount = { log: [], balance: 100 }, destinationAccount = { log: [], balance: 0 }; moneyTransfer(sourceAccount, destinationAccount, 25).transfer().unbind(); 

The rest can be seen at http://jsfiddle.net/K543c/17/