質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

1220閲覧

getterのメソッド呼び出しで引数に渡る値をgetterの中で返却する別の関数に渡したい

murabito

総合スコア108

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2018/04/13 12:50

編集2018/04/13 13:14

言葉で説明するのが難しいのですが、getterのメソッド呼び出しで引数に渡る値をgetterの中で返却する別の関数に渡したいです。

以下は実際のコードをだいぶ簡略したりしているのでだいぶ意味不明なコードになっていると思いますが、お付き合い頂けると嬉しいです。

こんなことをしたいけど引数に値をこれでは渡せない

var obj = {}; Object.defineProperty(obj, 'func', { get: function() { const fn = (xxx) => () => { console.log('hi') }; return fn.bind(obj); } }) console.log(obj.func(5)())

この場合、obj.func(5)としても、この5の値が最終的に返ってくる関数には渡せていません。

引数にはこうすると値が渡せることが分かった

var obj = {}; Object.defineProperty(obj, 'func', { get: function() { return function(...args) { console.log(args); //[5] } } }) console.log(obj.func(5))

getterでメソッド呼び出しする時に引数の値を渡したい場合は、呼び出し元に返す関数の引数に実引数の値が渡ってくるので、それを使えることは分かりました。

これをどうにか出来ないか?

var obj = {}; Object.defineProperty(obj, 'func', { get: function() { const fn = (xxx) => () => { console.log('hi') }; return function(...args) { console.log(args); // 呼び出し元に返したいのはこちらの方 //ここで呼び出し元から渡ってくるargsを`fn = (xxx) => () => {}`の(xxx)に渡すことは出来ないか? return fn.bind(obj); } } }) // 最終的に返ってきているのが関数なのでこうなってしまうし、5も返ってくる関数には渡っていない console.log(obj.func(5)()) // Function

1つ目と2つ目のコードをミックスしたのがこの3番目のコードになるのですが、最終的に返す関数にこれだと呼び出し元から引数に渡した値が渡りません。こういう場合、どうすれば呼び出し元から引数に渡した値を、最終的に返したい関数に渡せるのでしょうか?

実際のコードではObject.defineProperty内でのgetterではなく、ES6 Proxy内でのgetterであったり、generatorを使っているのですが、それらを用いないコードに置き換えても質問に影響しなそうだったので、以上のようなコードになっております。()がやたらと多い理由は単にgenerator式をラップしている関数を使っているためです。

よろしくお願いいたしますm(_ _)m

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Lhankor_Mhy

2018/04/13 13:24

『この場合、obj.func(5)としても、この5の値が最終的に返ってくる関数には渡せていません。』というのは、具体的にはどういう意味でしょうか。素直にコードを読むと5の値は引数なしの無名関数で取り出すことが可能だと思うのですが。
murabito

2018/04/13 13:27

うわっ!すごい。なんで渡ってきてるんでしょうか。本当に渡ってきてました。
murabito

2018/04/13 13:28 編集

const fn = (xxx) => () => { console.log('hi', xxx) }; 1つ目のコードをこう書き換えて試したら、5が出力されました。
murabito

2018/04/13 13:31 編集

解決してしまったのですが、今ならまだ質問変更大丈夫でしょうか?僕はなぜ値が上のコードで取れるのか分かってません。その質問に変えてよいでしょうか?それか回答欄に上で頂いたコメントを投稿していただければ、それをベストアンサーにしてこちらは閉じます。。。
murabito

2018/04/13 13:32

あ、読み直したらおっしゃってることを理解しました。
Lhankor_Mhy

2018/04/13 13:34

五解決されて何よりです。スコープの問題だ、というのはご理解いただけているようなので、自己解決の登録をお願いします。
guest

回答2

0

なぜ

javascript

1var obj = {} 2 3Object.defineProperty(obj, 'func', { 4 get: () => (arg) => { 5 console.log(arg) 6 return arg * 2 7 } 8}) 9 10console.log(obj.func(5)) 11 12===> 135 1410

のような感じではいけないのか今一つわかりませんでした。

getterを定義する際、getterにアクセスされてもそこへ引数は渡されないので、getterが返した結果の関数(F)へ引数を渡すしかなく、返す関数(F)の引数を普通に定義すればよく、事前にその引数をbindしようとすることに意味がないような気がします。

もしカリー化が目的ならgetterで返される引数なし関数(F)に引数xを渡した結果が最終的な関数(G)になるわけなので、

javascript

1console.log(obj.func(5)()) 2 ^Fの引数 3 ^x 4 ^Gの引数

のように実引数リストが2つ並ぶのはしかたないと思うのですが・・・

Javascriptに明るいとは言えないので外してたり間違いあったらご容赦を。

投稿2018/04/13 13:38

編集2018/04/13 13:39
KSwordOfHaste

総合スコア18392

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

KSwordOfHaste

2018/04/13 13:40

あ・・・質問コメントよみそこなってました。失礼しました。
murabito

2018/04/13 13:47

> getterを定義する際、getterにアクセスされてもそこへ引数は渡されないので、getterが返した結果の関数(F)へ引数を渡すしかなく なるほど。そういう流れだったのですね。そこをそもそも理解出来ていませんでした。ありがとうございます。
guest

0

自己解決

『この場合、obj.func(5)としても、この5の値が最終的に返ってくる関数には渡せていません。』というのは、具体的にはどういう意味でしょうか。素直にコードを読むと5の値は引数なしの無名関数で取り出すことが可能だと思うのですが。

「質問への追記・修正の依頼」の方でLhankor_Mhyさんに頂いた上記コメントにより解決致しましたので、こちらの質問を閉じさせて頂きます。

var obj = {}; Object.defineProperty(obj, 'func', { get: function() { //const fn = (xxx) => () => { console.log('hi') }; const fn = (xxx) => () => { console.log('hi', xxx) }; return fn.bind(obj); } }) console.log(obj.func(5)())

1つ目のコードを上のように書き換え、xxxの値を確認したところ、ご指摘の通り、値は取れておりました。

投稿2018/04/13 13:38

編集2018/04/13 13:48
murabito

総合スコア108

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問