0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【javascript】ロックとキーをシミュレートする

Last updated at Posted at 2020-07-03

こちらの記事は以下の書籍を参考に執筆しました

以下のコードはロックとキーのシステムを構築している。

function lock(secret){
  const key = Symbol('key')
  return {
    key,unlock(keyUserd){
      if(keyUserd==key){
        return secret;
      }else {
        return '*'.repeat(secret.length || secret.toString().length)
      }
    }
  }
}

const {key,unlock}=lock(42)

console.log(unlock())//**
console.log(unlock(Symbol('key')))//**
console.log(unlock('key'))//**
console.log(unlock(key))//42

出典:入門JavaScriptプログラミング

正しいキーならsecretを取得でき、正しくないならキーをマスクしている。

#コードの解説
このコードを読む上でわからないことがいくつかあった。

  1. return{key,unlock(...)}とはどういうことか
  2. unlock()で実行できるのはなぜか

#return {key,unlock(...)}とはどういうことか
return {}はオブジェクトを返しているということ。そしてオブジェクトには簡易表記という書き方ができる。

const obj = {
  name: name,
  method: function() {}
}

//簡易表記
const obj = {
  name,
  method() {}
}

出典:入門JavaScriptプログラミング

プロパティ名(name)と変数名が同じ場合、一度指定すればいいだけになる。
{name:name}と書いていたのが{name}で済む。
またメソッドに関しては無名関数に限り{method:function(){}}{method()}と書ける。

つまりlock関数を書き換えるとこういうこと

function lock(secret){
  const key = Symbol('key')
  return {
    key:key,
    unlock:function(keyUserd){
      if(keyUserd==key){
        return secret;
      }else {
        return '*'.repeat(secret.length || secret.toString().length)
      }
    }
  }
}

出典:入門JavaScriptプログラミング

そしてconst {key,unlock}=lock(42)で変数keyにSymbol('key')が代入され、変数unlockには無名関数が代入されている。

#unlock()で実行できるのはなぜか
これは勘違いであった。

その原因となったコードがこちら

const ffaa={
  at(n){
    if(n<=2)return 1;
    return this.at(n-1)+this.at(n-2);
  }
}

const {at}=ffaa;
const ff={at}
const aa={ff:at}

ffaa.at(7)//13
at(7)//エラー
ff.at(7)//13
aa.ff(7)//エラー

出典:入門JavaScriptプログラミング

これだけを見ると、無名関数を分割した際、単純に変数名()では実行でいなものと思ってしまった。
確かに関数を名前で参照出来ないこともあるが、それは関数内のメンバーを参照するときである。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?