Help us understand the problem. What is going on with this article?

ES2015で変数名を取得する

More than 3 years have 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

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

ConquestArrow
ノンプログラマです。
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした