+ JavaScript の質問用スレッド vol.135 +
■ このスレッドは過去ログ倉庫に格納されています
JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください
■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
1レスに収まらないならコード投稿サイトを利用してください。
http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/
■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける＝荒らしです >>744みたいな疑問が浮かぶ人はjQueryのソースを読んでみるべきだと思う
勉強になるぞ >>751
お前が、>>748のコードにクロージャーを取り入れて
書き直したら教えげあげようｗ こう？
function chinko(data) {
return function() {
return 'I love ' + data;
}
}
function manko(func) {
console.log(func());
}
let data = 'unko';
manko(chinko(data)); //=> "I love unko" もういいから教えてよ。
コードで示してくれりゃ分かるのにめんどくさい。
質問に回答するより煙に巻いて指示するのが好きなの？ 質問スレに何しに来てんだよ……
こう？
function chinko(data) {
return function() {
return 'I love ' + data;
}
}
function manko(func, data) {
if (!data) data = func.name;
console.log(func(data)());
}
let data = 'unko';
manko(chinko); //=> "I love chinko"
manko(chinko, data); //=> "I love unko" var clos = function closure( data ) {
return function( ) {
return 'I love ' + data;
}
}
function caller( func ) {
console.log( func() );
}
var data = 'cat';
caller( clos( data ) ); //=> "I love cat" >>759
>>753となにが違うの？「違う」って言われたんだけど>>754>>755 >>744より
> では、jQueryの場合、スコープが異なるfuncになぜデータを渡せるんですか？
>
> jQueryだと
> $(window).on('resize', data, func);
> のようにdataを与える事が出来ますよね。
↑ この場合、jQueryのfuncは以下のように定義しますよね？
function func(event, data) {
console.log('I love' + data);
}
でも、>>758を見ると、以下のような書き方でjQueryの場合と全然違います。
何故でしょうか？jQueryはどんなマジックを使っているのでしょうか？疑問です。
function chinko(data) {
return function() {
console.log('I love ' + data);
}
}
--------------------------
>>748
わかったか？ お前は何が疑問なのかよくわからないって言ったが、
これが疑問なんだよ。 >>756
ここは自ら学ぶスレだから
モロ回答はしない
そういうのは知恵袋なり他にたくさんある
ここは2chだからな >>744
.on() が内部でコールバック関数を渡す前にクロージャでラップしてるから
ちなみに、>>761はjQueryの動きになってない上、コールバック関数を渡す実装もしていない無視して良い
http://api.jquery.com/on/
最も、addEventListenerなら、handleEvent付きのオブジェクトを指定する方がスマートだと思うが function hoge(){ /*この中に重複作業をまとめたいときがある*/ }
例えば
function hoge(x,y){
function sum10(x) { return x+10; }
return [sum10(x),sum10(y)];
}
このsum10は汎用なのでhogeの外にsum10を書いても良いような気がしますが
仮に、hogeだけでしか使わないような関数でも
外に出しておいた方が良いのでしょうか？
今まで、単に見た目の問題なのかな？と思い、適当にやっていたのですが 訂正
＞hogeだけでしか
＞hogeの中だけでしか >>765
一回しか使うかどうかで、関数にするかどうかを決めるんじゃない。
また同じ処理だからって言うだけで、関数にするのでもない
長いコードがあったとき、読むのが大変になるから、
その中の一部に適切な名前をつけて関数にすることで、名前だけから
やってることがわかるから中を読まなくていい。
読まなくていいから長いコードを読むのが楽になった！
という目的のために、関数にするんだよ
1回しか使わなくても、長いコードを読むのが楽になるなら
関数にするべきだし、関数にしたからと言って、長いコードを読む時に
関数の中まで見ないとやってることがわからないなら、
それは関数にするやり方間違ってる
読むべきコードを減らすのが関数にする目的
だから独自で作るよりも既存のライブラリを使ったほうが良いという話にもつながる
独自で作ると少なくとも一回は中を読まないといけない。
既存のライブラリは、たいてい中を読まないで使ってるだろう？ 関数ってよりサブルーチンとかプロシージャっぽい説明だね。 >>768
関数とサブルーチン・プロシージャーの違いは？
どこが後者の話になってるのか？ 何か引数を受けて、何かしらの処理をし、何かを返すのがfunction（関数）
プログラムの中で一定の処理をひとまとまりにしてモジュール化したものを
メイン処理と対比して呼ぶのがsub routine（サブルーチン）
プログラムの中で、サブルーチンを作るために作られた
何も返さない関数がprocedure（プロシージャ）
であってるかな
横からですが んにゃ、合ってない
それらの用語は各言語仕様やコミュニティ毎に定義されている 本質的にはあってんじゃない？
いろんな方言的解釈があるのはその通りだが > 読むべきコードを減らすのが関数にする目的
？？？
['80', '9', '700', 40, 1, 5, 200]
.sort((a, b) => a - b); >>774
それもsortの処理を読まなくてすんでますね。
例え1回しか使わなくても、そうすべきなんですよ >>775
そうすべき？
じゃあそうではない、減らす前の関数を使ってないダメなコードとやらを見せてください。 >>776
じゃあsort関数の中身をここにコピペして sort関数ではなくsort関数の引数に渡す関数の話をしています。
>>770によると、
> 読むべきコードを減らすのが関数にする目的
なのでしたね。
どういうことか説明してください。 >>778
sort関数に渡す引数？
(a, b) => a - b のこと？
なにを突っかかってきてるのか知らんが、
const byAsc = (a, b) => a - b;
const byDesc = (a, b) => b - a;
みたいなの並び替えアルゴリズムとして関数化しておけば、
aからbを引いて・・・ってどういうこと？って
もう読まなくてすみますね。
['80', '9', '700', 40, 1, 5, 200].sort(byAsc);
計算部分を読まなくてすむから楽になった！ (a, b) => a - bは既に関数。それは関数に名前をつけているだけ。
関数化ｗｗｗ だから関数に名前つけるって言ってるじゃん
バカなのかな？ > その中の一部に適切な名前をつけて関数にすることで、名前だけから 訳：「読むべきコードを減らすのが関数にする目的」というのは嘘でしたすみません！「読むべきコードを減らすのが関数に名前をつける目的」でした！あと関数化とかいうオレオレ用語で混乱させてしまってすみません！
こうかな いや違うな。名前をつけて関数化したんだから
読むべきコードが減ってる。
重要なのは読むべきコードを減らすこと。 いやはや、また>>783はいつものキチガイなんだろうねｗ >>774から>>779にするのがとこが「名前をつけて関数化」なの？
元々関数。名前をつけているだけ。 それは関数じゃなくてアロー関数
重要なのは読まなくて良いコードを増やすことなんだが、
そっちへのレスがないってことは、逃げてんだね >>786
お前は他人に謝らせてSNSにアップして炎上する
コンビニ客のマネはやめたほうが良いよｗ
恥ずかしい >>787
>>774の通り元々
> 読むべきコードを減らすのが関数にする目的
についての話。
これについては降参逃亡ということですねｗ
> それは関数じゃなくてアロー関数
関係ありませんｗｗｗ
['80', '9', '700', 40, 1, 5, 200]
.sort(function (a, b) {return a - b;});
話はぐらかそうとしてドツボｗｗｗｗ >>779
byAscよりもアロー関数ベタ書きのほうが分かりやすい人多いと思うよ
もし.sort(降順)とかにすればわかりやすいけど、それでも降順関数の中身確認したくなると思うけどな .replace().replace().replace()....replace地獄になります
クールな書き方をおしえてください 単なる数値ではないソートの場合に名前がめっちゃ長くなりそう >>792
第二引数を関数にして中でゴニョゴニョするとか >>792
[
['私', '拙者'],
['シッコ', 'ウンコ'],
['マンコ', 'チンコ'],
['好き', '嫌い'],
].reduce((acc, [oldWord, newWord]) => acc.replace(oldWord, newWord), '私は、シッコとマンコが好きです。');
//=> "拙者は、ウンコとチンコが嫌いです。" それでもいいけどreplacer関数作って渡す方が筋がいいかもな。 >>791
まあ、そこは本質的なところではないんでどうでもいいんだわｗ
バカに付き合ってあげただけ
重要なのは、読むべきコードを減らすのが関数にする目的
だ〜れも、なんでもかんでも関数にしろとか言ってない
関数にする基準の話をしてるところに
重箱おじさんが連れたので、つついてあげただけｗ バカ「バカに付き合ってあげただけ」
重箱つつかれたのはお前ｗｗ 読むコード減らすべきおじさん「読むコード減らす」
まで読んだ 面白いように反応してくれるなｗ
で、いちばん重要な「読まなくて良いコードを増やすこと」には
ほら、反論できないでしょ？ｗ
そういうとこやで >>787
>>774の通り元々
> 読むべきコードを減らすのが関数にする目的
についての話。
これについては降参逃亡ということですねｗ
> それは関数じゃなくてアロー関数
関係ありませんｗｗｗ
['80', '9', '700', 40, 1, 5, 200]
.sort(function (a, b) {return a - b;});
話はぐらかそうとしてドツボｗｗｗｗ >>801
ハッハッハ、反論無しで降参逃亡ということだったかｗｗｗ
だから読まなくて良いコードを増やすことについては何も言わなかったんだな >>802
頭が悪いんだからしょうがないよｗ
読まなくて良いようにすることに重要性がわかってないんだから ワロタ
読まなくていいようなこと、そもそも書くなよｗ
んでそんなもの増やすなｗ
スクリプト言語なんだから こんなゲームにマジになっちゃってどーするの式逃亡か？ｗ >>794-795
ありがとうございます
同じ文字の複数置換がしたかったのでnew RegExpで795しました
あと他にreplaceの第二引数でreplacerも試みたのですが
やり方が悪かったのか今度はif地獄になってしまったので、
根本的に変えて
((str,
reg = new RegExp('[abcd/!/"]','g'),
sub = {
'a':'あ',
'b':'B',
'c':'C',
'd':'D',
'!':'?',
'"':'\''
}) => str.replace(reg,old=>sub[old])
)('abbcdd!"');
// あBBCDD?'
としましたが、見難かったのと
objectのプロパティ名に!とか"とか使わないほうがいい気がしたのでこちらは諦めました >>809
見にくいか？
'abbcdd!"'.replace(/[abcd/!/"]/g, old => ({
'a': 'あ',
'b': 'B',
'c': 'C',
'd': 'D',
'!': '?',
'"': '\'',
}[old]));
// あBBCDD?' >>811
訂正
'abbcdd!"'.replace(/[abcd!\"]/g, old => ({
'a': 'あ',
'b': 'B',
'c': 'C',
'd': 'D',
'!': '?',
'"': '\''
}[old]));
// あBBCDD?' >>812
ごめん再訂正
'abbcdd!"'.replace(/[abcd!"]/g, old => ({
'a': 'あ',
'b': 'B',
'c': 'C',
'd': 'D',
'!': '?',
'"': '\''
}[old]));
// あBBCDD?' 毎度思うけど、頭が硬いと思う
'abbcdd!"'.replace(/[abcd!"]/g, old => ({
'a': 'あ', 'b': 'B', 'c': 'C', 'd': 'D', '!': '?', '"': '\''
}[old]));
// あBBCDD?'
改行しろって言われたから、改行してます
理由？知りません。って言いそうだわｗ
この程度ならこれでいいけどな
const data = { 'a': 'あ', 'b': 'B', 'c': 'C', 'd': 'D', '!': '?', '"': '\'' };
'abbcdd!"'.replace(/[abcd!"]/g, from => data[from]); オブジェクトの部分は勝手にコード整形で改行展開されちゃうわ。
全部手動でコードのレイアウト（）やってんならそれでいいけどｗ >>815
なんて整形ツール？
今どきデフォルトで見にくく整形するツールがあるとはね
有名所のスタイルチェックツールのデフォルト or 推奨設定では
問題ない書き方なのに 整形ツールはPrettier
これはVSCodeのプラグイン経由で使ってるわ。デフォルトで使ってるはずだけどこれは展開されるな。
ESLintも使っててチームのスタイルガイドが当たるがこっちも展開されてる。
rule設定で
https://eslint.org/docs/rules/object-curly-newline
の"ObjectExpression"が"always"になってんじゃねえかな。
今確認できんが。 【環境】 Win7-Pro、主にGoogleChrome（たまにFirefox）
【期待する結果】 文字列型オブジェクトのキー値の参照
例えば obj = {x:100, y:200, 'font-size':16} とあったときに、x は obj.x で 100 と
参照できるのですが 'font-size' のようなキーはどうすれば参照できますか？
そのまま obj.'font-size' とすると
Uncaught SyntaxError: Unexpected string というエラーになります。 var obj = { x:100, 'font-size':16 };
console.log( obj.x, obj[ 'font-size' ] ); //=> 100 16 関数内の変数は関数が終了するとメモリ開放されるようですが
クロージャ内でも同様でしょうか？
hogeは他から参照はされていません
(function(){
var hoge = 'abcde';
}()); ES仕様にはWeak*系やSABを除いてCGやメモリの定義はない
基本的にJSはメモリを回収しなくても仕様違反とはならないし、
そのタイミングや挙動に関しては完全にブラウザ・実行系依存だから
このスレで聞くのは間違ってる > そのタイミングや挙動に関しては完全にブラウザ・実行系依存だから
> このスレで聞くのは間違ってる
はて？ このスレはES仕様限定でブラウザ・実行系の話は禁止でしたっけ？
ならDOM APIの話も禁止ですな。 ESにもW3C/WHATWGにも無いなら
ブラウザの名前くらい示してくれないと答えようが無い __proto__みたいに仕様のほうが追認することもある（あった）から…… MathJaxの質問です。
MathJaxのサードパーティーによる追加機能である XyJax を追加したいですが、追加方法が分かりません。
ヘッダには、
script type="text/x-mathjax-config">
MathJax.Hub.Config({
TeX: { extensions: ["AMSmath.js", "AMSsymbols.js", "http://sonoisa.github.io/xyjax_ext/xypic.js";] },
tex2jax: { inlineMath: [['$','$'], ["\\(","\\)"]] }
});
/script>
script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-AMS_CHTML";>
/script>
と書いたのですが、上手く行きません
どうしたらいいですか？ 注意
< script と書き込もうとすると5ｃｈから書き込めないといわれたので、
わざと左三角括弧< を削除しました >>831
だから、書いてある通りにやって出来ないから聞いてんだろ
一々低次元なところからスタートするな低脳
ってかお前みたいなレスしてる奴が正解を出せるわけがないんだからアホは黙っとけ >>832
いや
それを書いた人に言ったらなんて返ってきたのかと
まさか聞いてないなんて思わんし(・∀・) >>825
ではどこで聞けばいいでしょうか？
メジャーなブラウザ、一般的（曖昧ですが）な場合だけでいいです
と言いたいところですが解決しましたのでもういいです >>838
そうなんですか
幾つかのサイトからコピペですが、忠告ありがとう IIFEの例じゃないの？letの普及で役割を終えた。 >>824
メジャーなエンジン実装で言うと
関数が終了したら解法ではなく
定期的に全ての要素を見て回って
ルートから辿れなければ解法の方が近い
実際は別言語間との循環参照だったり
非常にややこしいが
基本的に同期的には開放しない 基本的に同期的には開放しないっていうのは
開放しないってことですか？ えっ？今？ｗ 今それ解放する？ｗｗｗ って時に解放する。 >>843
>>837で解決した質問を継続するなと
解決後にどや顔回答を期待して解決したふりかね？ ここは質問するのも自由だし回答するのも自由
他人に口出す必要はない >>844
つまり解放するんですよね？
なんで、非同期で解放すると言えなかったんでしょうか？ >>847
分かんない。俺>>842じゃないし。
質問が関数が終了するとメモリ開放されるかどうかを問うているからじゃないの。 >>847
ブラウザの任意のタイミングだからね
あんまりこういうタイミングで開放されるだろうとか期待するもんじゃないよ >>846
解決したなら、回答する必要がないからね
本当は解決してないのがバレバレ ■ このスレッドは過去ログ倉庫に格納されています
