JavaScript
ECMAScript

ES2015で変数名を取得する

More than 1 year has passed since last update.

1: Function#nameを使う方法

ES2015では、関数式で宣言した関数が無名関数の場合、代入された変数と同じ名前になる。なので無名関数を変数に代入して、Function#nameで取得すれば変数名の文字列が取得できる。

無名関数を突っ込んでFunction#nameで取得
var v1 = () => {}
console.log(v1.name);   //v1

宣言時の変数名のみが関数名となり、別の変数に再代入しても関数名は変わらない。

var tmp = v1;
console.log(tmp.name);  //v1

この特徴を使うとある程度汎用的な変数名取得の仕組みが作れる。

変数名を取得するUtil.getValName()
class Util{
    static getValName(val){
      if(typeof val !== "function")throw TypeError();
        return val.name;
    }
}

//どこかで宣言された変数
var v2 = "hoge";

//...

//変数名を取得したい時
var v2_val = v2;    //元の変数の値を一旦取っておく
var v2 = () => {}   //無名関数を突っ込む;Babelだとvarで再宣言が必要
//この辺を関数でまとめると、変数->引数になった時点で変数名が変わるのでまとめられない

var s = Util.getValName(v2)
console.log(`${s}:${v2_val}`) //v2:hoge

ただし、この方法は現時点(2016-01-11)ではBabelなどごく一部の環境のみ。ES2015のFunction#nameは今一実装が進んでいない。

2: Class.nameを使う方法

クラス式を使ってClass.nameで取得
var v2 = class {}
console.log(v2.name);   //v2
  1. の応用。

現時点ではEdge13のみ対応

3: for(let s in {var})を使う方法

var v3;
for(let s in {v3}){console.log(s)}  //v3

オブジェクトのキー・バリューとして登録して取り出す方法。昔ながらのやり方だが、ES2015では省略記法が使える。

4: Object.keys({var})[0] を使う方法(追記)

var v4;
console.log(Object.keys({v4})[0]));    //v4

こちらの方が直接変数を取り出せるので便利。これも省略記法の活用。