+ JavaScript の質問用スレッド vol.131 +
■ このスレッドは過去ログ倉庫に格納されています
JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください
■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4)
【条件】期待する回答の条件を書いてください。(ex: jQuery不可, フレームワーク不可)
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用)
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
1レスに収まらないならコード投稿サイトを利用してください。
http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/
■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける＝荒らしです jQueryありなの？ならこうするわ。
var s = '<tag>hoge</tag><tag>poge</tag><tag>fuge</tag>';
var r = $(s).get().map(item => item.innerHTML);
console.log(r); // ["hoge", "poge", "fuge"]
rのとこは
var r = $(s).map(function() {return this.innerHTML}).get();
でもいいけど。
上のmapはjavascriptネイティブのmapでこっちはjQueryのmapね念のため。 var r = $(s).get().map(item => item.innerHTML);
var r = $(s).map(function() {return this.innerHTML}).get();
var r = $.map($(s), item => item.innerHTML);
jQuery.mapを使ったほうが僅かに短いよ ほんまや！
速度はどんなもんかperformance.now()で測ってみたけど長さ10のランダム文字列をtagでくくったものを1000個連結したもので確認した限り3つとも5ms前後で目立った差なかったわ。
もっと大きくなると差もあるかも知れないけど実用上はどれも問題ないね。 その人の最適な方法とかいう魔法みたいなものはない
人間の脳はニューラルネットと同じなんだから
Web技術の情報、特に本の内容は糞な場合が多いという事実がある以上
沢山の検索と試行錯誤をして知識を積み重ねていって形にする以外はない
ブロックを積み上げるように体系的に学ぶのは無理
薄い絵の具を塗り重ねて絵を浮かび上がらせる感じしか無い >>421
お前Changelogに○○を最適化しましてって
書いてあったら、それは最適な方法じゃないって
いちいちツッコむのか？ その最適化は恐らくoptimizationの訳語としての用法だから最善の方法を見つけ出しそして実装した！という意味ではないだろう。
virtual→仮想と並ぶ近代クソ訳語のひとつ。 他者を認められない受け入れられないというのも
自分の、個人の考え方やり方なんだよね >>424
初心者と今活躍してる業界人とじゃけして平等ではないからな
色んな人に教えて自身でも色々失敗してきた経験を元に
無駄をしないようアドバイスしてるのであってそういうのは素直に聞くべき onclick="javascript:ac_tracer(
って何でしょうか？ボタン画像を挟む<a>タグ内にあります。 イベントハンドラの設定方法のひとつです。
今回の場合onclickなのでクリックイベントのハンドラ。
クリックするとそこに書かれたJavaScriptコードが実行されます。 ありがとうございます。
このac_tracerというのは何でしょう？ >>429
ブラウザの検証機能でコードを見るのが早い >>429
昔昔あるところに太郎という人が居ました
この太郎というのは何でしょう? >>429
銭湯に行ったらオッサンが湯につかっていました。このオッサンは何でしょう？ あるところにおじいさんとおばあさんがいました。
さて私は誰でしょう？ >>429
関数です。
ただし、ac_tracerという名前の関数はJavascriptに元々用意されているものでも、web開発者が利用するDOM APIのものでもないため、ユーザー定義関数、つまり誰かが何かの目的のために作った関数です。
つまり、作った人に聞くか、ac_tracerの定義部分を含むコードを読まなければ、この関数が何なのかエスパーを除き誰にも分かりません。 >>433
> この太郎というのは何でしょう?
人の名前では？ >>440
そうだねイベントハンドラの設定方法のひとつだね >>435
> あるところにおじいさんとおばあさんがいました。
> さて私は誰でしょう？
そんなことよりよ、桃太郎の
おじいさんとおばあさん、子供がいないらしいぜ？
ってことは、おじいさんとおばあさんじゃないよな？
子供ができたら、やっとおとうさんとおかあさんになるはずだ
孫も子供もいないのにおじいさんとおばあさんというのはおかしすぎる
っていうか、子供いないのに孫を養子に取ることってできるのかよ？
孫悟空の孫じゃないぞ。子供の子供という意味の孫だ 歳的な意味での爺婆だし
子供と言っても当然手続きもして無かろうし家系図にも組み込まれてないだろうし
桃太郎から見たらお父さんお母さんでも
全く関係ない第三者が伝聞として話したり聞く際にはふさわしくないと思う >>442
でもお前甥も姪もいないのにおじさんじゃん。 >>442
【お祖父さん】 祖父(そふ)の敬称。
【お爺さん】 男の老人の敬称、また親しんで言う語。 localStorageやsessionStorageなどwebStorageには文字列値しか保存できないとMDNで読んだ
でも[ 3, 6, 1, 23 ]や[ 'apple', 'orange', 'kiwi' ]など単純な配列は
特に変換することなしに、そのままsetItem()/getItem()できているようにみえる
値を取り出してすぐ直接push()やslice()などで操作できるしindexOf()もできてる
これはどういう理屈でこういう挙動になるんでしょうか？ブラウザが勝手にやってくれてる？配列関数が優秀？
試したのはMacのSafariとWindowsのFirefoxでsessionStorage利用 http://sdsoffice.com/tools/homepage-patrol-v2b.html
上記サイトのwebサイトを巡回してくれるJavaScriptを利用をしようと思います。
windows8.1(64bit) + IE11の環境で、上記サイト上で実行させるには問題ないのですが、
htmlファイルとしてローカルに保存して、ローカルで実行するとエラーとなります。
(巡回してくれない)
windows7(64bit) + IE11の環境でしたら、ローカルでも問題なく動きます。
windows8.1でエラーになる原因がわかりません。
お詳しい方、力になっていただけないでしょうか?
よろしくお願いいたします。 別フレームに指定の複数のページをランダム時間（何分から何分の間ランダム）で表示する。
の参考資料とかありませんか？
十数年前「html」だったのか「javascript」か覚えていないけど
色んな例を組み合わせて作って偶然動いたことがあったのでどこかに保存しておいたんだけどなくなってしまったので・・・
よかったら教えてください。 >>448
そもそも普通は、crossOrigin (CORS)アクセス禁止だろ
自分のPC 上の、HTML ファイルから、他のドメインにアクセスできないだろ。
iframe 内に、他のドメインのページを読み込んでも、
iframeの内外で、異なるサイトになるから、アクセスできない
自分のPC で、サーバーを立てて、それを経由しないとアクセスできない。
または、ネット上のそういうサーバーを利用するとか
以前使えていた、Yahoo Query Language (YQL) も、使えなくなった aからbまでの間でランダムは
a+(0からb-a)までランダムと表せられる
つまりa+Math.random()*(b-a)となる >>449
「iframe ランダム表示」で検索！
iframe 内に、他のドメインのページを、ランダムに読み込む あるある質問かもしれませんが
Javascriptのソースコードからコメントをすべて除去するツールなり方法ってどんなものがあるでしょうか？
単独のフリーソフトでも良いですし
atomのbeautify等、構文解析するプラグイン等にオマケでついていてもおかしくないと思うのですが
windows7を使っています <iframe src="#" id="ifrm"></iframe>
<script type="text/javascript">
window.onload = function(){
var urls = ['http://www.example.com', 'http://www.yahoo.co.jp', 'http://www.google.co.jp'];
// 0以上、3未満。つまり、0〜2
var idx = Math.floor( Math.random() * urls.length );
var ifrm = document.getElementById('ifrm');
ifrm.src = urls[idx];
}
</script>
これを、<body>タグの中に書いて実行すれば、毎回違うサイトが読み込まれる >>449
「jquery plugin カルーセル」で検索！
jQuery Plugin を探す方が、簡単かも >>453
「javascript コメント 削除 ツール」で検索！ >>456
ありがとうお陰でbeautifierの反対語にminifierという言葉があることを知ってatom minifierを入れて解決しました >>449
454 を修正した。
ランダム時間は難しくてできない。一定時間ならできる
以下を、<body>タグの中に書いて実行すれば、5秒毎に、違うサイトが読み込まれる。
タイマーを止めるには、clearInterval を使う
<iframe src="#" id="ifrm"></iframe>
<script type="text/javascript">
window.onload = function(){
var urls = ['http://www.example.com', 'http://www.yahoo.co.jp', 'http://www.google.co.jp'];
var ifrm = document.getElementById('ifrm');
var timerID = setInterval(function () {
// 0以上、3未満。つまり、0〜2
var idx = Math.floor( Math.random() * urls.length );
ifrm.src = urls[idx];
}, 5000); // 5分なら、5 * 60 * 1000 とする
}
</script> 458 を修正した
setTimeout() で、最初から表示する。
その後、setInterval() で、一定時間ごとに表示する
<iframe src="#" id="ifrm"></iframe>
<script type="text/javascript">
window.onload = function(){
var urls = ['http://www.example.com', 'http://www.yahoo.co.jp', 'http://www.google.co.jp'];
var ifrm = document.getElementById('ifrm');
function setExternalWebsite() {
// 0以上、3未満。つまり、0〜2
var idx = Math.floor( Math.random() * urls.length );
ifrm.src = urls[idx];
}
setTimeout(setExternalWebsite, 0); // 最初から表示する
// 5分なら、5 * 60 * 1000 とする
var timerID = setInterval(setExternalWebsite, 5000);
}
</script> >>459
setInterval使わずにsetExternalWebsiteの最後で毎回setTimeoutすればいいだけやで 問題にはならんと思うんだけどどんどん再起が深くなっていくのが気持ち悪い >>461
それってスタックオーバーフローしないの？ >>464
積まれないんすね、ありがとうございます
関数ポインタみたいなのがどんどん積まれていくのかと思った >>452 >>445 >>454 (459)
丁寧に教えてもらってありがとうございます。すごく参考になりました。
ランダム時間なのですがsetIntervalを使っていたの思い出しました。
{
var min = 5000 ;
var max = 10000 ;
setInterval("hyoji()",(max + 1 - min))+ min;
}
としました。
やってないと忘れるものですみませんでした。 webpackやgulpについて質問したいのですが、その類のスレッドってありますかね？？。
なければここで質問してもよろしいでしょうか？ function(t, i) {
t.target = i, e.apply(this, arguments)
}
こういう構文があったんですが
「 t.target = i;
e.apply(this, arguments);
」
つまりこういう構文を略して書く書き方って認識であってますか？ >>461-465
1. function f() { setTimeout(f, 5000); }
2. setTimeout(f, 5000);
まず、2の実行では、setTimeout()は実行されるけど、f()はまだ実行されない。
つまり、キューに、fが積まれるだけ
次に5秒後、キューからfが削除されて、1が実行される。
その時に、setTimeout()で、またキューに、fが積まれる
つまり、キューには常に、fが1個しか積まれていない
>>468
わかりにくいから、そんなカンマの使い方をしない方が良い。
勘違い・バグを誘発する
普通に、; で文を区切るべき >>467
いいよ。他に該当のスレなんて有るわけないし >>450
ありがとうございました。
ローカルファイルで他サイトの呼び出しの規制に引っかかっているわけですね。
今回の案件だけ個別に許可はできないものでしょうか?(ブラウザのセキュリティ上難しい?) >>472
ブラウザじゃなくてサーバー側のセキュリティな 制限をかけてるのがブラウザで
サーバはブラウザがかけてる制限を任意に解除できるだけじゃないのか
違いは無設定の鯖に対してどういう挙動になるか
というか>>448はCORS関係なんか？
みたところ子ウィンドウを開いて、子のlocation.hrefで移動させてるだけ
IE自身のセキュリティ設定、イントラネットのセキュリティポリシーな気がするんだが グローバル変数を1つ宣言するのと
関数を1つ宣言するのとでは
グローバルの汚染度は変わらないですよね？ >>475
変数というのは「変えられる値」関数というのは、変えられない。
（まあ正確に言えば、JavaScriptでは関数もオブジェクトなので変えようと思えば変えられるが、
普通そういう使い方はしないしそういう使い方はグローバル変数と同様になってしまうから
ダメなやり方であるという考え方をする）
グローバル汚染というのは、値がどこから書き換えられるかわからないから問題なので、
グローバル変数はアウトだが、グローバル関数（グローバルクラス含む）は問題ない >>476-477
無名関数を使うとかなら、変わると言われても納得なんですけど
function ffff(){}と定義するのとvar ffff = function(){}と定義するのでは変わらないし
どちらの場合も変数名ffffに対する文字列値の再代入も関数再定義も特別の構文なしにできてしまうし
同じ名前の関数宣言があってもエラーも何も出ないのを考えると
宣言時には入れ物はどちらも変数であって（というかポインタと考えたほうが）
中身が、関数か、文字列や数値や配列やオブジェクトか、の違いでしかない、という風に思うんです
そうなると、1個グローバル変数を使うのと1個グローバル関数を使うのとでは、もはや変わりが無いように思うんですが ニュアンス的には幾らかの違いがあるけど、汚染度と言う視点だと無いよ
つか、関数もオブジェクトだから変えられるという言い用はJSer失格 だからnamespace的に1つのオブジェクトに全部押し込めて汚染度下げたりしてたわけですし >>471
ではこちらで質問させていただきます。
gulpであればgulp-uglifyを、webpackであればUglifyJsPluginを使って
minify化しようと思うのですが、どちらもjsに記述している変数名がiやfに変わってしまいます。
どちらのnpmもオプションに変数名が変わらない様な設定があるかと思ったのですが無いようでした。
変数名が変わるのは困るので、ただ単に改行、コメント削除、空白削除をしたいのですが、何か方法はありますでしょうか。 >>483
HTMLに直接変数名が書いてあり、その変数を外部jsファイルで使用する時に使えなくなると思ったのですが。
ということは、そもそもjsの書き方がおかしいということでしょうか？
例を出せと言われてもすぐには出せませんが・・・・ > HTMLに直接変数名が書いてあり
そんなことはしない。HTMLにJavaScriptの変数は出てこない uglify=難読化、minify=軽量化、全然別だ
uglifyやってんなら、そりゃそうなる ところでnpmに gulp-minify （-cssや-htmlがつかない）があって
minify()で普通に無駄な空白類やコメントの削除してくれるらしいが >>482
uglify-js@3だが、mangleオプションにreservedをつければいいんじゃない? あ、すべての変数名を変えたくないのか
magleオプションをなくすような設定ができるのかね gulp-uglifyは詳しくないけど、
サードパーティー製のライブラリで使用しているグローバル変数（いわゆるネームスペース）を
スクリプト内で参照している場合に、その変数名をminifyしない設定があるのでは？ >>485
多分私の説明が下手でうまく伝わっていない気がするのでちょっと考え直して
再度ご質問します。ありがとうございました。
>>486
その違いが知りませんでした。
勉強になります。ありがとうございます。
>>487
gulp-minifyですか。ちょっと試してみます。
>>489
uglify-jsも知りませんでした。
これも検証してみます。
>>490
ごめんなさい。話に追いついていけません。。。 >>491
だからHTMLに直接変数名を書くことが
間違いだって話だよ
他のやつもやる必要のないことを書くな >>494
その理屈だと、腐った環境やクソなコーディング規約に
したがって開発しろって言ってるように見えるが？ だからHTMLに直接変数名を書くことが
腐った環境やクソなコーディング規約だって話だ ページごと、ユーザーごとのパラメータをHTMLに書くことはあるぞ
どうせlocalStorageかHTMLに書くかAjaxで取得するかくらいしかないし 今話をしてるのはJavaScriptの変数の話だ
分かってないなら黙ってろ HTML内で
var userData = {}
外部JSファイル内で
(function(){
something(userData.何か);
})();
こういうことだろ >>497
常に何から何までXHRで済ませられるわけじゃないしな >>499
細かいことだがそれ(function(){ })(); で囲う意味ある？ window.now = performance.now;
now();
こう書くと"オブジェクトの呼び出しが無効です"と怒られるんすよ
なんででしょうね thisの問題ですね。
now()で呼び出したときもthisがperformanceを指すように以下のようにbindしときましょう。
window.now = performance.now.bind(performance); とりあえずthisを拘束すればいいという考えはあまり良いとは思えないな
エイリアスという点では今は
fn = ( ...args ) => performance.now( ...args )
と書く方が良い
bind構文が実装されて記述が容易になるとともに
bindを常日頃から使う文化が広がったらbind構文の方が基本になると思う より「ハック」っぽくないのはどちらかっていう意味ね ハックっぽいかなぁ？
>>503はbindした新しい関数返してるだけで別になんにもハックしてなくない？
bindなんてES5から入ってるし実装されてるかどうか気にするレベルにないのでは… Google Maps (Javascript) API に関することはここでいい？
他に適当な質問スレがあれば教えてください。 >>474
Windows8.1はダメなので、IE自体の問題のような感じです。
開発者ツールでみると
else { //* not MSIE browser
wid1.location.href=wz1;
}
で止まっているのですが、Windows7では不具合なく動いているので、どこがおかしいかわからないのです。 フォーム内のあるアイテムの入力文字数が
たとえば 5文字あるいは10文字あるいは空白の場合だけ入力できるようにするにはどうすればよい？ サロゲートペアと結合文字の問題があるからな
サロゲートペアで結合文字のものもある
例えばアクセント付付点８分音符「"𝅘𝅥𝅮𝅻𝅭"」は一文字でlengthは10だ >>492
ありがとうございました。
無事にこちらの方法で変数名を変えずに圧縮することができました。 >>508
ありがとう。しかしそっちはちと寂しかったです。 ■ このスレッドは過去ログ倉庫に格納されています
