Phil 2.10.15

8:00 – 4:00 SR

  • Discussed when to update PKIs on the servers with Ronda
  • Deployed a new version of FR for Dong
  • Discussed schedule with Chris
  • Angular,
    • Cleaned up the PasswordDirective to include an IloginObj interface and return types on all the functions inside linkFn() within the BaseLoginDirective class.
    • Working on example large controller
      • The ‘declare var’ trick of keeping TypeScript from complaining is only for external items that you set your local variables equal to. For example, the external Chrome function SpeechSynthesisUtterance  would be defined at the top of the TypeScript file that references as
        • declare var SpeechSynthesisUtterance:any;
      • Later, it gets used as
        • var querySpeech:any = new SpeechSynthesisUtterance();
      • It’s possible to build an interface for it (the entire idea behind definitelyTyped), but this is the way to get up and going quickly.
      • Callbacks have turned into a nightmare. A callback does not have a ‘this’ associated with it when it is called. As such, ANY OTHER MEMBER OF THE CLASS IS NOT AVAILABLE, since this is now ‘Window’ scope. See here for more info.
      • It all has to do with the way that TypeScript has to deal with the self = this problem. To tell TS (and implicitly EcmaScript 6), functions are created using ‘fat arrow’ notation (=>). In any case where you would be using ‘self’ rather than ‘this’ in JavaScript (i.e. nested functions), you need to use the fat arrow notation in TypeScript. In the case of an lambda function, it looks like this:
        • this.querySpeech.onend = (event:Event) => {
             this.queryService.submit(this.query, this.goodUserQuery, this.errorResponse);
          };
      • The generated Javascript looks like this:
        • this.querySpeech.onend = function (event) {
              _this.queryService.submit(_this.query, _this.goodUserQuery, _this.errorResponse);
          };
      • Note that rather than ‘self’ TypesScript has defined ‘_this’. It’s declared as you would expect it.
      • With respect to methods, the pattern in similar. Rather than declaring a method in the ‘default manner:
        • public runQuery(query:string){
             this.query = query;
             this.submit();
          };
      • A method should be declared as follows:
        • public runQuery = (query:string) => {
             this.query = query;
             this.submit();
          };
      • These result in very different JavaScript. The former generates a prototype:
        • QueryController.prototype.runQuery = function (query) {
              this.query = query;
              this.submit();
          };
      • While the latter generates a function that is within the ‘constructor’:
        • this.runQuery = function (query) {
              _this.query = query;
              _this.submit();
          };
      • As you can see, we know how things will work out with a callback in the second function because we’re using _this via closure. With the other JavaScript, things are much less clear – this could be global, or what apply would pass in. Scary.
      • I’m thinking that this way of calling functions is a better way of dealing with factories and directives. I’ll have to try that tomorrow.
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: