FileReader - Web API | MDN
File APIFileReaderコンストラクターFileReader()インスタンスプロパティerrorreadyStateresultインスタンスメソッドabort()readAsArrayBuffer()readAsBinaryString() 非推奨 readAsDataURL()readAsText()イベントaborterrorloadloadendloadstartprogress継承EventTargetFile API に関連するページBlobFileFileListFileReaderSync FileReader オブジェクトを使用すると、ウェブアプリケーションは、ユーザーのコンピューターに保存されているファイル（または生のデータバッファー）の内容を非同期に読み取ることができます。File または Blob オブジェクトを使用して、読み込むファイルまたはデータを指定
File - Web API | MDN
File.prototype.lastModified 読取専用 ファイルの最終更新時刻を、 UNIX 元期 (1970 年 1 月 1 日深夜) からの経過ミリ秒数で返します。 File.prototype.lastModifiedDate 非推奨 読取専用 Non-standard File オブジェクトが参照しているファイルの最終更新時刻の Date を返します。 File.prototype.name 読取専用 File オブジェクトが参照しているファイルの名前を返します。 File.prototype.webkitRelativePath 読取専用 File の URL の相対パスを返します。 File は Blob を実装しているので、以下のようなプロパティも利用できます。 Blob.size 読取専用 ファイルのサイズをバイト単位で返します。 File.prototype.t
改行コード、¥r¥nや¥nに対応したsplit方法
こんにちは。 JavaScriptで、シンプルな自分用のライブラリを作っています。 コンパイル系の言語はよく使えるのですが、JavaScriptはまだ経験が浅いです。 改行で区切られた文字列に関する処理を行いたいと思っています。 (名前が適切かどうかはともかくとしまして) var doc = new Document(改行含む文字列); このような記述で、インスタンスを作り、行ごとにアクセスできるようなものを作りたいのです。doc.getLine(i)とか、doc.setLine(i)とか。 このときに、¥r、¥n、¥r¥nの全ての改行コードに対応したいなと思っています。 ¥r¥nは1行の空行、¥n¥rは2行の空行として扱いたいです。 例えば、ですが文字列が、次のようなものの場合 '0123¥r456¥n789¥r¥n0123¥r¥r456¥n¥n789¥r¥n¥r¥n0123¥n¥r¥n
JavaScriptでファイル操作！？ File APIを使いこなそう
連載目次 近年のWebアプリケーションでは、画像ファイルやテキスト・ファイル、Officeファイルのアップロードやダウンロードのやり取りが行われることが多くなってきている（例えば、Twitter上での画像ファイル共有やGoogleドキュメントでのOfficeファイルのアップロードなどがそれだ）。 HTML5では、ファイル操作に関するAPIとして「File API」が定義されたことで、ローカルのファイルをブラウザ上で直接、取り扱うことが可能となった。これによって、Webとローカルの違いをアプリケーションで意識しなければならない局面も少なくなる。 現在、File APIは以下の3種類の仕様が策定されている。
新QiitaでReactをやめてhyperappを採用した背景 - Qiita
12/1 に Qiita のトップページをリニューアルしました。これまで React を使っていましたが、それをやめて hyperapp を採用しました。まわりを見てもあまり採用事例が見当たらないので、この記事では一体なんで今をときめく React ではなく hyperapp を選択したのか、どういうところが魅力的なのかについて プレゼンテーション層を実装するためのツールとして 学習コスト の観点から書きたいと思います。なおこの記事に書かれていることは全て個人の感想であり、はっきりいって個人の日記レベルです。 それと hyperapp の開発者が社内にいるという事情もあるので、そこら辺さっぴいて読んでください。 TL;DR プレゼンテーション層を実装するためのツールとして React は機能過多だし、機能不足 hyperapp は過不足ない 学習コスト 仮想 DOM は学ぶ価値のある知識
[JavaScript]CryptoJSでAES暗号のsaltとパスフレーズからkeyを求める - Qiita
CryptoJSはクライアントサイドで暗号化や復号化ができる。 AESの鍵長は128bit以上だが、128bitより短いパスフレーズでもCryptoJSなら暗号化できる。 正確にはパスフレーズとsaltから鍵を内部で生成している。 var encrypted = CryptoJS.AES.encrypt('message', 'pass'); console.log(encrypted.salt.toString()); // 467c08b2364309e8 console.log(encrypted.key.toString()); // 6e475a9672994638c4231bd750ab7aceeb9004229f0a26c3622a2045deb789e9 上記のスクリプトのencrypted.keyが実際に使用される鍵である。 AESで暗号化したデータを復号化するときに進捗
![[JavaScript]CryptoJSでAES暗号のsaltとパスフレーズからkeyを求める - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/ce14c10dbc35be188860696250756be865abf254/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JTVCSmF2YVNjcmlwdCU1RENyeXB0b0pTJUUzJTgxJUE3QUVTJUU2JTlBJTk3JUU1JThGJUI3JUUzJTgxJUFFc2FsdCVFMyU4MSVBOCVFMyU4MyU5MSVFMyU4MiVCOSVFMyU4MyU5NSVFMyU4MyVBQyVFMyU4MyVCQyVFMyU4MiVCQSVFMyU4MSU4QiVFMyU4MiU4OWtleSVFMyU4MiU5MiVFNiVCMSU4MiVFMyU4MiU4MSVFMyU4MiU4QiZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9OWFhY2YyZDY3MWJhZjU3ZDFjMWFmODQzZjJhZjVmY2Q%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQweWFlZ2FraSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9OWM5ZTY0ZDJkNDE2MjJlMTg2ZDI3YmM0YTlmNDg3NmQ%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D63cc819dec2ac7b8811c55e5ae32bf5e)
JavaScriptでCryptoJSを使って、AESの暗号化と復号を行う | 開発などブログ | HiBARA SOFTWARE
ウェブサイトを見回してみても、正しく実装されていなかったり、良いサンプルが無かったので、記事にしてみました。 → DEMO＆ソースコード：https://jsfiddle.net/hibara/qzono8jb/ CryptJSについては、以下にあります。 https://code.google.com/archive/p/crypto-js/ 暗号化するにあたって CryptJSの本題に入る前に、少し暗号化についてのお作法を知っておく必要があります。詳細は僕が書いた、別記事の「Visual Studio C#でファイルを暗号化してみる」を参照していただきたいですが、一応ざっとおさらい。 暗号化モードではCBCモードを使うのがベター ブロック暗号方式と呼ばれるものは、その名のとおり、何バイトかずつブロック単位で暗号化していきますが、ここでやりがちなのがECBモードでしょうか。 これの何が問
Johnny-Five: The JavaScript Robotics & IoT Platform
Johnny-Five is the JavaScript Robotics & IoT Platform. Originally created by Rick Waldron in 2012, Johnny-Five is maintained by a community of passionate software developers and hardware engineers. Over 75 developers have made contributions towards building a robust, extensible and composable ecosystem. The Johnny-Five Inventor's Kit: The only kit designed for getting started with Johnny-Five! The
リアクティブプログラミングとは何だったのか - Qiita
※この記事はずいぶん内容がわかりづらかったようで、さまざまな反応を頂きました。追記が複数ありますので、併せてご覧ください。 TL;DR Version: リアクティブプログラミングに挑戦しようとした。がっかりした。 はじめに 私のこの記事は「【翻訳】あなたが求めていたリアクティブプログラミング入門」に触発されて？書かれたもので、そちらの元ネタの記事に先に目を通しておいたほうが理解がしやすいと思います。そちらの記事は本当に解説がわかりやすく、そして何よりとても説明が具体的なので、リアクティブプログラミングについて知りたいかたには大変おすすめです。リアクティブプログラミングの解説には、漠然としたことしか言っておらずさっぱり参考にならないものも多いのですが、いや本当に多いのですが、この元ネタの記事では図表が適切に使われているだけでなく具体的な問題提起と具体的なコードによる解決策が示されており、リ
【翻訳】あなたが求めていたリアクティブプログラミング入門 - ninjinkun's diary
original: The introduction to Reactive Programming you've been missing (by @andrestaltz) (translated by @ninjinkun, reviewed by @ma0e) あなたはリアクティブプログラミングと呼ばれる新しい方法が気になっている。 勉強するのは大変で、良い教材がないのでさらに難しい。私が勉強を始めたときは、まずチュートリアルを探した。見つけたのは一握りの実践的なガイドだけ、しかもそれらは表面をなぞっているだけで、リアクティブプログラミングのアーキテクチャ全体像を構築しようとしてはいなかった。ある関数を理解するのに、ライブラリのドキュメントは役に立たないことがある。 これを見て欲しい。 Rx.Observable.prototype.flatMapLatest(selector,
出来る限り短く説明するReactJS入門 - Qiita
VTeacher 所属の Masaki Suzuki です。 ※各項目をできるだけ3行以内にまとめています デザイナーさんやフロントのエンジニアさん向けのReact.js（リアクトジェーエス）入門です。 「最近、『リアクト』と聞くけど、つまり何？」ってひとが対象です。 React.jsとは React.jsはUIのパーツ（構成部品）を作るためのライブラリです。 FacebookがOSSとして公開しています。 初回投稿日：2015年06月21日 この投稿はReactが話題になり始めた頃（6年前のv0.1の頃）、整理した記事です。 最新情報はこちら React Server Components 2021年からReactを始めるなら React Server Components 一択ではないか？ https://zenn.dev/rgbkids/articles/e58ef9b947b199
DOMイベントのキャプチャ/バブリングを整理する 〜 JSおくのほそ道 #017 - Qiita
こんにちは、ほそ道です。 今回はDOMネタです。 イベントのキャプチャとバブリングについて覚書をまとめて参ります。 また今回はv8での検証であり、レガシーなIEは対象外です。 レガシーなIEはイベント設定メソッド自体が違いますのでご注意くださいませ。 目次はこちら 入れ子なDOMのイベント発生順序制御 DOMが入れ子構造になっていてそれぞれにイベント(例えばClickイベント)が設定されていた場合 「このように動いてほしい」という期待はケースバイケースであると思います。 期待通りの処理になるようカッチリ制御しちゃいましょう。 addEventListenerの第三引数「useCapture」 例えば下記の様なHTMLがあったとします。 body内にdivが入れ子になっておりそれぞれにClickイベントが登録されています。 <html> <head lang="en"> <meta char
ECMAScript6にシンボルができた理由
ECMAScript6 (ES6, ES2015) で導入された新機能の大半は、読めば便利さが想像くらいはできるけど、自分にとってしばらく訳がわからなかった新機能が「シンボル」（MDNのリファレンス）。これまで文字列だけで上手くやってきたJavaScriptに、急になぜこんなものが導入されたの？ イマイチ分からなかったので、調べたことのまとめ。 シンボルの簡単なおさらい 知ってる人は読み飛ばし推奨。詳しく見たい人は、こことかの他のページを参照。 ES6で導入された、 Symbol() で作成できる特殊な値。 Symbol() は、 typeof すると 'number' でも 'string' でも 'object' でもなくて 'symbol' となる、まったく新しいタイプのプリミティブ値を生成する。 一旦作ったシンボルは、それ自身とのみ等しくなる、ユニークなIDとして機能する。 ===
旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section5 ～ES2015文法を覚えよう(前編)～ - Qiita
はじめに この記事は「旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門」の5つ目の記事です。 シリーズの最初から読みたい方は 旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section1 ～すぐにでも現代っぽく出来るワンポイントまとめ～ へどうぞ。 また、このシリーズではECMAScript5を概ね対応するブラウザを対象としています。 もっと平たくいうと、IE8以下は切り捨てます。ご了承ください。 このシリーズを通して、原則として厳密さよりも分かりやすさを優先するためこのようにします。予めご了承ください。 目次 Section1 ～すぐにでも現代っぽく出来るワンポイントまとめ～ Section2 ～CommonJSモジュールと仲良くなろう～ Section3 ～Browserifyをマスターしよう～ Se
旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section3 ～Browserifyをマスターしよう～ - Qiita
はじめに この記事は「旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門」の3つ目の記事です。 シリーズの最初から読みたい方は 旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section1 ～すぐにでも現代っぽく出来るワンポイントまとめ～ へどうぞ。 また、このシリーズではECMAScript5を概ね対応するブラウザを対象としています。 もっと平たくいうと、IE8以下は切り捨てます。ご了承ください。 そしてプロによるマサカリ 対策として一つ重要な注意書きをします。 この記事中で出てくる「CommonJSモジュール」という表現は全て「CommonJSのModules 1.0仕様をベースとして、Node.jsが独自に拡張したCommonJS派生のモジュール仕様及びインターフェース(require/exports
旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section2 ～CommonJSモジュールと仲良くなろう～ - Qiita
はじめに この記事は「旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門」の2つ目の記事です。 シリーズの最初から読みたい方は 旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section1 ～すぐにでも現代っぽく出来るワンポイントまとめ～ へどうぞ。 また、このシリーズではECMAScript5を概ね対応するブラウザを対象としています。 もっと平たくいうと、IE8以下は切り捨てます。ご了承ください。 そしてプロによるマサカリ 対策として一つ重要な注意書きをします。 この記事中で出てくる「CommonJSモジュール」という表現は全て「CommonJSのModules 1.0仕様をベースとして、Node.jsが独自に拡張したCommonJS派生のモジュール仕様及びインターフェース(require/exports
旧石器時代のJavaScriptを書いてる各位に告ぐ、現代的なJavaScript超入門 Section1 ～すぐにでも現代っぽく出来るワンポイントまとめ～ - Qiita
はじめに ネットには様々な情報が溢れており、JavaScriptに関する情報も多数存在しております。 その中には、「今時こんな書き方しねえよ…」と思わずツッコミを入れたくなるような、本当に、本当に古い内容について書かれている古文書も存在します。 そんな罠記事の情報に囚われてしまって、いつまで経っても現代的なJavaScriptが書けない皆さんのために、このシリーズの記事では、各セクション毎に分けて、旧石器時代の記述と、現代の記述を紹介する形で、文明開化をしていきたいという思いで記述する。 最初は、現在比較的メジャーなブラウザで一通り動作する「ECMAScript 5」までの内容に関してポエムを書き連ねていき、最終的には一連の内容を読むだけで「ES6(ES2015)」による新機能や、絶賛提案中の「ES7」の一部提案内容についても把握し、おおよそ現代人を育成することを目標とする。 …なんてめっ
jslinuxで遊んでみる - file-glob こと k.daibaの日記
はじめに javascriptでlinuxが動くjslinuxが公開されて1ヶ月が経ちました．人の噂も75日とはよく言ったもので，すでに話題にもあがらなくなってきましたね．多少新鮮度は落ちたとはいえ，面白い物は面白いってことで，ちょっと遊んでみることにしました． でっかくしてみる 小飼さんのブログでjslinuxと戯れる方法がでています．ここにも書いてあるんですが，デフォルトのkernelではroot.binのサイズを4096KBより大きくすることができません．そこで，倍のサイズのroot.binを動かすことを目標に試してみることにしました．まずは必要なリソースを集めます．小飼さんがブログを書いた時期からjslinuxはバージョンアップしているので，以下のファイルをローカルに落とします．例として~/jslinux/htdocs/配下に置くものとします． index.html cpux86-
【JavaScript】 文字列切り出し（slice, substr, substring）の違い - のんびり猫プログラマの日常
引っ越し前のサイトから移植しました。 文字列の切り出しっていつも迷うよね。 実際にスクリプトを動かして確認してみよう。 slice 文字列.slice(開始位置 [,終了位置] ) 開始位置と終了位置を指定。終了位置は省略可能。 省略すると最後まで切り出す。 終了位置は、末尾が0になる。 開始位置をマイナス値にすると、後からの桁数になる（右端のみ切り出せる）。 <例> str.slice(3); //"3456789" str.slice(-2); //"89" str.slice(3, -1)); //"345678" var str = "0123456789"; str.slice( , ); strの内容 : 結果 substr 文字列.substr(開始位置 [,切り出す長さ] ) 開始位置と切り出す長さを指定。長さは省略可能。 省略すると最後まで切り出す。 開始位置をマイナス値
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
PureScript使ってみた - Qiita
