知らないうちにopencvがjavascriptでも使えるようになっていた。 加えてopencv自体もいつのまにかバージョンが上がって4.4.0になっていた。 ブラウザで簡単に画像処理ができるのは極めて便利。 試してみる。
opencv.js 4.4.0 を使ってブラウザ上で画像処理
知らないうちにopencvがjavascriptでも使えるようになっていた。 加えてopencv自体もいつのまにかバージョンが上がって4.4.0になっていた。 ブラウザで簡単に画像処理ができるのは極めて便利。 試してみる。
4/5 JavaScriptを実行して出力されたHTMLソースを見る方法 [ホームページ作成] All About
JavaScriptを実行して出力されたHTMLソースを見る方法(4ページ目)JavaScriptが実行された結果として、どのような文字列やHTMLソースが出力されているのかを確認する方法を解説。ブラウザの「ソースを表示」機能では単にJavaScriptのソースコードが見えるだけです。そうではなく、関数が処理された結果としてブラウザに出力されるHTML要素などの値を見たりファイルに保存したりする操作例をご紹介いたします。 JavaScriptを実行して出力されたHTMLソースを見る方法：Chrome版 次に、Chromeでの操作方法をご紹介いたします。下図はすべてChromeの画面ですが、Operaでもほぼ同様に操作できます。例示に使っているサンプルページや他のブラウザに関しては、本記事の1ページ目をご覧下さい。 【Chrome版の目次】 JavaScriptを実行して出力されたHTMLソ
![4/5 JavaScriptを実行して出力されたHTMLソースを見る方法 [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/40e1f4046c7d718bb6e42ca478c73770dc538138/height=288;version=1;width=512/https%3A%2F%2Fimgcp.aacdn.jp%2Fimg-a%2F1200%2F900%2Faa%2Fgm%2Farticle%2F4%2F5%2F9%2F3%2F6%2F9%2F201510241419%2Ftopimg_original.png)
【Javascript】new Array()で配列を定義する時は最大数に注意
先日、とある案件で他のベンダさんが書いたプログラムを検証する機会がありました。 そのお客さんによると、最初は動いていたが、ある日突然動かなくなったとのこと。 調べてみると、Chromeでどうも以下のようなエラーが出ています。 なんだ？と思って当該行を見てみると以下のようになっていました（ちなみに今回はjavascriptです）。 var data = new Array( '100', '200', ・・・ // 以降何万行と続く ); for(var i = 0; i < data.length; i++){ // ←data.lengthを参照すると怒られる // 処理 } へーと思って、とりあえず配列の要素数を減らしていくと、ちょうど41,912個のところでエラーが発生することがわかりました（chromeの場合）。 なので、chromeの場合、new Array()で配列を初期化する
Regex Tester – RegexPal
RegexPal is a tool to learn, build, & test Regular Expressions (RegEx / RegExp). Results update in real-time as you type. Roll over a match or expression for details. Save & share expressions with others. Explore the Library for help & examples. Undo & Redo with {{getCtrlKey()}}-Z / Y. Search for & rate Community patterns.
正規表現を理解してみる - Qiita
はじめに これは、静岡 Advent Calendar 2019の3日目の記事となります。 今年は勉強会には2019/1/26(土)に「DevLOVE静岡」しか参加していないので勉強会のことは書きにくい。 一応、Qiitaは技術系ブログなので静岡にまつわる(名産品や地名など)なら何でもいいかなと、ネタとして2012年に静岡Developers勉強会で「JavaScriptの正規表現」のセッションを引っ張り出して、これをQiita用に書き直してみました。 正規表現ってなに？ 正規表現とは、簡単に言えば 検索や置換をより便利にするものです。 例えば文章中に 「りんご」 と 「みかん」 を検索したいとき、別々に検索するのは手間だし面倒です。 正規表現で検索に使うキーワードを以下のように書くと
[JavaScript] 画面の再描画を待つ・画面を強制的に再描画する - Qiita
WEB ブラウザ上での JavaScript で時間のかかる計算処理をするとき、直前で DOM の内容を変更してもすぐに画面に反映されないことがあります。 (理由に関しては少しややこしいため、本記事では不説明。) 従来の対処法として setTimeout() で delay を 0 にするというものがありますが、ブラウザや状況によって思い通りに動作しないことがあります。 本記事では他の方法を書きます。 1. 結論: requestAnimationFrame() を 2 回呼ぶ const repaint = async () => { for (let i = 0; i < 2; i++) { await new Promise(resolve => requestAnimationFrame(resolve)); } };
![[JavaScript] 画面の再描画を待つ・画面を強制的に再描画する - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/8bfad624678a634c881c2739ba535aadc6dfeb71/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-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCSmF2YVNjcmlwdCU1RCUyMCVFNyU5NCVCQiVFOSU5RCVBMiVFMyU4MSVBRSVFNSU4NiU4RCVFNiU4RiU4RiVFNyU5NCVCQiVFMyU4MiU5MiVFNSVCRSU4NSVFMyU4MSVBNCVFMyU4MyVCQiVFNyU5NCVCQiVFOSU5RCVBMiVFMyU4MiU5MiVFNSVCQyVCNyVFNSU4OCVCNiVFNyU5QSU4NCVFMyU4MSVBQiVFNSU4NiU4RCVFNiU4RiU4RiVFNyU5NCVCQiVFMyU4MSU5OSVFMyU4MiU4QiZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9MTRlZDFlYjViNjViYzBhMzY0ODZlNDBlZjE2MDcxZWU%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBrZXJ1cGFuaTEyOSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9OWI1ZWFhZDlkNzhkMmJiNDNlZGU1MTFhNWE5MDNiMzA%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D2b924305035b9ad0322ced0bd5e7f04d)
javascriptで小数点以下の桁数を指定して表示する
たとえば 4.2532787 といった数値を 4.25 と小数点2桁までで表示したい。 というときに、javascriptではどうしたらいいのかな。 Number – JavaScript | MDN toFixed – JavaScript | MDN toFixed(桁数) とすれば、その桁にあうように四捨五入した文字列を返してくれる。 var n = 12345.6789; n.toFixed(); // 12346 を返します。: 近似値で表現され、小数部がないことに注意してください。 n.toFixed(1); // 12345.7 を返します。: 近似値で表現されていることに注意してください。 n.toFixed(6); // 12345.678900: 0 を加えていることに注意してください。 (1.23e+20).toFixed(2); // 123000000000000
数字を指定した桁数まで0埋めする | GRAYCODE JavaScript
数字を指定した桁数になるまで「0」で埋める方法について解説します。 この記事のポイント 指定した桁数まで0埋めする方法はpadStartメソッドを使う方法とsliceメソッドを使う方法の2種類 0以外の文字で埋めることもできる 数字を0埋めした桁数にする JavaScriptで日付を扱うときなどに、日付などの1桁の「月」や「日」を「04月01日」のように0埋めした2桁の数字にする方法を解説します。 以下のコード例ではパターン1はpadStartメソッドを使う方法、パターン2はsliceメソッドを使う方法になります。 いずれも0で埋めた任意の桁数の数字を取得できるため、使いやすい方法を選択してください。 値の型については、数値（Number）のままでは0埋めすることができないため、上記のいずれの方法も文字列（String）に変換しています。 パターン1：padStartメソッドを使って0埋め
kuromojiを使ったJavaScriptだけの形態素解析 - Qiita
はじめに 形態素解析というと、Pythonを使ってmecabというのが鉄板でしょうかね。辞書はneologdで。 でもほかの環境でも形態素解析したい場面があり、今回はJavaScriptでやってみるお話です。使うライブラリはkuromojiのJavaScript版。 ちなみに、mecabもneologdもkuromojiも、更新が止まっています。mecabは、2013/02/18 MeCab 0.996 が最新、neologdは2020/08/20 v0.0.7が最新、kuromojiは2018/11/24が最終更新日です。（2022/5/28時点） 最新の単語に対応していない等の問題が出る可能性がありますので、ご使用の際にはちょっとご注意ください。 作ったもの 動くものを置いておきます。公式のデモとほぼ同じですが、自分で文章を作れるのがほしかった。 ソースはgithubに置いておきます。
javascriptでURL先が存在しているか確認する方法 - Bluebear I/O: 技術備忘録
javascriptを使用してURL先が存在しているか確認する方法は以下の通り function load(_url){ var xhr; xhr = new XMLHttpRequest(); xhr.open("HEAD", _url,false); xhr.send(null); return xhr.status; } var url = "https://www.example.com/xxxxxx"; if(load(url) == 200){ //処理 } XMLHttpRequestを利用して返り値が200であるかを確認している 実行すると非同期のXMLHttpRequestは非推奨と出てくるが、同期モードにすると200が返る前に処理が進むので非同期で実行する必要がある
【JS】undefinedについてまとめみた！
undefinedとは undefiendは、「未定義」である事を示す値です。 undefinedになるケース 以下がundefinedになるケースです。 初期化されていない変数の値 オブジェクトに指定されていないキーの呼び出し 関数のreturnを書かなかった場合の戻り値 引数のある関数を呼び出すときに引数を与えなかった場合の値 以下がコードになります。 Javascriptを実行出来る環境で試してみてください！！ // 初期化されていない変数の値 let testUndefined; console.log(testUndefined); // undefined // オブジェクトに指定されていないキーの呼び出し const test = {}; console.log(test.name); // undefined // 関数の`return`を書かなかった場合の戻り値 func
Javascriptって2次元の連想配列できないの？ « ウップス!!なかわけ
こんにちは、なかわけです。 今日仕事中にJavascriptにハメられたことをメモ。 メモしておけば同じ過ちをしないと思ったので。 2次元の連想配列が作りたくで以下のように書きました。 //TypeA TypeA = {}; TypeA['hoge']['fuga'] = 'piyo'; alert(TypeA['hoge']['fuga']); こうすると、alertはでないし、なかわけの環境ではスクリプトエラーも出ませんでした。 おかしいなあと思って、その時はとりあえず1次元の連想配列でやり過ごしました。 お家帰って思いつきました。 TypeA = {}; はObjectであっても、 TypeA['hoge'] はObjectではないのでfugaプロパティが追加できない（配列的に扱えない）！ てことで、以下 //TypeB TypeB = {}; TypeB['hoge'] = {fu
【JavaScript入門】sort()による配列・文字列・オブジェクトのソート方法 | 侍エンジニアブログ
今回は、JavaScriptで数値や文字列などを昇順・降順で並び替えることができる「sort()」メソッドについて学習していきましょう！ sort()とは？ sort()は、JavaScriptで並び替えを実現するメソッドになります。文字列順や数字の大小などによる昇順・降順で対象の値を並び替えることができるようになるので、データの操作などでよく使われます。 また、配列に格納されたバラバラの値やオブジェクトのキー（プロパティ）を対象にして並び替えることも可能なので、活用範囲はとても広いと言えます。 ただし、sort()は元の配列データを変更してしまう破壊的メソッドでもある点には注意が必要です。本記事ではこのような注意点も含めて基本から応用まで解説していきますので、ぜひ参考にしてみてください！ 文字列の「sort()」について この章では、文字列が格納された配列のソート方法について見ていきまし
JavaScriptのtry~catch文で例外処理をする方法 - TECH PLAY Magazine
try~catch文はJavaScriptにおける例外処理が記述できます。例外処理とは何なのか？どのような場面で使うのか？といった基本の知識から、実際の記述方法などについて、コードの実例とともに例外処理を初めて学習する初心者にもわかりやすいように解説していきます。 プログラムを実行する際にエラー（例外）が起こることがあります。通常はエラーが起こった際、そこでプログラムは止まります。しかし、実際の場面ではエラーが起こってもプログラムに止まって欲しくない場合もあります。そんな時に使えるのがtry~catch文です。 今回はJavaScriptでの例外処理に利用されるtry~catch文について、概要や使い方、デバッグに使用する方法などについて解説していきます。 JavaScriptで例外処理をおこなうtry~catch文とは try~catch文を使うことで、例外処理を記述できます。 例外処理
配列の最大値を取得する ES2015版 - 30歳からのプログラミング
JavaScriptで、配列の最大値を取得する方法について。 最初に答えを書いておくと、Math.max(...targetArray)。 旧来はapplyを使うのが主流だった？ Math.max()を使うと、数値の中から最大のものを取得できる。 Math.max(6, 8, 9, 7); // 9 しかしこれは、一つずつ数を渡す必要があり、配列を渡すことは出来ない。 配列でMath.max()を使うにはどうすればいいのか。 applyを使えば解決する。 const array = [3, 8, 7, 2, 5]; Math.max.apply(null, array); // 8 applyの第二引数には配列を渡して使うが、この配列の要素が1つずつ引数として渡される。 そのため、配列を展開してそれを引数として渡す手段として、applyが有用なのだ。 このテクニックは有名らしく、Math.
【Javascript】スマホ・タブレット・PCをユーザーエージェント判定で判別する方法
「このJavascriptの指定はPCの場合のみ利用できるようにしたい。」、「この指定はスマートフォンでのみ使用できるようにした。」など、スマートフォン、タブレット、PC、それぞれの端末に対して実行するJavascriptを限定したり、変更していといったことがよくあると思います。 そこで、今回はJavascriptを使って、ユーザーエージェントを判別し、スマートフォン、タブレット、PC、それぞれに条件分岐して、Javascriptを指定する方法をご紹介いたします。
動画を指定した時間から再生させるHTMLとJavaScript
保存した動画を再生させるページを作る必要があって、リンクを押すと指定した秒数から再生するようにしたい、と思ってしまい作ってみました。 2度と作れる気がしないので、備忘ログとして残しておこうと思います。 できあがるページの画面イメージはこんな感じです。何も装飾していないからダサいですが、僕が全能力使って装飾しても、カッコよくなることはありません。とても残念です。。 実際に使うときには、第○○章 旅立ち みたいな章立てを書くとは思うのですよ。 00：10というリンクを押すと再生時間10秒のところから始まります 20秒から始まります。はい。それだけです。恥ずかしいです。 こちらがHTMLです。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=de
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
break - JavaScript | MDN
JavaScriptを高速化するFacebook製Prepackを試してみた - Qiita
js/jqueryで指定したURLのステータスコードを取得したい