私的良スレ書庫

不明な単語は2ch用語を / 要望・削除依頼は掲示板へ。不適切な画像報告もこちらへどうぞ。 / 管理情報はtwitterで
ログインするとレス評価できます。登録ユーザには一部の画像が表示されますので、問題のある画像や記述を含むレスに「禁」ボタンを押してください。

元スレ+ JavaScript の質問用スレッド vol.131 +

JavaScript スレッド一覧へ / JavaScript とは? / 携帯版 / dat(gz)で取得 / トップメニュー

みんなの評価 :
レスフィルター : (試験中)

前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ

/ 要望・削除依頼は掲示板へ / 管理情報はtwitterで

501 : Name_Not - 2018/02/05(月) 01:52:32.96 ID:???.net (+57,+29,-7)

今話をしてるのはJavaScriptの変数の話だ
分かってないなら黙ってろ

502 : Name_Not - 2018/02/05(月) 01:56:06.57 ID:???.net (+2,-30,-18)

HTML内で
var userData = {}

外部JSファイル内で

(function(){
something(userData.何か);
})();

こういうことだろ

503 : Name_Not - 2018/02/05(月) 02:11:37.12 ID:???.net (+62,+29,-27)

>>500
常に何から何までXHRで済ませられるわけじゃないしな

504 : Name_Not - 2018/02/05(月) 03:20:21.65 ID:???.net (-1,-29,-9)

>>502
細かいことだがそれ(function(){ })(); で囲う意味ある？

505 : Name_Not - 2018/02/05(月) 03:40:25.36 ID:???.net (-2,-30,-25)

window.now = performance.now;
now();

こう書くと"オブジェクトの呼び出しが無効です"と怒られるんすよ
なんででしょうね

506 : Name_Not - 2018/02/05(月) 04:26:38.57 ID:???.net (+36,-30,-22)

thisの問題ですね。
now()で呼び出したときもthisがperformanceを指すように以下のようにbindしときましょう。
window.now = performance.now.bind(performance);

507 : Name_Not - 2018/02/05(月) 05:42:06.72 ID:???.net (+13,-30,-61)

とりあえずthisを拘束すればいいという考えはあまり良いとは思えないな
エイリアスという点では今は
fn = ( ...args ) => performance.now( ...args )
と書く方が良い
bind構文が実装されて記述が容易になるとともに
bindを常日頃から使う文化が広がったらbind構文の方が基本になると思う

508 : Name_Not - 2018/02/05(月) 05:43:42.70 ID:???.net (+57,+29,-9)

より「ハック」っぽくないのはどちらかっていう意味ね

509 : Name_Not - 2018/02/05(月) 06:17:58.17 ID:???.net (+62,+29,-58)

ハックっぽいかなぁ？
>>506はbindした新しい関数返してるだけで別になんにもハックしてなくない？
bindなんてES5から入ってるし実装されてるかどうか気にするレベルにないのでは…

510 : Name_Not - 2018/02/05(月) 16:53:25.38 ID:???.net (+2,-29,-24)

Google Maps (Javascript) API に関することはここでいい？

他に適当な質問スレがあれば教えてください。

511 : Name_Not - 2018/02/05(月) 17:00:03.74 ID:???.net (+32,-29,-14)

>>510
Google Maps API 質問箱
http://mevius.5ch.net/test/read.cgi/tech/1131627583/

512 : Name_Not - 2018/02/05(月) 23:52:28.98 ID:???.net (+4,-30,-64)

>>477
Windows8.1はダメなので、IE自体の問題のような感じです。
開発者ツールでみると
else { //* not MSIE browser
wid1.location.href=wz1;
}
で止まっているのですが、Windows7では不具合なく動いているので、どこがおかしいかわからないのです。

513 : Name_Not - 2018/02/06(火) 02:26:00.54 ID:155ekgt0.net (+17,+22,-16)

フォーム内のあるアイテムの入力文字数が
たとえば 5文字あるいは10文字あるいは空白の場合だけ入力できるようにするにはどうすればよい？

514 : Name_Not - 2018/02/06(火) 03:50:42.56 ID:???.net (+47,+29,-2)

地道に数えろよ

515 : Name_Not - 2018/02/06(火) 08:19:49.38 ID:???.net (+163,+30,-108)

サロゲートペアと結合文字の問題があるからな
サロゲートペアで結合文字のものもある
例えばアクセント付付点８分音符「"𝅘𝅥𝅮𝅻𝅭"」は一文字でlengthは10だ

516 : Name_Not - 2018/02/06(火) 11:45:45.30 ID:???.net (+50,+27,-6)

>>495
ありがとうございました。
無事にこちらの方法で変数名を変えずに圧縮することができました。

517 : 507 - 2018/02/06(火) 13:15:35.38 ID:???.net (+62,+29,-3)

>>511
ありがとう。しかしそっちはちと寂しかったです。

518 : Name_Not - 2018/02/08(木) 22:50:41.60 ID:???.net (+3,-28,-83)

基本的なことだと思うんだけど、分かってないので

click event についてなのですが
event発生のタイミングって、カーソルのpushが対象から抜けた時ですよね
表現がヘンで伝わってるか不安だけど

ブラウザゲームっぽいの作ってまして
touchしたときにevent発生させることってできるんでしょうか？

519 : Name_Not - 2018/02/08(木) 23:34:02.32 ID:???.net (+99,+29,-45)

タッチならタッチ専用のイベントが有る
タッチ専用のイベントは有るがマウスにも対応しようとしたら
いろいろ面倒なので、統合的に使えるライブラリを探したほうが良いかもね
俺の知識は古いので何が最善かまで言えない

520 : Name_Not - 2018/02/08(木) 23:38:48.28 ID:???.net (+0,-29,+0)

mousedown

521 : 515 - 2018/02/08(木) 23:48:36.33 ID:???.net (+76,+29,-4)

>>519
ありがとう！
できないものと思い込んでた
http://developer.mozilla.org/ja/docs/Web/Guide/DOM/Events/Touch_events
これ見て吃驚

522 : Name_Not - 2018/02/08(木) 23:51:08.92 ID:???.net (-1,-29,-4)

マウスならmousedown、タッチならtouchstart
まあ両方やっとけばいい

523 : Name_Not - 2018/02/08(木) 23:53:20.77 ID:???.net (+27,+0,-4)

タッチは300ms問題とかもあったはず。ライブラリ使うべき。

524 : Name_Not - 2018/02/09(金) 00:01:43.51 ID:???.net (-1,-29,-3)

300ms問題はtapやで
だからtouchstart使うんや

525 : 515 - 2018/02/09(金) 00:11:31.05 ID:???.net (+9,-30,-170)

>>520
えっ！あっそか
と思ってやってみました (jqueryでね)
$('#hoge').on('click', function () {
console.log('ムフフ');
});
を
$('#hoge').on('mousedown', function () {

desktop版firefox お〜動くー！

iOS safari あれ？挙動が click と同じだなぁ

526 : Name_Not - 2018/02/09(金) 00:13:58.77 ID:???.net (-1,-29,-22)

あー、思い出した FastClick.js だ
300ms問題を解決するライブラリ

527 : Name_Not - 2018/02/09(金) 00:18:02.30 ID:???.net (+4,-29,-97)

>>525
そういうこと。
ブラウザによって挙動が違ってよく分からんｗ

そういやタッチとマウスを統一的に扱えるようにした
Pointer Eventsってどうなったんだろうね

http://caniuse.com/#search=pointer%20events
結局Chromeは実装したみたいだけど

528 : 515 - 2018/02/09(金) 00:25:48.81 ID:???.net (+3,-30,-115)

皆様ありがとう！
スマホはmouseじゃないからなのか

ぐぐってやってみて、ちゃんと動くようになったのが
var clickEventType = ((window.ontouchstart!==null) ? 'mousedown':'touchstart');
$('.slotBtn').on(clickEventType, function () {
socket.emit($(this).attr('id'));
});
// thankYou!!!

529 : Name_Not - 2018/02/09(金) 00:35:08.20 ID:???.net (+38,-30,-72)

タッチパネルつきパソコンはどうなるのか？って考えると
両方onしたほうがいいのかもしれないけどな

イベント２つ扱うときはこういう書き方な

$('.slotBtn').on("mousedown touchstart", function () {
socket.emit($(this).attr('id'));
});

あとどうでもいいけど、イベントハンドラ内のthisみたいに
必ず要素が一個であると断定できる時は、this.id と最近は書いてる

530 : Name_Not - 2018/02/09(金) 00:41:05.58 ID:???.net (+10,-28,-12)

内部でvarしない関数定義もしない即時関数って、即時関数にする意味なんかある？

531 : Name_Not - 2018/02/09(金) 00:42:29.31 ID:???.net (+62,+29,-5)

>>529
2回呼ばれることは絶対ないのけ？

532 : 515 - 2018/02/09(金) 00:44:41.07 ID:???.net (+3,-29,-11)

>>529
mousedown と touchstart 併記したら
safariのやつが２つとも反応しちゃうんですよ

this.id の件了解！きっとこの方が速いんですよね

533 : 515 - 2018/02/09(金) 00:50:57.13 ID:???.net (+34,-30,-51)

>>530
$('.slotBtn').on(clickEventType, socket.emit(this.id));
ってことですね
習慣でいたるところに…

534 : Name_Not - 2018/02/09(金) 00:52:03.46 ID:???.net (-1,-29,-30)

例えばbuttonの中に生の文字と<img>があってbuttonにイベントリスナつけたとき

535 : Name_Not - 2018/02/09(金) 00:53:04.40 ID:???.net (+84,+26,-1)

>>533
それダメｗｗｗ

536 : Name_Not - 2018/02/09(金) 00:56:43.96 ID:???.net (+47,-30,-84)

>>533
それ動くの？
>>530で言ってるのは例えばこんな感じの記述
(function(){
　document.getElementsByClassName('slotBtn')[0].addEventListener('mousedown', function(){
　　call.some.function();
　}, false);
})();

537 : 515 - 2018/02/09(金) 00:56:44.37 ID:???.net (+74,+29,+0)

>>535
なんんでぇー

538 : Name_Not - 2018/02/09(金) 00:58:46.31 ID:???.net (+12,-30,-23)

>>537
関数そのものを渡さなきゃいけない
function(){}を渡すのはいいが、
socket.emit(this.id)ではsocket.emit(this.id)を実行した結果が渡される

って感じか？

539 : 515 - 2018/02/09(金) 01:01:09.65 ID:???.net (+63,+29,-7)

>>536
やってないんで、やらんで良かった
コードさんきゅです、理解できた

540 : Name_Not - 2018/02/09(金) 01:03:05.75 ID:???.net (+8,-29,-20)

>>537
それだとその行にきた段階でリスナー登録じゃなく socket.emit() が実行される
もとのやつでいい

541 : Name_Not - 2018/02/09(金) 01:05:39.21 ID:???.net (+62,+29,-49)

タッチ、タップは魔境だなぁｗ
単体でもたくさんあるしuiライブラリ専用のもあるし…
http://npms.io/search?q=touch%20events

これなんかすげえ便利そう
http://github.com/GianlucaGuarini/Tocca.js

あとzingchartってやつはサンプルがウケた。いいのかこれｗ
http://codepen.io/zingchart/full/BzmdwQ

542 : Name_Not - 2018/02/09(金) 01:10:09.52 ID:???.net (+94,+29,-35)

そのうえ
画面のスクロールとかスクロールバー付き要素のスクロールとか
2本以上の指のタッチとか
アホかってほどいっぱい面倒なもんが出てくるからな

543 : Name_Not - 2018/02/09(金) 01:20:09.65 ID:???.net (-1,-29,-4)

zingchartじゃなくてzingtouchだった…
http://zingchart.github.io/zingtouch/

544 : Name_Not - 2018/02/09(金) 01:23:18.30 ID:???.net (+106,+29,-21)

ただ単にタッチを検出したいだけなら
touchstartとかでいいが

タッチを利用したカルーセルのような
インターフェースを作りたいのなら
自作するより使ったほうが楽

理由は>>542が書いているとおり

545 : Name_Not - 2018/02/09(金) 01:31:40.71 ID:???.net (+34,-29,-56)

>>518
自分も作るけど使い分けなくて便利だからPointer Events使ってる
来年にはFxとSafariでも使えそうな雰囲気だし
今はChromeとEdgeだけでもいいでしょ

546 : Name_Not - 2018/02/09(金) 01:34:56.66 ID:???.net (+101,+23,-3)

>>544
カルーセル作りたいなら、の意味がわからん

547 : Name_Not - 2018/02/09(金) 01:43:38.37 ID:???.net (+45,-30,-46)

touch, mouse を透過的に扱うのは、
Electron, Cordova, React などのフレームワーク

>>536
ECMA5 では、ブロックスコープが無かったから、
関数でスコープを作る