のくす牧場
コンテンツ
牧場内検索
カウンタ
総計:127,062,934人
頁
昨日:no data人
頁
今日:人
頁
最近の注目
人気の最安値情報

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

    JavaScript覧 / PC版 /
    スレッド評価: スレッド評価について
    みんなの評価 :
    タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。
    ←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitterで

    453 = :

    JavaScript の、this は、コロコロ変わるから難しい。
    bind を使わないと、拘束できない

    jQuery を使えば、悩むこともない

    454 = :

    >>453
    jQueryを使ってもそこは一緒
    だけどjQueryだとクロージャーを使っても循環参照になりづらいのと
    DOM要素のリストとして扱うという設計思想によって扱いやすいってだけ

    でさ、お前ら何やってんの？
    >>437の話だろ？ なんでthisを保存とかいう話になってんの？

    addEventListenerの第二引数にクロージャーなんか渡すから
    話ややこしくなってるじゃん。 >>437のコードでだいたいあってるだろ

    http://jsfiddle.net/rdeuvep2/

    function Hoge(elementId) {
    　this.div = document.getElementById(elementId)
    }

    Hoge.prototype.foo = function() {
    　var button = document.createElement( "input" );
    　button.type = "button";
    　button.value = "テスト";
    　button.addEventListener( "click", this.bar, false );
    　this.div.appendChild( button );
    }

    Hoge.prototype.bar = function() {
    　alert( "click" );
    };

    var hoge = new Hoge("buttons");
    hoge.foo();

    455 = :

    ここまで
    アロー関数
    無し

    456 = :

    んで、恒例のjQuery化ｗ

    なるべく元の形を保ったバージョン
    http://jsfiddle.net/rdeuvep2/1/

    function Hoge(elementId) {
    　this.elementId = elementId
    }
    Hoge.prototype.foo = function(){
    　$("<input>", {type: "button", value: "テスト"}).click(this.bar).appendTo(this.elementId)
    }
    Hoge.prototype.bar = function(){
    　alert( "click" );
    };
    var hoge = new Hoge("#buttons");
    hoge.foo()


    俺はHogeクラスなんか作らずこんなんでいいと思ってる
    http://jsfiddle.net/rdeuvep2/2/

    var attrs = [{value: "テスト1"}, {value: "テスト2"}];
    var buttons = attrs.map(attr => $("<input>", attr).attr({type: 'button'}));
    $("#buttons").append(buttons).on('click', 'input[type="button"]', function() {
    　　alert( "click " + this.value);
    });


    >>455
    アロー関数使ってやったぜ？ｗ

    457 = :

    classを使って書いたバージョン
    http://jsfiddle.net/rdeuvep2/3/

    >>455
    アロー関数つかってやったが、
    >>454で書いたとおり、今回はアロー関数もクロージャーもいらない

    458 = :

    補足

    「今回は」アロー関数もクロージャーもいらない
    今回の要件にthisがどうなるかってのが書かれていないから

    this.barは今回は動くがthisは違っていると念の為に言っておく
    いろんなサンプル追加
    http://jsfiddle.net/rdeuvep2/6/

    459 = :

    qiitaで記事うｐしても叩かれない知識を身に着けたいんですが
    JavaScriptという言語を学ぶための良書を教えてください

    460 = :

    その考え方は大間違い
    人に意見を発信する以上は文句を付けられて当たり前
    そしてそれは良いこと
    お互い内外から叩き合ってきれいな球に近づくのだから
    それを防ごうと言うのはトゲトゲボールか、スライムになってしまうのがオチ

    461 :

    >>453
    えええ…

    462 = 461 :

    >>459
    とりあえずサイ本

    現段階のおまえさんのレベルも
    おまえさんが書いた記事にツッコミを入れる奴のレベルもわからんから
    それを数冊の本でなんとかするのは難しかろう

    464 = :

    プロのJSerやWEBエンジニアならオンライン仕様書以外は必要ない
    そういうのはJSの常識を知らない非JSネイティブプログラマ向けに用意されてる
    それもES2015以降の今の時代に於いては、JSを歴史から学んでJS仙人を目指したい人以外には過去の有名な本という飾りでしかない

    465 = :

    仕様書ってどこ見たらいいのか教えてください

    466 = :

    >>465
    何の仕様書を読みたいのか分からないが、>>4-5
    http://fiddle.jshell.net/vSqKr/44/show/light/#Link

    467 = :

    初心者はまずはMDN　「MDN ○○」でググる
    そしてより詳しく知りたければMDNの各記事の下に仕様へのリンクが張ってある
    徐々にそっちに移行していく

    468 = :

    let lastTimeSignal;
    setInterval(fuction(){
    let now = moment();
    let nowMinutes = now.format('YYYYMMDDHHmm');
    if (now.minutes()==0 && lastTimeSignal !== nowMinutes){
    lastTimeSignal = nowMinutes;
    /*処理*/
    ｝
    },1000);

    みたいなコードがあります
    moment()はmoment.jsです
    現在時刻の分数が0の時に一度だけ実行する、ようは時報です
    ですが、ごくまれに連続して複数回時報が実行されてしまうことがあります
    lastTimeSignalが設定されるので排他的に処理されるはずなのに
    何故複数回実行されてしまうのか分かりません
    現象はchromeで確認しています
    lastTimeSignal とnowMinutesをログに出力するようにしましたが
    連続実行された時の値は全く同一でした
    lastTimeSignalが設定されないまま
    複数のインターバルが呼び出されている、としか思えません
    処理は、何かと不安定なSpeechSynthesisUtteranceを使っているので
    それが原因なのかとも思いますが
    処理の前にlastTimeSignal = nowMinutesとすぐに代入しているので、
    たとえSpeechSynthesisUtteranceに問題があっても排他処理まで失敗するのは奇妙です
    関数の外の変数（lastTimeSignal）への変更が
    すぐに反映しない、なんてことあり得ますか？

    469 = :

    >>468
    あらためてログを確認すると
    10/13 05:00:00.97
    10/13 05:00:00.98
    と、0.01秒差で連続実行されていました
    1秒ごとに実行されるはずのインターバル処理が、
    ほぼ同時に2回呼び出されていることになります
    一体何故・・？
    いま、ふと思い付いたのですが
    不安定なSpeechSynthesisUtteranceの実行に更にsetTimeoutを挟めば
    変数の変更まで不安定になることは防げるかもしれません

    470 = :

    とにかく問題が再現できる最小限のコードを貼りなさい
    できればライブラリも除いた状態で
    まずそうやって削ぎ落としていくのがデバッグの基本でもある

    472 = :

    明確な根拠もなく実行系を疑うのはプログラマ憲法でタブーとされていること

    473 = :

    プログラマーが権力機構で処理系が労働者なのか

    474 = :

    恥ずかしいことに、インターバルタイマーを複数回設定していたのが原因でした
    ライブラリの中の、
    起動時にしか実行されないと思っていたハンドラの中で設定していたのですが
    そのハンドラはその後の操作によっては複数回呼び出されるものだったのです
    プログラマー憲法を心に銘じます
    ありがとうございました

    475 = :

    思った通りの原因だった

    476 = :

    まあでも非同期が絡むとデバッグが一段と難しくなるのは事実
    ただコールバックで闇雲に投げて闇雲に呼ばれるのではなく
    Promise,async-await,async generator辺りを適切に使って
    シーケンシャルに管理すれば軽減できはする

    477 = :

    jsだと無名関数にしてしまう分、普通に何回も呼び出してしまうよな
    アクセス解析の値がぶっとんでた時はあせったわ

    478 = :

    無名関数だからって理由でそんなことすることはないな。
    だって名前つけても同じ話だもの

    479 = :

    無名関数ならそこでしか使わないんだから
    逆に予定外に何度も呼び出すことなんて少ないと思うが

    480 = :

    ES2015でforEachがオブジェクトに追加されなかったのは何故ですか？
    最近のJSはイケてると思っていましたが
    いまだにオブジェクトをforEachできないのは違和感があります
    もうかなり以前からunderscoreやlodashがforEachの有用性を証明してますよね

    481 = :

    そういうことするならmapって話なんじゃね

    482 = :

    >>480
    だからlodashを使えばいいだけだろう？

    483 = :

    mapは新しい配列を作るためのものなので用途が違います
    ライブラリは言語にあるべき未来を見せるのが役割の一つなので
    それを何年も前に見せられてなおかつ放置してるのは怠慢と言わざるを得ません

    484 = :

    いや、ライブラリは言語仕様をシンプルにするのが目的だよ。
    どんな言語でも言語自体に色んな機能を含めず
    多くの機能はライブラリで提供されてるはずだ。

    485 = :

    >>483
    Mapと書くべきだったか
    まあ意図は違うんだろうけど

    486 = :

    Mapじゃなくて地図と書くべき。
    でないと、SMAPと勘違いされる可能性がある。

    487 = :

    あの文脈ならMapで通じると思うけど
    つーかもうオブジェクトからイテレーター作れるじゃん

    488 = :

    mapメソッドとは別にMapオブジェクトというのがあったのですね
    イテラブルではない普通のオブジェクトを回すのはあまり行儀が良くない、
    という判断が根底にあるのでしょうか？
    でも

    (new Map([['taro','name'],[15,'age']])).forEach((key,value)=>{
    });

    こんな書き方がイケてるとはあまり思えないのですが・・
    newを書かずにMapオブジェクトを生成する
    シンタックスシュガーを用意して欲しいところです

    489 = :

    >>488
    シンタックスシュガーはいらないですね。
    関数を用意すればいいだけですよ。

    490 = :

    >>488
    Object.entries(obj).forEach(([key,value])=>{})

    491 = :

    >>490
    これはなかなかいいですね
    オブジェクトのインスタンスメソッドで出来て欲しいですが、
    keyとvalueだけでなくindexも取れるところもイケてると思います

    492 = :

    >>491
    そのやり方は列挙順を保証出来ないから、順序がランダムで良いときしか使えない
    もともと、オブジェクトのキーは列挙する事を想定したものでもないし、連祖配列的なものを望むなら、足りない機能が多くて苦労すると思うよ

    494 = :

    たしかにオブジェクトのメンバに順序は期待出来ないですが
    ループの中でループカウンタが欲しくなることはわりとあるので、
    そういう意味です

    495 = :

    未だにES5脳な奴がいるんだな
    列挙の順序が保証されてないのはfor-in文とES5のObject.keys()
    ES2015以降のObject.{keys,values.entries}()は保証されている
    こんなんJSerなら誰でも知ってる常識だろう

    497 = :

    JSは日進月歩なんだから
    未だにES5脳な奴がJSerなわけ無いだろ

    499 = :

    async-awaitで逐次処理書いてる時に比較的長いタスクをやらせると
    裏で動いているのかどうか分かんなくなるんですが。
    定期的にconsole.logとかでログ出力していれば分かるんですが、
    そうでない場合、逐次処理が実行中だってどうやって把握すればいいんですかね？

    500 = :

    そりゃconsole.logを適切な個数置くしか無いよ

    それかメイン関数以外にあちこち置くのが嫌なら
    await longTimeTask()
    をpromiseが解決するまで一秒ごとにログを出すperiodicLogingを用意して
    await periodicLoging( 'タスクA', longTimeTask() )
    と書くとか、同様にしてタイムアウトさせたりするとか


    ←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitterで / JavaScript一覧へ
    スレッド評価: スレッド評価について
    みんなの評価 :
    タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。

    類似してるかもしれないスレッド

    トップメニューへ / →のくす牧場書庫について