タグ

JavaScriptに関するknakamura1977のブックマーク (22)

  • アロー関数式 - JavaScript | MDN

    アロー関数式は、従来の関数式の簡潔な代替構文ですが、意味的な違いや意図的な使用上の制限もあります。 アロー関数自身には this、arguments、super へのバインドがないので、メソッドとして使用することはできません。 アロー関数はコンストラクターとして使用することはできません。 new をつけて呼び出すと TypeError が発生します。 new.target キーワードにアクセスすることもできません。 アロー関数は体内で yield を使用することができず、ジェネレーター関数として作成することもできません。

    アロー関数式 - JavaScript | MDN
    knakamura1977
    knakamura1977 2018/09/26
    オブジェクト内のfunctionは自オブジェクトをthisとして扱うわけではないのか。アロー関数では自オブジェクトをthisと扱えるんだな。ハマった。。
  • Reactを使うとなぜjQueryが要らなくなるのか - Qiita

    はじめに React(通称 React.js1)を全く知らない、あるいは幾つか記事を見たけどなんなのかピンと来ていない、という人のために書いています。 「jQuery くらいしか知らない」くらいの人に具体的に雰囲気を知ってもらうのが目的であり、すでにやる気がある人向けのチュートリアルではありません。やる気が出れば日語版ドキュメントを読んで手を動かせばあっという間なので、そこまでの興味が出ることを目標にしています。 以降では ES2015 (ES6) の文法(アロー関数とか)を使っています。この部分が怪しい人は先にアロー関数と const 文だけでも知ってから先に進んでください。 以下の説明中、このアイコンで表すのは(2023 年現在から見た)『昔話』です。新しく自分のコードを書く際には来知らなくていいことですが、古い記事を見たときに混同しないための参考情報として書いてあります。この記事

    Reactを使うとなぜjQueryが要らなくなるのか - Qiita
    knakamura1977
    knakamura1977 2017/05/30
    jQueryも嫌いじゃないんだが、次React使お。
  • JavaScriptでURIエンコード(URLエンコード)を行う|プログラムメモ

    javaScriptでURIエンコードを行うには -encodeURI -encodeURIComponent -escape の関数を使う事ができる。 この3つの違いはエンコードしない文字に違いがあって ● encodeURI がエンコードしない文字列 ;/?:@&=+$-_!~*.,()a#' ● encodeURIComponent がエンコードしない文字列 -_!~*.()a' ● escape がエンコードしない文字列 *+-_./ となっています。 なので(http://〜)を含むURLをエンコードするには、コロンやスラッシュを変換したい用途、したくない用途によって encodeURIComponent , encodeURI を使い分けるのがいいでしょう。 通常 encodeURIComponent を使うのがいいと思います。 また escape は 全角文字など文字コードが

    knakamura1977
    knakamura1977 2017/02/10
    参考にさせていただいた。
  • JavaScriptのforEach的なものでbreakしたい話 - 車輪を再発明 / koba04の日記

    JavaScriptで毎回forループ書くのは面倒だし、そのためだけにライブラリ使うのもなぁという状態の時についこんなこんな感じの実装をしたりしてしまいます。 でこれだとbreakが出来ないので他のライブラリではどうやっているのかなぁと思ってみたので調べてみました。 ECMAScript5のforEach 下記のような実装になっているためbreakは出来ないです https://developer.mozilla.org/ja/JavaScript/Reference/Global_Objects/Array/forEach someでそのようなことは実装出来るのでそちらを使えということなのかな https://developer.mozilla.org/ja/JavaScript/Reference/Global_Objects/Array/some jQueryのeach ソースを見て

    JavaScriptのforEach的なものでbreakしたい話 - 車輪を再発明 / koba04の日記
    knakamura1977
    knakamura1977 2016/12/18
    breakできないのか。ここにも書いてあるけど、jQueryのforEachはreturn falseでbreakできたので、同じだと思ってた。。
  • 式と演算子 - JavaScript | MDN

    JavaScript チュートリアル 初級編 JavaScript の基礎 JavaScript の第一歩 JavaScript の構成要素 JavaScript オブジェクト入門 JavaScript ガイド 入門編 文法とデータ型 制御フローとエラー処理 ループとイテレーター 関数 式と演算子 数と日付 テキスト処理 正規表現 インデックス付きコレクション キー付きコレクション オブジェクトを利用する Using classes プロミスの使用 JavaScript 型付き配列 イテレーターとジェネレーター メタプログラミング JavaScript モジュール 中級編 クライアントサイド JavaScript フレームワーク クライアントサイド Web API Language overview JavaScript のデータ構造 等値比較と同一性 プロパティの列挙可能性と所有権 クロ

    式と演算子 - JavaScript | MDN
    knakamura1977
    knakamura1977 2016/11/05
    演算子、型の判定ができるやつもあるのか。。知らなかったぞ。。。JavaScript、奥が深いんだよなー。もっと勉強しないと。
  • [jQuery] 属性が存在するかどうかチェックするコード | きほんのき

    jQueryでhtmlタグに任意の属性が存在するかどうかを確認する方法のメモです。チェックボックスがチェックされているかどうかを確認するときなどに役立ちます。 jQueryにはhasClass()というクラスが存在するかどうか調べるメソッドがあります。だから属性の有無を調べるhasAttr()もあるだろうと思い込んでいたのですが無いんですね。つまり以下で紹介するのはhasAttr()を実現する方法でもあります。 <input id='target' type='checkbox'> <script> var attr = $("#target").attr("checked"); if( typeof attr !== 'undefined' && attr !== false ){ //チェックされていた場合の処理 }else{ //チェックされていなかった場合の処理 } </scrip

    knakamura1977
    knakamura1977 2016/11/05
    なるほどー。
  • Javascript:locationオブジェクトでURL情報を取得する | raining

    JavascriptでアクセスしているURL情報を取得する場合、 locationオブジェクトを使用すれば簡単に取得することができます。 URL、ホスト名、アンカーなど色々な情報を取得することができます。 また指定したURLに移動することもできます。 下記にlocationオブジェクトの機能や使用例をメモします。 ■ locationオブジェクトの機能説明 ※下記URLでアクセスした場合 「http://www.hoge.com/location/index.html?aaa=100#test」 「location.href」 現在アクセスしているURLを取得します。 また、指定したURLに遷移します。 ・URLを取得 var url = location.href; alert(url); 【実行結果】 http://www.hoge.com/location/index.html?aa

    knakamura1977
    knakamura1977 2015/03/16
    やりたかったことはpathnameの取得。
  • 【Yosemiteの新機能】JavaScriptでアプリケーションを操作し、面倒な作業を自動化してみた | Goodpatch Blog

    初めまして、ProttのフロントエンドエンジニアのSyoです。よろしくお願いします! 実は皆さんもう既にご存知と思いますが、Mac OS XにはAppleScriptというスクリプト言語があり、システムアプリケーションや一部のサードパーティ製アプリをコントロールすることができます。これより日常中繰り返し同じ操作する所はプログランミングで操作を自動化することができるので大変便利です。ただし、AppleScriptはそれ以外一切使う所がなくて、その為にわざとAppleScriptを勉強するのは非効率ではないでしょうか。 今秋リリースするOS X Yosemiteでは、AppleScriptに加えJavaScriptも利用可能になりました。ということでJavaScriptを少しでもわかる方は、JavaScriptで簡単にMacアプリケーションを操作することが出来るようになりました! Hello

    【Yosemiteの新機能】JavaScriptでアプリケーションを操作し、面倒な作業を自動化してみた | Goodpatch Blog
    knakamura1977
    knakamura1977 2014/10/24
    これは使うことあるかもなぁ。
  • dateformat.js - 日付フォーマット変換ライブラリ

    指定したパターンによるDate->String、String->Dateの変換を行うライブラリです。 ソース Ver 1.1 : 2008/04/02 dateformat.js サンプル 「パターン」を入力し、「フォーマット」ボタンを押下すると、現在時刻を指定パターンによる文字列に変換します。 「パース」ボタンを押下すると、「文字列」を「パターン」に沿ってパースし、Dateオブジェクトに変換します。 使い方 ライブラリを読み込んだ状態で、パターンを指定してDateFormatクラスを生成し、format(Date->String)/parse(String->Date)関数により変換を行います。 var dateFormat = new DateFormat("yyyy/MM/dd HH:mm:ss SSS"); var str = dateFormat.format(new Date

    knakamura1977
    knakamura1977 2014/06/10
    日付フォーマットのMITライセンスライブラリ。
  • EfficientJavaScript - Dev.Opera - 効率的な JavaScript

    EfficientJavaScript - Dev.Opera - 効率的な JavaScript 目次 この文書について 効率的な JavaScript ECMAScript eval や Function のコンストラクタを使うのはやめよう eval を書き換えよう 関数を使いたいなら function を使おう with を使うのはやめよう 性能を決める関数で try-catch-finally を使うのはやめよう eval と with は隔離しよう グローバル変数を使うのはやめよう 暗黙のオブジェクト変換に気をつけよう 性能を決める関数で for-in を使うのはやめよう 文字列は累積スタイルで使おう プリミティブの操作は関数呼び出しより速い setTimeout() や setInterval() には文字列でなく関数を渡そう DOM 再描画と再フロー 再フローの回数をでき

    knakamura1977
    knakamura1977 2014/06/10
    JavaScript、パフォーマンスを考えだすと難しいな。かなりテクニカルな内容。
  • JavaScript: window.open() 小窓の基礎

    window.open()で小窓 いわゆる小窓です。これはJavaScriptの window.open() というメソッドで 小窓となるウィンドウを生成します。 各引数の文字列は一重引用符または二重引用符で括って指定します。 第1引数「URL」は生成されるウィンドウに表示するページのURLです。 ※ ウィンドウに表示するページ(別のファイル)は別途作成して用意しておきます。 第2引数「ウィンドウ名」は特に指定する必要がなければ null で良いでしょう。 ウィンドウ名を指定するときは引用符で括ります。 ※ null を指定するとウィンドウ名の設定されていない新規ウィンドウとなります。 (HTMLの属性 target="_blank" と同等です) 例: window.open('example.html', null); 第3引数「オプション」はウィンドウの特徴を設定する文字列です。 こ

    knakamura1977
    knakamura1977 2013/05/21
    よくまとめられてます。
  • Online JavaScript beautifier

    End script and style with newline? Support e4x/jsx syntax Use comma-first list style? Detect packers and obfuscators? (unsafe) Preserve inline braces/code blocks? Keep array indentation? Break lines on chained methods? Space before conditional: "if(x)" / "if (x)" Unescape printable chars encoded as \xNN or \uNNNN? Use JSLint-happy formatting tweaks? Indent <head> and <body> sections? Keep indentat

    knakamura1977
    knakamura1977 2012/10/11
    JavaScriptの整形ができる!
  • amp; — javascript・jQuery 画像のパスを取得する時の使い分け

    jQueryを使って何か作っているとき、特にDOMの操作などの処理の高速化の為にjavascriptオリジナルのコードを使う事がよくあります。 で、画像のsrcを変更していた際にjavascriptオリジナルとjQueryのメソッドを使った際に取得できる値が違ったのでメモ。 javascript:プロトタイプオブジェクトの値から取得する場合imgオブジェクト.srcで値を使うとhttpから始まる絶対パスで取得出来ます。 //element = <img src="hoge.jpg" /> var src = element.src; alert(src); // http://xxx/xxx/hoge.jpg javascript:getAttribute()メソッドを使う場合。 //element = <img src="hoge.jpg" /> var src = element.ge

    amp; — javascript・jQuery 画像のパスを取得する時の使い分け
    knakamura1977
    knakamura1977 2012/06/02
    取得方法によって取得結果が違うのかぁ。
  • サーバサイドJavaScriptの本命「node.js」の基礎知識

    稿では、Node.jsの特徴や動作原理に触れ、サンプルや役に立つパッケージ、活用事例などを紹介したいと思います。 主なサーバサイドJavaScript Node.jsに触れる前に、予備知識として他のサーバサイドJavaScriptにも触れておきます。Node.js含め、サーバサイドJavaScriptには、主に以下のようなプロジェクトがあります。 サーバサイドJavaScripの標準仕様「CommonJS」とは サーバサイドJavaScriptには、「CommonJS」と呼ばれる標準化が策定されています。標準化というと難しい感じがしますが、要はサーバサイドでJavaScriptを実行するのに何が必要かを仕様として、定義しているドキュメントのことです(例えば、「ログが必要だよね」など)。 Node.jsは、このCommonJSに則って開発されています。現段階であれば、CommonJSの仕様

    サーバサイドJavaScriptの本命「node.js」の基礎知識
    knakamura1977
    knakamura1977 2012/06/02
    簡単にチャットが作れた。
  • location.reload()-JavaScriptリファレンス

    locationオブジェクトのreload()メソッドは、現在表示されているページのリロード(再読み込み)を行います。 一般的なブラウザの[更新]ボタンを押したときと同じ動作です。 location.reload(true)とするとウェブサーバのデータからリロードされ、 location.reload(false)とするとキャッシュからリロードされます。 ■構文・引数・戻り値 構文 location.reload() 引数 true を指定するとウェブサーバのデータからリロードされ、false を指定するとキャッシュからリロードされる(任意) 戻り値 なし HTML + JavaScriptソース <html> <head> <title>location.reload()の使用例</title> <script> setTimeout("location.reload()",5000);

    knakamura1977
    knakamura1977 2012/04/08
    JavaScript楽しい。
  • オブジェクトがnullやundefindでないか評価する。 - うなの日記

    ifで評価すれば一発で判定できます。 if ( !target ) { ... } // 以下のようにはしなくてもいい。 // if ( target == null || target == undefined ) { ... } 値ごとのifでの評価結果は次の表の通り。空文字列や0はfalse扱いなので注意。 値 ifで評価した結果 Object true undefined false null false 0 false 1 true -1 true ""(空文字列) false "a" true 配列 true ハッシュ true 確認してみます。 var stdout = document.getElementById("stdout"); // オブジェクト / null, undefind は false stdout.innerHTML += "null is " + (

    オブジェクトがnullやundefindでないか評価する。 - うなの日記
    knakamura1977
    knakamura1977 2012/04/08
    参考になりました♪
  • masahirorの気まま記録簿 - FireFoxでJavascript「window.close()」を使うには

    昨日今日とWebでアンケート入力するASPを作成。その中で、アンケートが終了したら「閉じる」ボタンが表示され、クリックするとウインドウを閉じるというレイアウトにしたかったので、一般的なJavascriptを使った「windows.close();」を利用した。 【ボタンの場合】 <input type=button value=ウインドウを閉じる onclick="window.close()">【リンクの場合】 <A HREF="#" onClick="window.close()">ウインドウを閉じる</A> または <A HREF="javascript:window.close()">ウインドウを閉じる</A>この方法でばっちり!・・・と思っていたら、IEだと問題なく動作するが、FireFoxでは動作しないとの指摘があった。確かにFireFoxでは動作しない。テスト環境はWindo

    masahirorの気まま記録簿 - FireFoxでJavascript「window.close()」を使うには
    knakamura1977
    knakamura1977 2012/04/05
    Firefoxだけかぁ。。勉強になった。
  • JavaScript インラインフレーム(iframe)関連 - とみぞーノート

    iframeのwindow,documentの取得方法はIEとMozilla系(NN,FireFox)で異なる。 IEはframes配列のwindow,documentプロパティから取得できる。Mozilla系はiframeエレメントのcontentWindow,contentDocumentプロパティから取得できる。 IEでもMozilla系と同じくiframeエレメントのプロパティから取得することもできるが、contentDocumentについてはIEには存在しないので、documentはcontentWindow.documentとしてcontentWindow経由で取得しなければならない。 iframeエレメントのcontentWindow,contentDocumentプロパティから取得する iframe = document.getElementById(id); // ifr

    knakamura1977
    knakamura1977 2012/04/04
    めっちゃ詳しい。
  • window.name - Enjoy*Study

    このままだとwindow.nameが可愛そうな気がしたので、出来る限りのフォローを。(コメントだと書ききれないので、エントリにさせていただきました) これは脆弱性かな? - でっていうぶろぐ@hatena window.name(グローバルなスコープだとthis.nameも同じ)は、名前のとおりそのままウインドウの名前を表すものであり、ページ遷移したとしてもウインドウ自体が変わるものではないので、クリアされないことに(今は)違和感はありません。(初めて知ったときはびっくりしました) 逆にクリアされてしまったら、何かと弊害がありそうな気がしてます。 まず、、window.nameは、どういったときに設定されるかっていうと、アンカーやフォームでtargetを指定してURLを開くと、開いたウインドウのwindow.nameはtargetで指定した名前が設定されます。(ただし、_blank を指定

    window.name - Enjoy*Study
    knakamura1977
    knakamura1977 2012/04/04
    window.name取得。
  • HTMLの表示/非表示を切り替える2つの方法 [ホームページ作成] All About

    HTMLの表示/非表示を切り替える2つの方法HTML内の特定の要素について表示/非表示を切り替えたい場合は、JavaScriptを使って当該要素のスタイルを変化させれば簡単です。ある要素の表示/非表示を切り替えるには、displayプロパティの値を変更する方法と、visibilityプロパティの値を変更する方法があります。ボタンのクリックで動作するサンプルを使って、画像の表示/非表示を動的に切り替える処理の書き方をご紹介。 HTMLで作った特定箇所の表示/非表示を切り替える方法 JavaScriptを使ってスタイルを変化させれば、HTMLで作成した任意の要素の表示/非表示状態を動的に切り替えられます。その際、指定要素の表示/非表示を切り替える目的で使えるスタイルには、displayプロパティとvisibilityプロパティの2種類があります。どちらを使っても表示/非表示を切り替えられますが

    HTMLの表示/非表示を切り替える2つの方法 [ホームページ作成] All About
    knakamura1977
    knakamura1977 2012/04/04
    JavaScriptで表示非表示制御。