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

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

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

    851 = :

    簡単な「行」で遊んでる所悪いが、本当のお題は >>822 の「列」だからな

    動くコードで出てるのは、jQuery版のこれだけ（ >>821）

    $(document).on('click', 'td', function() {
    　var index = $(this).siblings().addBack().index(this) + 1;
    　$(this).closest('table')
    　　.find('th.selected').removeClass('selected').end()
    　　.find("th:nth-of-type(" + index + ")").addClass('selected');
    });

    アンチjQueryは頑張れ。これ真似するだけだろ？

    852 = :

    短くかければいいのなら単にhoge()と呼べば済むライブラリを提供すればいい
    それと同じで君の回答と言うのは質問者の成長を微塵も考えていない自己満足のコードなんだよ
    おかしな方向で張り合ってる暇があったらきちんとロジックやAPIの説明を交えた
    質問者の為になって次から独り立ちできるような回答を心掛けろ

    854 = :

    オブジェクトにイベントリスナを登録
    オブジェクトにイベントを発火させると、イベントリスナを順次呼ぶ
    みたいな仕組みを作る時の定石みたいのありますか？
    自分でonメソッドやonceメソッドやtriggerメソッドを実装することも
    そんなに手間ではなさそうですが
    使ったら便利になるパーツが既に揃ってるんじゃないかという気もします

    855 = :

    >>854
    いろいろ調べたのですが
    普通に自分で実装するのが一番早かったです

    856 = :

    イベントと言いつつただちょっと伝播するコールバックがしたいだけだろ

    857 = :

    イベントってそんなたいそうなものですか？
    http://developer.mozilla.org/ja/docs/Web/API/EventTarget
    EventTargetの簡易実装はたった35行ですよ
    もともとかなりシンプルな仕組みだと思いますが

    858 = :

    >>852
    > 短くかければいいのなら単にhoge()と呼べば済むライブラリを提供すればいい

    そういうライブラリがあるなら教えてくれ

    859 = :

    >854
    > みたいな仕組みを作る時の定石みたいのありますか？

    あるよ。EventEmitterとかいうのがそれ
    node関連でよく使われているがブラウザでも使える

    EventEmitterとかEventEmitter2とかEventEmitter3とかEventEmitter4とか
    あるので注意なｗ


    なお、いつものことだが

    jQueryはDOM要素だけでなく任意のオブジェクトに対してonでイベントハンドラを定義できる
    たったこれだけで、あなたの希望のものが実現できるよ

    var obj = { foo: 'bar' };

    $(obj).on('myevent', function() {alert(this.foo)});
    $(obj).on('myevent', function() {alert(1)});
    $(obj).on('myevent', function() {alert(2)});

    $(obj).trigger('myevent');

    860 = :

    >>859
    ありがとうございます
    EventEmitterというのは、聞いたことのある言葉ですが、
    そういうものだったのですね
    jQueryも使えることは調べていて知りましたが
    イベントを実装するためにオブジェクト自体がjQueryオブジェクトになってしまうのはどうか？
    と思ってやめたのでした
    ありがとうございました

    862 = :

    > イベントを実装するためにオブジェクト自体がjQueryオブジェクトになってしまうのはどうか？
    別にjQueryオブジェクトにはならないよ

    863 = :

    var arr=[];
    function p(n){
    arr.push(n);
    }
    p({id:'hoge',age:20});
    p({id:'fuga',age:18});
    console.log(arr);

    これをクラスぽく書くにはどうしたらいいですか？
    var my=function(){
    this.arr=[];
    }
    my.prototype.p=function(n){ this.arr.push(n);return this; }
    var a=new my();
    a.p({id:'hoge',age:20});
    a.p({id:'fuga',age:18});
    var b=new my();
    b.p({id:'moge',age:30});
    b.p({id:'muga',age:38});
    console.log(a);
    console.log(b);

    この.pを無くしてa({})やb({})という風にしたいのです

    864 = :

    Constructorから作るインスタンスを素のオブジェクトじゃなくて関数にしたいってことかな
    ならConstructor内のthisを無視してthis拘束した関数作ってprototypeに色々付けてそれreturnすればいい

    865 = :

    this無視するのに拘束・・？

    866 = :

    Javaの教祖マーティン・ファウラー御大、名著「リファクタリング」第２版にJavaではなくJavascript を採用してしまうｗｗｗｗｗ
    http://martinfowler.com/articles/201803-refactoring-2nd-ed.html

    867 = :

    >>866
    jQueryも採用しますか？

    868 = :

    jQueryスレで聞いてください。

    869 = :

    >>863
    それはどうみても、クラスじゃない
    new演算子も不要だから、クロージャでぐぐれ

    870 = :

    >>867
    そもそもDOM APIがでてこないんじゃないの？
    アレな人はJavaScriptの話題だけしろーっていって
    DOM APIの話はOKとかダブルスタンダードなこと言ってるけど
    JavaScriptにDOM APIは関係ないからね
    その本はあくまで言語の話しかしないでしょう。
    でもライブラリを使って短くしましょうぐらいは言うかもね

    871 = :

    >アレな人はJavaScriptの話題だけしろーっていって
    >DOM APIの話はOKとかダブルスタンダードなこと言ってるけど

    ここがWEB製作板で扱う話題が以下なんだから当然では・・・
    ・HTML、CSSなどのサイト制作の技術
    ・JavaScript、VBScriptなどのクライアントサイドプログラム

    872 = :

    ついでに言えばテーマがリファクタリングの本なんだから
    DOM APIが出ようが出まいが関係ないだろう・・・

    873 = :

    >>871
    ここはWebクライアントサイド技術の板なんだから
    ブラウザに標準搭載のDOMが関係ないわけないだろ
    ただオプションであるライブラリの１つを
    さも当たり前かのように扱うなということを皆言ってる

    料理でいうと、「砂糖・塩」と「親子丼の素・牛丼の素」は
    いくら同じ調味料でも違うし
    基本的に後者を使うのがスマートだと思い込んでる事自体が
    料理愛好家によって批判されてるんだよ

    874 = :

    安価先、合ってる？

    875 = :

    クロージャでやってみました>>869
    http://jsfiddle.net/4ed98ue3/1/

    本当は別のクラスにこういう機能を組み込みたかったのですが
    それだとa.p({})みたいに.pを書かないといけなくなってしまうのです

    ・arrayにプッシュするときは.pみたいなのを書かずa({})でできる
    ・それ以外の機能は”.なんたら”を書く
    みたいな感じです

    877 = :

    こんな感じ？
    var my=function(){
    var that = this;
    this.arr = [];
    return function(n){ that.p(n); return that; };
    }
    my.prototype.p=function(n){ this.arr.push(n); return this;};
    my.prototype.get=function(n){ return this.arr[n];};
    var a=new my();
    var c = a({id:'hoge',age:20});
    a({id:'fuga',age:18});
    var b=new my();
    var d = b({id:'moge',age:30});
    b({id:'muga',age:38});
    c.p({id:'nuga',age:48});

    console.log(c);
    console.log(d);
    console.log(c.get(c.arr.length - 1));

    878 = :

    >>877
    そうです
    できました！

    ありがとうございました。

    879 = :

    文章編集用のtextareaと、操作用のbuttonがあります
    textareaにフォーカスがある時に操作用のbuttonをクリックした時にも
    textareaのフォーカスは奪いたくありません
    デフォルトイベントを殺そうと、
    buttonのclickイベントリスナの中で
    preventDefaultとstopPropagationをしても、フォーカスは失われます
    フォーカスを奪わないようにするにはどうすればいいのでしょうか？

    880 = :

    >>879
    button に focus イベントが来るから
    そこで textarea.focus() を呼べばいいんじゃないか？

    881 = :

    >>879
    ふと思い出してmousedownをpreventDefaultしたら
    フォーカスを奪わないと確認できました
    こういう場合、
    デフォルトイベントを殺すためのmousedownイベントと
    clickイベントを別々に設定するのでしょうか？
    clickイベントの代わりにmousedownイベントを使うようにしたら、
    イベントリスナを一つにまとめることが出来ますが
    clickの代わりにmousedownを使うのは、それはそれでどうなのかと思います
    どうやるのがセオリーですか？

    882 = :

    >>880
    それでも同じ結果になりそうですが
    出来れば最初からフォーカスを取りたくないです

    883 = :

    >>881
    click イベントはマウス専用じゃないから分けたほうがいいと思う
    マウス等は使えない環境だとどうあるべきか考えてみるといいかも

    884 = :

    スマホみたいにtextarea触ると入力画面に遷移する環境をどう扱うかで分かれそう
    PCだけなら地道にtextarea操作時に常時キャレットの位置を記録しておいて
    何かあったらfocus()してキャレットを元に戻すまで一まとめにしてしまうのが
    面倒だけど一番な気がする
    そういう実装をエディタ系でたまに見る

    885 = :

    >>883-884
    ありがとうございます
    mousedownはpreventDefaultだけするようにしました
    こういう挙動が問題だと今日始めて気づいたのですが、
    皆さん色々工夫してるということが分かって何か安心しました
    ありがとうございました

    886 = :

    >>885
    今やってるのは要するにあれ？textarea内の一部の文章をマウス等で選択して
    ボタン押すとそこの部分だけ太字に　=>　フォーカスがががが

    887 = :

    そもそも、focus を奪わないって無理だろ

    focusは、PC 内で同時に、1つのアプリの、1つのコントロールしか持てないから、
    コントロールに入力する・ボタンを押すなどの際には、focusを奪う必要がある

    また、focusを持つコントロールは、見えていないといけない

    focusは、PC の資源。
    何かのアプリが動くと、しょっちゅう、focusが奪われる。
    それがウザイ

    888 = :

    クリック対象がフォーカスを持たないものなら
    フォーカスを奪わなくできる

    890 = :

    アロー関数ってどういう必要性から導入されたの?

    891 = :

    JSは即時関数やら関数定義を大量にする必要が出てくるのに
    functionって長いじゃん、それが理由
    #案とかいろいろあったよ

    892 = :

    つまり本質的に不要

    893 = :

    >>890
    関数の引数に、値のように見える関数を渡したいから

    array.sort(比較関数) みたいにね。

    ここ、比較関数を渡すんだけど、function() だったらいかにも関数じゃん？
    じゃなくて、比較処理値みたいに関数っぽくないものを渡したくない？

    array.sort( (a, b) => b - a ) みたいにね。

    ほら、これ引数に関数を渡してるように見ないでしょ？
    まるで値、実体は関数なんだけど、関数に見えない。値みたい
    それがアロー関数の素晴らしい所


    これは関数なんだけど、関数だとおもっちゃいけない。
    値だ。そういう処理をする値だ。と考えると
    thisが変わっちゃうなんてありえないって思えてくるでしょ？
    それがアロー関数の素晴らしい所

    894 = :

    紛らわしい所

    895 = :

    >>892
    javaやらrubyやらが涙ぐましい努力をして導入したのとは違い、javascriptは元から関数が第一級オブジェクトであるのでその通り。
    でも短くかけるようになるだけでも嬉しいじゃん。
    this使う場合もたいていbindしなくてよくなるから短くなるぞ。

    896 = :

    まあ使えなくても困りはしない

    アロー演算子は言語仕様だから
    オレオレライブラリで代用したりはできないけど


    どうでもいいけど
    function( ... ){ ... }( ... )[ ... ]
    とかのクソわかりづらい記述が俺は大嫌いだ

    897 = :

    (function( ... ){ ... })( ... )[ ... ]じゃないか？ｗ
    そういうときこそ変数に入れて分けよう。
    var hoge = function( ... ){ ... }
    var fuga = hoge( ... )
    var piyo = fuga[ ... ]
    一行で書くのはたいていはパフォーマンスのためというより変数の名前考えるのがダルいから。ソースは俺。
    分からないなら分かりやすく書こう。

    898 = :

    クソな書き方するワンライナークズって死ねばいいよね　という話だろ

    899 = :

    変数名かんがえるのが面倒なので便利サイト教えてください

    900 = :

    別に漢字とか使ってもいいんやで


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

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

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