JavaScript
riot
riot.js
@hashito

Riot.jsでの注意

JavaScriptriotriot.js

概要

自分的なメモついでに注意点をメモしておきます。

内容

class定義出来ない

課題

tag内でクラス定義しようとすると

<test>
    <h1>{text}</h1>
  <script>
    var self=this;
    class Hello{
      constructor(v){
        this.v = v
      }
      get(){
        return v;
      }
    }
    var h = new Hello("world")
    self.text=h.get();
  </script>
</test>

こんな感じで怒られます。

Uncaught SyntaxError: Unexpected token .
    at jn (riot+compiler.min.js:2)
    at o (riot+compiler.min.js:2)
>      this.constructor = function(v){

初期化関数のconstructorをriotの関数として処理している感

対策

定義を下記のように変更すると怒られません。

<test>
    <h1>{text}</h1>
  <script>
    var self=this;
    var Hello=(v)=>{

      var _v = v
      return {
        get:()=>{
          return _v;
        }
      }
    }
    var h = Hello("world")
    self.text=h.get();
  </script>
</test>

思ったように初期化されない(多分、javaScriptの仕様)

課題

下記のように変数定義すると、エラーも出ずに結果がこうなる。

var t=[[[1,2][3,4]],[[5,6][7,8]]];
console.log(t);
// --下記表示結果--
// (2) [Array(1), Array(1)]
//  >0:[undefined]
//  >1:[undefined]
//  >length:2
//  >__proto__:Array(0)

個人的にはエラーが出てほしい…

対策

ご存知の通り、下記のように,を追加すれば望んだように…
そもそもエラーが出てほしいのだけど…

var t=[[[1,2],[3,4]],[[5,6],[7,8]]];

実はエラーではないというお話

@karak　様からコメントが有ったので追記させていただきます。
実は、javascriptの,の仕様によりエラー文ではなかったようです。

// この定義は
var t1=[[[1,2][3,4]],[[5,6][7,8]]];
// (2) [Array(1), Array(1)]
//  >0:[undefined]
//  >1:[undefined]
//  >length:2

// これと同じ
var a = [1, 2];
var b = [5, 6];
var t2 = [a[4], b[8]];
// (2) [Array(1), Array(1)]
//  >0:[undefined]
//  >1:[undefined]
//  >length:2

つまり,で区切られた手前側が参照するindexの値として処理されてしまっていたようです…
ということで、下記のような内容だとundefinedではなくなる。

var t=[[[1,2][3,0]],[[5,6][7,1]]];
// (2) [1,6]

非常に勉強になりました…
コメントありがとうございました！

Edit request
2