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

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

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

    1 = :

    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にして見えないようにしてください。文句をつける＝荒らしです

    2 = :

    ■FAQ
    http://fiddle.jshell.net/vSqKr/44/show/light/

    ◆開発者ツール(Developer Tools)の基本的な使い方 (全部はhttp://fiddle.jshell.net/vSqKr/44/show/light/#Browser-Developer-Tools )
    　▼諸注意
    　 - 本説明では Google Chrome の開発者ツールの名称に従います。他ブラウザで使う場合は適宜読み替えて下さい。
    　 - Edge- でコンソールを使うには予め開発者ツールを起動しておく必要があります(開発者ツールを起動しないと console.log() が機能しません)
    　 - Safari はデフォルトで開発者ツールが無効な為、有効に設定する必要があります。
    　http://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/GettingStarted/GettingStarted.html
    　▼要素を検証
    　1. ページ上で右クリックして [要素を検証]
    　2. [Elements] パネルが開き、対象のDOMノードが選択される(選択対象が目的の要素でなければ [Elements] パネル上で選択し直す)
    　3. 右側のサイドバーから知りたいステータス名のタブを選択する
    　　　- [Styles] タブ … CSSプロパティの指定値を表示 (※カスケードによって上書きされたプロパティは取り消し線で表示される)
    　　　- [Computed] タブ … CSSプロパティの算出値を表示("font-size: 1em" を指定していても算出後の "*px" で表示される)
    　　　- [Properties] タブ … 選択したDOMノードのプロパティを表示
    　▼コンソール
    　1. JavaScript コード上で console.log('Hello, World!'); と入力
    　2. [Ctrl] + [Shift] + [I] キー(IE は [F12])で開発者ツールを開き、[Console] パネルを開く
    　3. [Console] パネルに "Hello, World!" と表示される
    　(※window.alert() は String 型に変換されますが、console.log() は Object 型の中身をそのまま表示してくれます。)

    3 = :

    ■FAQ(続き)
    ◆JavaScriptの実行速度
    JavaScriptの速度は「ブラウザ名」「ブラウザのバージョン」「PCスペック」に依存します(ブラウザのバージョン毎に最適化具合が異なります)。
    速度の疑問解消の為にhttp://jsperf.com/ にコードをUPしてブラウザ毎に速度計測する事を推奨します。
    例外として、仕様における理論上の速度が明確になっている場合があります。
    例えば、正規表現によるマッチング処理を考えた場合、「RegExp#test > RegExp#exec > String#match」は ES5 仕様で保証されています。
    ES5 仕様において RegExp#test が最も処理数が少なく、String#match が最も処理数が多いことが明確だからです。
    ブラウザによっては RegExp#test の最適化が十分でなく、String#match の最適化が RegExp#test より十分であれば逆転する可能性はありますが、各メソッドの最適化が一律であればこの前提が崩れる事はありません。

    ■各種仕様 (http://fiddle.jshell.net/vSqKr/44/show/light/#Link も参照 )
    ◆ Standard ECMA-262
    http://bclary.com/2004/11/07/ (ECMAScript 3 HTML版)
    http://www2u.biglobe.ne.jp/~oz-07ams/2002/ecma262r3/ (ECMAScript 3 和訳)
    http://www.ecma-international.org/ecma-262/5.1/ (ECMAScript 5.1 HTML版)
    http://tsofthome.appspot.com/ecmascript.html (ECMAScript 5.1 和訳)
    http://www.ecma-international.org/ecma-262/6.0/ (ECMAScript 6 / ECMAScript 2015)
    http://kangax.github.io/compat-table/es5/ (ECMAScript 5 compatibility table)
    http://kangax.github.io/compat-table/es6/ (ECMAScript 6 compatibility table)
    ◆ HTML Standard (HTML5)
    http://www.whatwg.org/specs/web-apps/current-work/multipage/
    http://momdo.s35.xrea.com/web-html-test/spec/WD-html51-20130528/Overview.html (HTML5.1 部分訳)
    http://www.hcn.zaq.ne.jp/___/WEB/WebStorage-ja.html (Web Storage 和訳)

    4 = :

    ■各種仕様 (続き)
    ◆ Document Object Model (DOM) / CSS Object Model (CSSOM)
    http://www.hcn.zaq.ne.jp/___/WEB/DOM4-ja.html (DOM Standard (DOM4) 和訳)
    http://www.w3.org/TR/DOM-Level-3-Events/ (DOM3 Events)
    http://www.w3.org/TR/uievents/ (UI Events)
    http://www.hcn.zaq.ne.jp/___/WEB/cssom-ja.html (CSSOM 和訳)
    http://www.hcn.zaq.ne.jp/___/WEB/cssom-view-ja.html (CSSOM View Module 和訳)
    ◆ その他のWeb関連仕様
    http://domparsing.spec.whatwg.org/ (DOM Parsing and Serialization - innerHTML等)
    http://www.hcn.zaq.ne.jp/___/WEB/XHR-ja.html (XMLHttpRequest 和訳)
    http://www.hcn.zaq.ne.jp/___/WEB/File_API-ja.html (File API 和訳)
    http://www.whatwg.org/specs/ (WHATWGの仕様一覧)
    ◆ MDN (Netscape/Mozilla)
    http://developer.mozilla.org/ja/docs
    ◆ MSDN Library
    http://msdn.microsoft.com/en-us/library/ie/hh828809 (Internet Explorer API)
    http://msdn.microsoft.com/ja-jp/library/yek4tbz0.aspx (JavaScript)
    http://msdn.microsoft.com/ja-jp/library/cc427807.aspx (JScript)
    http://msdn.microsoft.com/ja-jp/library/cc409712.aspx (DHTML)
    ◆ JavaScript Garden (ja)
    http://bonsaiden.github.com/JavaScript-Garden/ja/
    ◆ JSON (JavaScript Object Notation)
    http://www.json.org/json-ja.html

    5 = :

    >>1
    いいね！ 乙

    6 = :

    http://www.hcn.zaq.ne.jp/___/WEB/
    だいぶ前からリンク切れ

    7 = :

    >>1
    ライブラリ禁止の条項をなくした、という事はいつもの人か

    8 = :

    ライブラリ禁止をなくせば問題は全て解決する

    9 = :

    ライブラリ禁止は質問者やほかの人のためになるかどうかじゃなくて
    アンチが荒らす免罪符とてしか使われてないからな

    10 = :

    だからテンプレリンクあまりに多すぎだって
    こんな沢山のリンク読む人はいない
    MSDNだってMDNに統合されるし、リファレンスはMDNだけで十分
    WHATWGとかW3CはMDNを読んでもっと詳しく知りたいと思った人が勝手にたどり着く
    ES仕様もしかり、ここで紹介しても仕方がない

    11 = :

    >>10
    次はちゃんと吟味して更新しておくよ

    12 = :

    テンプレが無駄に多いのは１００スレ続く伝統
    技術者のクセ

    13 = :

    「伝統」は本当にそれでいいのかを常に見直し更新していくのがプログラマのさだめ
    「ずっとこうだから」と言った時点でその人はただのコーダー

    14 = :

    node.jsの勉強にいいサイトありませんか？

    16 = :

    Node.jsでどんなことができるの？

    18 :

    おまえら大先生なんだから
    本質的にJSというよりライブラリの話だなってわかった時点で誘導してあげればいいじゃん？
    そんなにけんけんしないで

    19 = :

    殆どがライブラリでも解決できる話題なのでここでやる方がいい
    誘導が多い＝ここでやるべき話題ってことだ

    20 = :

    質問者がライブラリの話を始めるのが問題なんじゃなくて
    ライブラリ使わずとも数行で実現できることであっても
    頑なにライブラリを勧めようとする回答者がいることが問題

    21 = :

    いろんな回答があって良いのだからライブラリを使った回答でも良い
    その人がライブラリを使わない回答を書く義務もない

    ライブラリを使わない回答は他の誰かがやればいい
    それをやらないで頑なにライブラリを使った回答をするなと
    言うやつが問題

    ライブラリを使うなというのではなく、
    ライブラリを使わない回答を書け

    そうすれば荒れることはない

    22 = 18 :

    >>20
    それなー
    わかるんだけど、初心者とかだと特にjQuery使うだろうから
    ピュアJSで教えたら、教えた部分だけ浮いちゃったりするんじゃないかなー
    とも思う

    >>21がごもっともだと思う
    こうも書けるよ！って言うだけで良いのだろうなと

    23 = :

    自分で関数を作ってもある意味ライブラリ

    24 = :

    >>14-17
    Reactビギナーズガイド ――コンポーネントベースのフロントエンド開発入門
    Stoyan Stefanov, 2017

    この本では、データアクセス(CRUD)は、Flux の、Store という部分で、
    UI とは完全に分離させている

    nmp の、immutable パッケージで、データを変更不能にしたり

    25 = :

    >>23
    00年代前半にオレオレライブラリを作ってた記憶が…うっ、頭が

    26 = :

    初心者だとjQueryを使うっていう考えに違和感

    27 = :

    ■テンプレ案
    http://fiddle.jshell.net/fH4cC/174/show/light/

    ■諸注意
    vol.115でlodashを不必要に推奨して啓蒙する行為が多く確認されており、ライブラリ系の話題はvol.116から禁止されました。
    vol.115,116ではライブラリ禁止する発言が見られた直後にライブラリを許可する意図で次スレを立てる行為が確認されています。
    本スレッドでライブラリ許可を求める発言が確認された場合は不要な争いを避ける為、スルーすることを推奨します。
    ライブラリの話題はライブラリスレへ誘導し、誘導行為への反論はスルーしてください。

    28 = :

    JavaScriptでたまに
    { ...abc, }
    みたいなの見ますが「...」って何なんでしょうか？

    29 = :

    >>27
    伝統あるテンプレをvol.116から勝手に変えないでください
    いい加減怒りますよ？

    勝手に変えて良いのであれば、vol.131からライブラリは解禁になりました。
    スレの住民の意見をちゃんと取り入れましょう

    30 = :

    >>28
    これ
    http://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Spread_operator

    >>1より
    > ・動作ブラウザや環境が限られる場合は、それを明記してください
    ということなので書くと

    比較的最近使えるようになった。リンク先にも書いてあるが
    IEではサポートされていない（Edge12から使える）

    Chrome、Firefox、Safariも古いやつは使えないが
    これらの古いやつはシェア低いので無視していいだろう

    32 = :

    >>30
    スプレッド演算子とかいうやつですか。
    調べてみます。ありがとうございます。

    33 = :

    スプレッド演算子知らなかった
    これ、使える？

    34 = :

    ECMA 6 から使える、スプレッド(展開)演算子。
    React, JSX でも使える

    Babel で、ECMA 5 に変換できる

    var attr = {
    href: '～',
    target: '_blank',
    };

    return <a {...attr}>あ</a>

    return (
    <a href={attr.href} target={attr.target}>あ</a>
    );

    35 = :

    > これ、使える？

    ブラウザが対応しているか？ということなら>>30に書いたとおり

    ではなくて、便利か？という意味なら
    一度知ってしまえば、有って然るべき機能だと思うようになるよ
    以前は変則的な書き方をしていた所をシンプルに書けるようになる

    例えば、以前はこんな感じで一瞬「？」となるような書き方が必要だった
    http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator#Copy_an_array
    http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator#A_better_way_to_concatenate_arrays

    36 = :

    オブジェクトに関するスプレッド演算子は、以前はlodashなどのライブラリを使わないとやりづらかった
    http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator#Spread_in_object_literals

    あとこの「...」は関数の引数にも使用できる。正確にはこっちはrest parameterと呼ばれているけどね
    http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters

    37 = :

    >>34
    こういう書き方も好き
    （hrefやtaget変数に入れておいて何らかの処理をすることはよくあるので）

    const href = '～';
    const target = '_blank';
    const attr = {href, target};

    return <a {...attr}>あ</a>

    38 = :

    >>29
    テンプレを勝手に書き換えた>>1にもどうぞ文句を入れて下さいよ

    39 = :

    戻しただけなので問題ない

    40 = :

    質問テンプレートとか、テンプレも結構後から改変されてるよね
    残してほしいところだけ「前からあった」といい、変えては困る場所だけ「勝手に変えるな」と彼はいう

    41 = :

    >>40
    5ちゃんねるに申請でもしてこのスレの公式管理人でもなったら？
    でないのであれば、俺とお前は立場は一緒、
    俺がスレの民意をまとめてその内容でテンプレにしただけの話

    42 = :

    >>41
    >>27のテンプレも当時のスレの民意をまとめて決めたものだけど、なぜその伝統は無視するの？
    >>1は事前に話し合ったわけでもなく、彼が独断で決めただけでしょ
    話し合いのあった当時と比べるべくもないよ

    44 = :

    >>41
    > 5ちゃんねるに申請でもしてこのスレの公式管理人でもなったら？
    > 俺がスレの民意をまとめてその内容でテンプレにしただけの話
    君が>>1なら、>>1のルールを守るのは最低限の礼儀だと思うよ

    > ・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)

    48 = :

    なんでsplitの２番目の引数指定した時の動作が他の言語と違うんだろうか

    49 = :

    string.split(/0(.*)/,2)


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

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

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