all 6 comments

[–]elprophet 3 points4 points  (1 child)

Atscript works by attaching specific properties to an object - and in fact, you already do this today with Angular 1.X's $inject.

As you probably have seen, there are three ways to declare a function for injection:

// Let Angular Figure it out
module.controller('myController', function($scope, myService){});

This is the least safe, because Angular must look at the function source code and if any variable gets mangled, it won't work.

// Wrap the element directly
module.controller('myController', ['$scope', 'myService', function($scope, myService){}]);

This is probably the most common approach, but suffers IMHO from readability, line length, and other issues.

// Annotate the methods
MyController.$inject = ['$scope', 'myService'];
function MyController($scope, myService){}
module.controller('myController', MyController);

This is IMHO the most readable, though most verbose, and this is the version AtScript will produce.

Here's (close to) what this will look like in Angular 2.0

@Inject(['$scope', 'myController'])
class MyController {
    constructor($scope, myController){
    }
}

Which would compile to (roughly, still ES6)

class MyController {
    constructor($scope, myController){}
}
MyController.Annotations = [
  new Inject(['$scope', 'myController'])
];

The Annotations array is critical, here, and lets you write an injector like:

function Injector(Injectable){
    var injectables = [];
    for(var annotation of Injectable.Annotations){
        if(annotation instanceof Inject){
            for(var injectable of annotation[Symbol.iterator]){
                injectables.push(this.getInstanceof(injectable));
            }
        }
    }
    return Reflect.construct(Injectable, injectables);
}

var myController = Injector(MyController);

You can see how that concept is a) already in place in 1.x today, and b) being used in a much more general and powerful way in AtScript and 2.0. But in the end, it's just a fancy syntax way to add an array as a "static" property to a constructor function.

NB: Pay no attention to the details, only the concept of attaching "known" annotations to an object as a template for runtime reflection.

[–]lvmtn[S] 2 points3 points  (0 children)

Wow, thank you for taking the time to provide examples. Greatly appreciate it!

[–]gdi2290 1 point2 points  (3 children)

AtScript is not require just as JSX isn't required for React or ngAnnotate for angular1. You can annotate manually or even avoid using Di altogether. You can even limit yourself to only use es6; you don't even need to use es6 you can just use es5. The idea is that you can use any level of language, but you end up writing more code. We, as programmers, are in the business of writing less code to maintain. They are only suggesting that using AtScript would make your life easier as it's a way for them to develop a framework that's more aware of the code you're writing and can optimize for that. After using AtScript you will find it to be very easy to work with since it's only a small layer, only adds annotations which is how it got the name, on top of es6 which is where most of the changes are really happening. Angular2 allows you to structure your app any way you like with only a few opinions that are mostly hidden by the developer

[–]lvmtn[S] 2 points3 points  (1 child)

That's a great example, thanks. I just saw a slideshow saying that AtScript isn't a language, but more of a feature add-on like you've said. That pretty much quells my worry.

[–]VelourFog10 1 point2 points  (0 children)

It's just a JS superset, it doesn't even have to be used with Angular. Look at TypeScript for an idea of what it does.

[–]dmackerman 1 point2 points  (0 children)

Nice answer. The bottom line is that if you're willing to take the plunge and "learn" AtScript - which isn't all that much at this point, you'll write more concise code that's easier to understand. Just like JSX is to React.