this

[samuelgoto]

Introduction

The DOM construction mechanisms depend on being able to hang things into a tree-like structure. So, one needs to find the reference of the parent context to hang to. For example, to enable the following:

let html = div {
  span("hello world")
}

The span call needs to be connected somehow to the parent div call to build a tree.

Alternatives considered

Here are some of the ideas that were thrown before:

Implicit

In this formulation, the expansion would implicitly include the this binding. So, a { ... } would be equivalent to a.call(function { ... }).

let html = div {
  span("hello world") {}
}

this method resolution

In this formulation, the resolution of methods looks first for the presence in the this object for function calls before looking at the local scope and later at the global scope. e.g. a { b() } is equivalent to ```a(function() { (b in this ? this.b : b)() }).

For example:

let html = div {
  // "span" would first be looked at 'this' before looking at the global scope
  span {
  }
}

This may be isomorphic to the equivalency a { b() } to a(function() { with (this) { b() } })

bind operator

In this formulation, the expansion would be simply a { ... } to a(function() { ... }) and this would be passed via the bind operator

let html = div {
  ::div {
    ::span {
      ::p("hello world")
    }
  }
}

special character

In this formulation, we would pick a special syntax space to make the distinction between the this binding and regular function calls.

let html = <div> {
  <div> {
    <span> {
      <p>("hello world")
    }
  }
}

[samuelgoto]

This is being discussed in other places with more details, so closing this here and continuing out there.