Node.js:

Concepts review (in JavaScript, but it’s more suitable to create ‘em here):

• this is (quoted from the page) “When a function is invoked, an activation record, otherwise known as an execution context, is created. This record contains information about where the function was called from (the call-stack), how the function was invoked, what parameters were passed, etc. One of the properties of this record is the this reference which will be used for the duration of that function’s execution. … this is actually a binding that is made when a function is invoked, and what it references is determined entirely by the call-site where the function is called.”

  // Unless specified, all following examples should (partially) come from https://github.com/getify/You-Dont-Know-JS/blob/master/this%20&%20object%20prototypes/README.md#you-dont-know-js-this--object-prototypes
  // Honestly I dont see the more clearity in opening API in Ver1 than Ver2
  // But we'll take the very sincere note (and I quote here): 'However, the this mechanism provides a more elegant way of implicitly "passing along" an object reference, leading to cleaner API design and easier re-use. The more complex your usage pattern is, the more clearly you'll see that passing context around as an explicit parameter is often messier than passing around a this context.' 
  
  // API Ver1
  // e.g. identify.call(someObj)
  function identify() {
      return this.name.toUpperCase();
  }
    
  function speak() {
      var greeting = "Hello, I'm " + identify.call( this );
      console.log( greeting );
  }
    
  // API Ver2
  // e.g. identify(someObj)
  function identify(context) {
      return context.name.toUpperCase();
  }
    
  function speak(context) {
      var greeting = "Hello, I'm " + identify( context );
      console.log( greeting );
  }
  

  // Can you tell the difference between ø and pseudoø in the following?
  var ø = Object.create(null);
  var pseudoø = {};
  

  // Be aware of function indirection
  function foo() {
      console.log( this.a );
  }
    
  var a = 2;
  var o = { a: 3, foo: foo };
  var p = { a: 4 };
    
  o.foo(); // 3
  (p.foo = o.foo)(); // 2
  

  // Arrow function says: Im gonna use this from my enclosing scope
  function foo() {
    // return an arrow function
    return (a) => {
      // `this` here is lexically adopted from `foo()`
      console.log( this.a );
    };
  }
    
  var obj1 = {
    a: 2
  };
    
  var obj2 = {
    a: 3
  };
    
  var bar = foo.call( obj1 );
  bar.call( obj2 );
  

• Call-site
• Implicit Binding VS Explicit Binding VS ‘New’ Binding (And ordery?)
• Object
• string VS String; number VS Number; …
• Computed Property Names

  // New commer: Reporting for duty!
  var prefix = "foo";
  
  var myObject = {
    [prefix + "bar"]: "hello",
    [prefix + "baz"]: "world"
  };
    
  myObject["foobar"]; // hello
  myObject["foobaz"]; // world
  

• Duplicating objects
• Shallow copy VS Deep copy
• Writable, Configurable, Enumerable

  // Writable test 
  // 'use strict' => TypeError (on o.a = ...)
  var obj = {};
  
  Object.defineProperty(obj, 'q', {
    value: 100,
    writable: false, // <-- not writable!
    configurable: true,
    enumerable: true
  });
  
  o.a = 3;
  console.log(obj.a); // Should be 100
  

  // How to, say, make some property undeletable? How about 'configurable'?
  // 'use strict' => TypeError (on delete ...)
  var obj = {};
  Object.defineProperty(obj, 'qq', {
    value: 1,
    writable: true,
    configurable: false,
    enumerable: true,
  });
  delete obj.qq;
  

• Object constant, Extension prevention, Seal, Freeze

  // How to prevent accidentally operations on obj's array?
  // Independent of 'use strict' => TypeError (on Object. ...)
  var obj = {
    arr: [1],
  };
  Object.preventExtensions(obj.arr);
  

• [[GET]] VS Reference a variable/identifier
• [[Prototype]] chain
• Shadowing

  // Anduin Wrynn: Shadowy thought ...
  // Case1 property on [[Prototype]] chain & not R.O.
  var hiObj = {
    a: 1,
  };
  var loObj = Object.create(hiObj);
  loObj.a = 123;
  console.log('Shadowing ...', 'hi:', hiObj, 'lo:', loObj);
  
  // Case2 property on [[Prototype]] chain & R.O.
  var hiObj = {};
  Object.defineProperty(hiObj, 'a', {
    value: 1,
    writable: false,
    configurable: true,
    enumerable: true,
  });
  var loObj = Object.create(hiObj);
  loObj.a = 123;  // 'use strict' => TypeError
  console.log('OMG! Wheres my Raza?', 'hi:', hiObj, 'lo:', loObj);
  
  // Case3 property on [[Prototype]] chain & setter
  // Well ...
  
  // Here's 'How to shadowing' in Case2,3 described in https://github.com/getify/You-Dont-Know-JS/blob/master/this%20%26%20object%20prototypes/ch5.md#setting--shadowing-properties
  // If you want to shadow foo in cases #2 and #3, you cannot use = assignment, but must instead use Object.defineProperty(..) (see Chapter 3) to add foo to myObject.
  // Revisit Case2
  var hiObj = {};
  Object.defineProperty(hiObj, 'a', {
    value: 1,
    writable: false,
    configurable: true,
    enumerable: true,
  });
  var loObj = Object.create(hiObj);
  Object.defineProperty(loObj, 'a', {
    value: 123,
    writable: true,
    configurable: true,
    enumerable: true,
  });
  console.log('Shadowing ...', 'hi:', hiObj, 'lo:', loObj);
  

• Object.prototype

  // Now we really think about dis: 'Copy' OR 'Link'?
  function soqq() {
    console.log('Hi there!');
  }
  
  var qq = new soqq();  // What's been done here? An 'instance' 'copied' from soqq OR a newly created obj pointing to soqq.prototype object?
  // Ref: https://github.com/getify/You-Dont-Know-JS/blob/master/this%20%26%20object%20prototypes/ch5.md#whats-in-a-name
  

  // So this is ganna scare de sh** out of u
  // Do u see the differnce btw 'this + delegation' & pure 'instance from class'?
  function TH000(type) {  // So, in fact, it's prototype-linked here
    this.type = type;
  }
  
  TH000.prototype.getName = function whatsMyName() {
    return this.name;
  };
  
  TH000.prototype.name = 'soqqr';
  
  var a = new TH000('wtf');
  console.log('Surprise! It is:', a.getName(), ';or call me', a.name);  // 'wtf'! Where r u?
  

  // Lets go check the top delegation end pt
  function TH000(type) {
    this.type = type;
  }
  
  TH000.prototype = {};
    
  var a = new TH000('soqqr');
  console.log('Constructor TH000?', a.constructor === TH000, 'Constructor Object?', a.constructor === Object);
  

• Reflection

  // Does some obj (and thus, applied to function) ever appear on the [[Prototype]] chain of another obj?
  obj.isPrototypeOf(anotherObj);
  

• Delegation

  // What if I'd like to use the PAUWA of [[Prototype]] chain but still wann maintain code readibility?
  var soqqr = {
    specificQQRFunc: function specificQQRFunc() {
      console.log('Actually this is delegated from soqqr');
    },
  };
  
  var someObj = Object.create(soqqr);  // VS what if we stopped here?
  someObj.seeminglyOwnFunc = function() {  // Do you see why it's wrapped in this way?
    this.specificQQRFunc();
  };
  
  console.log(someObj);
  someObj.seeminglyOwnFunc();
  

• [[PUT]]

  // Make your properties 'invisible' by defining 'em only in 'get'
  var obj = {
    get q() {
      return 2;
    }
  };
  
  Object.defineProperty(obj, 'qq', {
    get: function () {
      return this.q * this.q;
    },
    enumerable: true,
  });
  
  console.log(obj);  // Oh man nothing ...
  console.log(Object.keys(obj));  // Ambush!!!
  console.log(obj.q, obj.qq);
  

• Existence !
• in
• for … in VS Object.keys VS Object.getOwnPropertyNames

  // Reveal all OR enumerable ones
  var obj = {
    q: 1,
  };
  Object.defineProperty(obj, 'qq', {
    value: 2,
    enumerable: false,
  });
  
  for (var prop in obj) {
    console.log('Hi, in "for ... in"', prop);
  }
  console.log('Hi, in "Object.keys"', Object.keys(obj));
  console.log('Lyra the Sunshard: Iiiiilluminate!!!! ', Object.getOwnPropertyNames(obj));
  

• for … in VS for … of
• Iterator

  // Lets get the iterator of an array through a very implicit way 
  var arr = [9,8,7,null,undefined];
  var itIsIterator = arr[Symbol.iterator]();
  var next = itIsIterator.next();
  while(!next.done) {
    console.log('Current Val', next.value);
    next = itIsIterator.next();
  }
  
  Object.defineProperty(arr, '0', {
    enumerable: false,
  });
  var itIsAnotherIterator = arr[Symbol.iterator]();
  next = itIsAnotherIterator.next();
  while(!next.done) {  // The result shows that this might be how Object.getOwnPropertyNames iterates over property names
    console.log('Current Val', next.value);
    next = itIsAnotherIterator.next();
  }
  

  // Lets get the 'value' iterator of an object through ... What??
  var obj = {};
  obj[Symbol.iterator]();  // <-- TypeError
  

  // K whatever, we define our own iterator
  var obj = {
    q: 1,
    qq: 4,
  };
  Object.defineProperty(obj, Symbol.iterator, {  // Oh this Symbol is so mysterious
    enumerable: false,  // We dont wanna show it in normal cases
    writable: false,  // Avoid unintetional overwrite
    configurable: true,  // But we can delete it ... ummm
    value: function qqIteratorer() {  // I see closure in the air! Can you also see the 'implicit this' passing in the air?
      var obj = this;
      var indx = -1;
      var keys = Object.getOwnPropertyNames(obj);
      return {
        next: function qqIterator() {
          indx += 1;
          return {
            value: obj[keys[indx]],
            done: keys.length === indx,
          };
        },
      };
    },
  });
  
  // Test it here
  for (var v of obj) {
    console.log('Im', v);
  }
  console.log('Im done');
  

• Functional Programming
• Procedural VS Class-oriented
• JSON safe
• prototype
• Construction Calls of Functions VS Constructor Functions (Which one truly exists in JavaScript? Herher …)

  Takeaways – say when you’re really confused with this in some code block:

• Check if this is inside an arrow-function – cauz it may not follow the following rules …
• Yes – just check the enclosing scope of the arrow-function, and refer this in that scope (can you tell that in this sense, its the same for self = this in the enclosing scope from pre-ES6 env?)
• Check whether ‘use strict’ is on or not where this is involved (NOT call-site)
• Yes – this binding following the enclosing scope
• Yes – default binding has undefined value; refer to this for details
• Is the call-site from new binding?
• Yes – it’s a clean object, so enjoy it
• (If not) Is the call-site from explicit binding (e.g. .bind or .apply or in the API’s some arg)?
• Yes – check that bound obj
• Is the call-site from implicit binding?
• Yes – check that encompassing obj
• Fallback to default binding

  Takeaways – say when you’re adding new features to the current project:

• If 3rd party lib is included and it does care about this in its function’s usage – try to pase safe this, which is totally empty object created by Object.create(null), into the function; the safer-this-method should insulate the global object from any pollution from this
• May need to consider, recursively usage on targeting object, .freez, .preventExtensions or other functions to limit the targeting object’s (and recursively, remember) properties exposure to other developers/functions etc.
• But, always remember the effect enforced on the objects actually restrict any thereby operations on ‘em – could be either a problem or a silver lining for other developers.

  Takeaways – other rules you’d be aware of:

• Always remember that this is NOT the calling function itself NOR the calling function’s lexical scope
• Some weird bugs may arise from the conflicts of strictness of imported module and current project
• Be aware of the obj passed to explicit binding – will fallback to default binding once the obj is replaced by null or undefined

Vim:

JavaScript’s autocomplete seems kinda weird … Make it ES6 compatible?

Google API:

Just list some Gamil shortcuts I(‘d) use frequently to make my life easier.

• Hellllllp toggling <=> shift ?
• Select all unread conversations <=> * (shift) u (Seems like in mac’s setting, ‘shift’ is needed)
• Next inbox section <=> `
• Next message (in a conversation) <=> n
• Previous message (in a conversation) <=> p
• (Umm not controlled by Gmail’s API)Scroll down <=> space
• (Umm not controlled by Gmail’s API)Scroll up <=> shift space
• Go toolbar <=> ,
• Show older conversations <=> , tabFiveTimes enter (Well, currently, exactly 5 times)
• Go get collections of specially labeled conversations <=> / and then type label:YourAwesomeLabel (most-frequently used case would be like: label:soqqr@qqmail.com to those imported ones)

  How to redirect mails to same gmail account?

• From another Google account – google it
• From, say my college’s mail box, check this

Entrepreneurship:

How to locate a job in SF

Murmur:

• As this, and I quote, ‘The engine stores values in implementation-dependent ways, and may very well not store them in some object container. What is stored in the container are these property names, which act as pointers (technically, references) to where the values are stored.’
• What about adding ‘special’ effect when typing ?? e.g. Stamping effect or Fire effect or ??? Sounds cool!

Songs:

• Reluctant hero