タグ

*JavaScriptに関するmichiryunのブックマーク (26)

  • JavaScriptのタイマー処理 setIntervalとsetTimeout - Qiita

    処理を遅延させたい、3秒ごとに処理を繰り返したい、というとき、JavaScriptでは以下のような関数を使用します。 setTimeout関数 ・・・ 指定した時間経過後に処理を実行する setInterval関数 ・・・ 指定した時間ごとに処理を実行する また、それぞれタイマーを停止するための関数も用意されています。 clearTimeout関数 ・・・ setTimeoutで設定したタイマーを取り消す clearInterval関数 ・・・ setIntervalで設定したタイマーを取り消す setTimeout関数 clearTimeout関数 指定した時間経過後に処理を実行します。 var log = function(){ console.log("test"); }; setTimeout(log, 3000); // 3秒後に"test"と表示されます

    JavaScriptのタイマー処理 setIntervalとsetTimeout - Qiita
  • くそったれJavaScript - Qiita

    以下はWhat the f*ck JavaScript?というリポジトリの日語訳です。 What the f*ck JavaScript? JavaScriptは素晴らしい言語です。 単純な構文、大きなエコシステム、そして最も重要なところはコミュニティです。 同時に、JavaScriptは非常にトリッキーで面倒な言語でもあります。 幾つかの仕様は我々の仕事を地獄に変え、他の幾つかは笑える仕様です。 WTFJSの大元のアイデアはBrian Lerouxによるものです。 以下のリストは2012年のdotJSにおける彼のトーク、WTFJSに触発されています。 Node Packaged Manuscript 以下の内容はnpmでインストールできます。

    くそったれJavaScript - Qiita
  • JavaScript:ECMAScriptの変更履歴・外部リンク - リファレンス メモ

    トップ 言語 等CSSHTMLJavaScriptPython ライブラリ・プラットフォームjQuerymicro:bitXamarin ドキュメンテーションDoxygenJSDocMarkdownSHFB (Sandcastle Help File Builder)XML ドキュメント コメント その他各種資料 子サイト・SNS 簡易リファレンス・TipsFacebookX サポート寄付 メインページメイン 標準組み込みオブジェクト 一覧ホストオブジェクト 一覧 (抜粋)各バージョンの差分 ES2022 (13) ⇒ ES2023 (14)ES2021 (12) ⇒ ES2022 (13)ES2020 (11) ⇒ ES2021 (12)ES2019 (10) ⇒ ES2020 (11)ES2018 (9) ⇒ ES2019 (10)ES2017 (8) ⇒ ES2018 (9)ES20

  • ECMAScript - Wikipedia

    この記事は検証可能な参考文献や出典が全く示されていないか、不十分です。 出典を追加して記事の信頼性向上にご協力ください。(このテンプレートの使い方) 出典検索?: "ECMAScript" – ニュース · 書籍 · スカラー · CiNii · J-STAGE · NDL · dlib.jp · ジャパンサーチ · TWL (2020年6月)

  • ECMAScript 5 (ES5) 新機能 まとめ

    最新は ECMAScript2015 が出ていますが…ECMAScript3から知識が止まっているので少しずつ更新したいと思います。 まずは、ECMAScript5について見ていきます。 すべて見ても ECMAScript3 と被る部分が多いので、ECMAScript3 と ECMAScript5 の差分に絞ってまとめます。 差分だけでも結構な量になってしまいましたが…それだけ新規機能が増えたということですね。 今まで JavaScript で上手くいかずにもどかしかったもろもろが、そこそこ解決されている気がします。 目次 strict モード strictモード の 適用 strictモード を スクリプト全体 に 適用する strictモード を 特定関数のみ に 適用する オブジェクト getter / setter 末尾 カンマ を 無視 予約後 を プロパティ名 に指定可能 メソ

  • 【JavaScript入門】null・undefinedの代入・判定・変換まとめ! | 侍エンジニアブログ

    「null」とは? nullとは、オブジェクトが存在しない状態のときの値です。 参考URL: null – JavaScript | MDN つまり、値がnullの変数は、「値が存在しない」という意味を持ちます。 整数0が整数として値を持たないという意味で用いられることと同じ意味で、nullは整数0のように、オブジェクトとして値を持たないという意味で用いられます。 例えば、String変数の値がnullの場合、「String変数に文字列は入っていない」という意味があります。String変数の値が””の場合は、「String変数の値は空文字が入っている」という意味になり、この場合空文字ではありますが、値が存在していることになります。 また、nullはリテラルとして扱われます。 実際に、コードでnullの型を確認してみましょう。 window.onload = function () { //

    【JavaScript入門】null・undefinedの代入・判定・変換まとめ! | 侍エンジニアブログ
  • あなたはどこまで解き進められる? 「FizzBuzzダンジョン」でコードパズル

    はじめに いつもは「マンガで分かるプログラミング用語辞典」を描いている、クロノス・クラウンの柳井です。JavaScript大好きで、「マンガで分かる JavaScriptプログラミング講座」を書いたりもしています。そして最近は「CodeIQ」というサイトで、さまざまなプログラミングの問題を出題しています。 今回は、その「CodeIQ」で出題して人気のあった「FizzBuzzダンジョン」という問題のさまざまな解法を紹介しようと思います。私自身も勉強になり、コードを読むことを楽しめましたので、プログラマーの方々はきっと楽しめると思います。 「FizzBuzz問題」とは、3の倍数のときは「"fizz"」、5の倍数のときは「"buzz"」、共通の倍数のときは「"fizzbuzz"」、その他は「数値」を戻すという単純な処理です。ループ処理と分岐処理を理解していればコードを書けます。 「FizzBuz

    あなたはどこまで解き進められる? 「FizzBuzzダンジョン」でコードパズル
  • 【Javascript】0で割ると? at softelメモ

    0で除算するとどうなるかはプログラム言語によってさまざま。 例えばphpでは”php -r ’10/0;'” → Warning(警告)が発生。 MySQLでは”select 10/0″ → NULL(極力エラーで止めない方針だからか)。 PostgreSQLではエラーがでてSQLを実行できない。 ではJavascriptでは? … 10 ÷ 0 → Infinity(正の無限大) … 0 ÷ 0 → NaN(Not-A-Number、非数) … -10 ÷ 0 → -Infinity(負の無限大) それぞれ、JavaScriptやECMA-262で定義されているもの。 各ブラウザの勝手な仕様ではない。 仕様によると、こうなる。 … Infinity × Infinity → Infinity … 10 ÷ Infinity → 0 … 10 + Infinity → Infinity …

    【Javascript】0で割ると? at softelメモ
  • CSS3のtransition-timing-functionの値、cubic-bezier()に関して | KnockKnock

    CSS3のtransition-timing-functionの値、cubic-bezier()に関して | KnockKnock
  • ES6 が使えるかの JavaScript での確認方法 : (*x).b=z->a+y/c

    ◆ Babel 使うと面倒も増える ◆ devtools で楽できない ◆ 設定とか準備 ◆ Babel の知識がいる ◆ 他 ◆ モダンブラウザはそのままの JavaScript でいいんじゃないかな ◆ ES6 の判定はとりあえず Symbol が綺麗で polyfill 影響受けないはず Babel は altJS ですが JavaScript を書きます ブラウザで対応していない機能でも実行できるように ES5 に変換してくれます なので JavaScript が好きでわざわざ altJS なんて使う気がしない人でも使える良い altJS です ただ Chrome や Firefox では ES6 はほぼ使えるようになったので ES7 以降の proposal も使いたいとか IE 対応しないといけないってときくらいしか使わなくてもいいと思います そんなに気にしない人も多いですが

    ES6 が使えるかの JavaScript での確認方法 : (*x).b=z->a+y/c
  • 簡単に HTML を実際に動かす : (*x).b=z->a+y/c

    HTML プレビューしたいブログで記事中に HTML を書いたとき HTML なんだし実際に動かせるページがあると便利ですよね そういうのが用意されていないと 見ていて気になって実際に動かしてみたいと思っても わざわざ HTML ファイルを作って開くという手間があります ありがちなのがブログ内に HTML ページを用意してリンクを貼っておくこと すごく単純ですし ブログ内で完結する安定の方法です ただ 作る側が面倒なんですよね 記事文と同じものをファイルにして保存してアップロードしてリンク貼って…… 今のメインがこれですがそろそろもっと良い方法にしたいです jsbin とか少し楽な方法に jsbin, codepen, jsfiddle, stackblitz などなど HTML を実際に動かせるサービスを使うものがあります 国内ブログではそこまで見ません(日語のそういう系のブログ自体

    簡単に HTML を実際に動かす : (*x).b=z->a+y/c
    michiryun
    michiryun 2020/02/20
    別窓にHTMLを生成
  • document.write() の代わり

    私が javascrip と戯れていて、いざって言う時に使っているのが document.write() です。 HTML,css,javascript を使った文章を、document.write() で一括して書き出す時に使っています。 でもこの document.write() 非推奨なんだそうです。 その理由? 難しすぎて分かりません… しかも、実行速度が遅いらしいのです… 遅いのは嫌です。 我が家のご老体 PC にも優しい軽くて速いのがいいです。 document.write() の代替手段をネットで検索しても、出てくるのは、「innerHTML を使ったほうがいいよ!」って言うような記事ばかりです。 でもこの innerHTMLHTML,css,javascript をごちゃ混ぜにした文章を書き出すと、javascript を実行してくれないんですよね… javascri

    michiryun
    michiryun 2020/02/20
    document.write使わずに別窓に書き込み
  • Document - Web API | MDN

    Document インターフェイスはブラウザーに読み込まれたウェブページを表し、 DOM ツリーであるウェブページのコンテンツへの入口としての役割を果たします。 DOM ツリーには <body> や <table> など、多数の要素があります。これはページの URL を取得したり文書で新たな要素を作成するなど、文書全体に関わる機能を提供します。 EventTarget Node Document Document インターフェイスは、あらゆる種類の文書に対して共通のプロパティやメソッドを提供します。また、文書の種類(例: HTML、XML、SVG など)に応じて、より大規模な API を使用できます。コンテンツタイプ "text/html" で提供される HTML 文書では、 HTMLDocument インターフェイスも実装します。一方 XML や SVG 文書では、 XMLDocumen

    Document - Web API | MDN
  • JavaScript で doctype を変える : (*x).b=z->a+y/c

    ◆ 「document.implementation.createDocumentType」 で作れる ◆ 「document.doctype」 と replace する ◆ 変えても互換(Quirks)モードか標準モードかは変わらない ◆ document.compatMode で確認できる ◆ document.write で新しく一から DOM を doctype 付きで作れば変えられる

    JavaScript で doctype を変える : (*x).b=z->a+y/c
  • JSONの形式を完全理解して読み書きできるようになるための記事 | 侍エンジニアブログ

    という少し応用的な内容について詳しく解説していくので、JSON初学者の方は是非参考にしていただければ幸いです! JSONとは それでは、早速JSONとは何だというところについてみていきましょう。JSONとは、JavaScript Object Notationの略でデータフォーマットの一種です。とは言われても何かよくわかりませんよね。 データを扱うとき、様々なルールを決める必要があります。理由は大きく2つあって、 この2つが主な理由です。JSONはこれらのルールを満たすために定められたデータ形式の一つです。データ形式のことをデータフォーマットと言ったりするんですが、データフォーマットにはJSONだけでなく、CSVや、XMLといったものもあります。 それぞれのデータフォーマットごとに特徴のあるルールが定められていて、記事ではそのJSONにおけるルールつまり形式を詳しく解説していきます。 J

    JSONの形式を完全理解して読み書きできるようになるための記事 | 侍エンジニアブログ
  • ビルトイン関数/JavaScriptリファレンス

  • 【JavaScript】配列に関するメソッド【find・map】|とものブログ

  • あなたが知らないJavaScriptの便利すぎるショートハンド19選

    日頃書いているJavaScriptをもっと短く書く方法を知っていますか? 目からうろこ、すぐに使えるJavaScriptのショードハンドを紹介します。 JavaScriptを使うすべての開発者に向けて、私が長年かけて身につけたJavaScriptのショートハンド(短縮記法)を資料にしました。コードの違いが分かるように通常の記述方法も併記しました。 1.三項演算子 if-else文を1行に収めた短縮記法です。 通常const x = 20; let answer; if (x > 10) { answer = 'is greater'; } else { answer = 'is lesser'; } ショートハンドconst answer = x > 10 ? 'is greater' : 'is lesser'; 従来のif文を1行に収めることも可能です。 const big = x >

    あなたが知らないJavaScriptの便利すぎるショートハンド19選
  • Enterキーでonclickと同じ動作を行う。 - Qiita

    HTMLのformのテキスト(<input type="text">)などは入力し、エンターを押したとき、submitが押されたのと同じ状態になり、ページがリロードされてしまいます。そこでエンターを押したときにbuttonのonclickを押したときと同じ状態にできるようにする方法をメモします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>Sample</title> <script> function abc(){ document.getElementById("a").textContent = "あ"; return false; } </script> </head> <body> <form onsubmit="return abc()"> <input type="text"> <

    Enterキーでonclickと同じ動作を行う。 - Qiita
  • JavaScriptで小数を整数にするマニアックな方法とその実行速度 | q-Az

    JavaScript を使って小数を整数に変換する(小数部分のカット)いろいろな方法の紹介です。Math.random() を利用するときによく使うでしょうか。最も一般的な方法は Math.floor() を使うものだと思うのですが、他の方法でも出来るので紹介してみます。 ついでに実行速度まで計測してみました。 「切り捨て」のみに着目しています。「切り上げ」や「四捨五入」はまた別の方法になりますのでご注意ください。 Math.floor(number)Math.floor(5.368) //→ 5一番使われる有名な方法です。 ただしこの方法は、「プラス値」であれば「小数部分のカット」になるのですが、数値が「マイナス値」だった場合は挙動が違いますので注意してください。 Math.floor(-5.368) //→ -6つまり、Math.floor() は「値を切り下げる」ということです。その

    JavaScriptで小数を整数にするマニアックな方法とその実行速度 | q-Az