PHPからJavaScriptにデータを受け渡すときに考えること - Qiita
PHPのstringは任意のバイト列を扱えますが、JavaScript/JSONはUnicodeで扱える文字しか扱えません PHPのint / floatはプラットフォーム依存ですが、JavaScriptのnumberは整数と小数を型レベルで区別しません JSONのarrayに対応する型はPHPのarrayのうちリストであるものです PHPは配列(リスト)と連想配列を型レベルで区別せず、どちらもarrayです リストはキーが0からの抜けがない連番になっている要素が0個以上の配列です array_is_list()関数で連想配列とリストを判別できます array_values()で連想配列をリストに変換できます array_filter()の結果はフィルタされたキーがスキップされるのでリストではありませんが、結果をarray_values()に通すことでリストにできます JsonSerial
【JavaScript】var / let / const を本気で使い分けてみた - Qiita
再宣言 一度宣言した変数を、同じ変数名で宣言し直すことを再宣言といいます。 再宣言可能なvarで再宣言した場合、後に宣言した変数が適用され、 再宣言不可能なlet/constで再宣言した場合、エラーになります。 varでは、予期しない再宣言が起こりうるため危険です。 // var var a = 0; var a = 1; console.log(a) // `1`と出力される // let let b = 0; let b = 1; // SyntaxError: Identifier 'b' has already been declared // const const c = 0; const c = 1; // SyntaxError: Identifier 'c' has already been declared
<script> タグに async / defer を付けた場合のタイミング - Qiita
HTML5 においては、<script> タグに、defer や async 属性を付与することで、これらの読込が HTML パースを妨害しないようにすることができます。これにより、サイトのメインコンテンツの読込がある程度高速化されます。 async にせよ defer にせよ、それほど詳細に動作を解説した記事が見つかりませんでしたので、本記事では、これらの動作について解説します。 イベントについて まずは、async と defer の挙動を理解するために重要な、2つのイベントについて理解しましょう。 両者とも、MDN に十分な情報があるため、本記事ではそれほど詳細には解説しません。 DOMContentLoaded HTML のパースが完了した直後に発火します。 MDN load HTML のパースが完了し、CSS や画像などのダウンロードと表示、JavaScript ファイルのダウン
10行ぷよぷよのソースコードを読む - Qiita
プログラマをする上では10行程度のプログラムを読めるといいとのこと。上記記事のブックマークコメントから飛んで10行ぷよぷよなるものを目にしたので、ソースコードを解読してみました。 解説記事を探したのですが、見当たらなかったので書いてみてます。 10行ぷよぷよについて javascriptで動くぷよぷよです。 開発者のPascalさんのサイトはもう残っていないとのことで、下記からソースを拝借しました。 実行すると、一人用のとことんぷよぷよが遊べます。 そのまま実行しても怒られるので、後述しますがちょっとだけ手を加えてます。 ソースコード ソースコードは以下です。 <body onKeyDown=K=event.keyCode-38 id=D><script>for(M=N=[i=113];--i;M[i-1]=i%8< 2|i<8)function Y(){e++;if(e%=10)for(
Underscore.jsの使い方入門 - Qiita
#Underscore.jsとは？ ##概要 ざっくり言うと、JavaScriptの便利なライブラリ群で、Underscore.jsを使うとフロント側で大量のデータ処理をする際に、よく使うロジックをとても簡単に書くことができます。 paizaのプログラミングスキルチェックに出てくるような、難しい配列処理のプログラムを書くときにUnderscore.jsを使うと、難しいアルゴリズムを組まずに、ライブラリを呼び出すだけで処理ができます。 ※参考：ドットインストール #01 Underscore.jsとはなにか？ http://dotinstall.com/lessons/basic_underscorejs ####公式サイト http://underscorejs.org/ ####Underscore.jsソース 以下のGithubのリポジトリからunderscore-min.js(軽量)
Denoとはなにか - 実際につかってみる - Qiita
はじめに Denoというものが面白そうだったので、これを書きたいと思います。 Denoとはなにか ↑かわいい Deno(ディーノ)という名前について、聞いたことがありますでしょうか。私も最近まで知りませんでしたが、実はv1.0がリリースされたのが2020/5/13とごく最近のことです。開発自体は2年前から行われておりましたが、結構新しめの技術です。 その証拠(?)にDenoでググると担々麺ばっかりでてきます。(2019/5/18現在) 結局Denoってなんなの？ Denoは、Node.jsの製作者であるRyan Dahlによって作られた、新しいJS/TSランタイムです。すっごい雑に説明すると、Node.jsのイケてなかったところを改良したものがDenoになります。Denoって文字を並べ替えるとNodeになりますね。
使ってみよう！MutationObserver！ - Qiita
１）はじめに DOMの監視をしたい、そんな時に使いやすいWebAPIがMutationObserverです。 今回はその利用方法について模索してみます。 ２）MutationObserverとは その名の通り「Mutation（変化）」を「Observe（監視）」するAPI。 任意の要素（DOM）の変化を監視することが出来ます。 // 対象とするノードを取得 const target = document.getElementById('target'); // オブザーバインスタンスを作成 const observer = new MutationObserver((mutations) => { mutations.forEach((mutation) => { // 何かしたいこと console.log(mutation.target); }); }); // オブザーバの設定 c
Deno ってなんだっけ? - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Deno (ディノ) Advent Calendar 3日目の記事です. 今日は改めて Deno ってなんだっけ? をおさらいしてみましょう. ひとことでいうと Deno は一言でいうと Node.js みたいなやつの新しいやつです. もうすこし詳しくいうと もうすこし詳しくいうと, Deno はターミナルから使うコマンドラインツールで, Deno を使ってサーバーを立ち上げたり, ファイル処理をしたり, いわゆるプログラミング言語で出来る様々な処理を実行することが出来ます. Deno は Node.js と同じように Google C
今すぐJavaScriptデバッグ効率を上げるconsoleテクニック - Qiita
こちらの記事は、2019年9月に公開されたIndrek Lasn氏による『Boost your JavaScript Debugging Skills With These Console Tricks』の和訳になります。 本記事は原著者から許可を得た上で記事を公開しています。 著者Twitter https://twitter.com/lasnindrek JavaScriptにはコードをデバッグするためのツールがたくさんあります。 JavaScriptコードをデバッグするお決まりの方法といえば、コンソールから結果を出力するだけのconsole.logメソッドを使うことでしょう。 十分に機能はしますが、デバッグに最適とまでは言えません。これよりもっと良い方法があれば、試してみたいと思いませんか？ consoleオブジェクトを使えば、ブラウザのデバッグコンソールへのアクセスすることができま
jQueryを使わないスワイプ対応のjavascriptスライダーSwiper の使い方 - Qiita
jQueryを使っていないのでフリクションしにくいのも利点。入れ子でスライダーが組めるところが便利です。 【使い方（Usage）】 GitHubから最新バージョンのSwiperをダウンロードする。 Swiper 下記をHTMLに記載 <head> .... <link rel="stylesheet" href="cssまでのパス/idangerous.swiper.css"> <script defer src="JAVASCRIPTまでのパス/idangerous.swiper-2.x.min.js"></script> .... </head> <body> <div class="swiper-container"> <div class="swiper-wrapper"> <!--First Slide--> <div class="swiper-slide"> <!-- ここに
忙しい人のためのjavascriptでざっくり理解する関数型 - Qiita
対象読者 本記事はタイトルの通り、javascriptという身近な言語で関数型プログラミングのエッセンスを概要レベルで学びたい人向けの内容です。本気で「関数型」を追求している方にとっては物足りたいどころかツッコミどころも多いかと思いますが何卒ご容赦ください。 しかし一方で、「関数型って最近聞くけどどういうものなんだろう？」と思っている方々にとっては、『明日から使える』レベルで実践的な内容になるように心がけています。 そもそも関数型って？ 2019/08/25 コメントで頂いたご指摘を元に修正しました。どういう形で修正させて頂くか迷ったのですが、ここでは「ざっくり理解する」に主眼を置いた表現を目指すことにいたしました。キチンとした定義を勉強したい方はコメント欄をご参照ください。 関数型言語や関数型プログラミングの定義を厳密に理解しようとするとやや難しい話になるので、ここではざっくりと、関数(
JavaScriptコンソールで遊べるテトリスを作成して公開してみた - Qiita
今回npmで公開など初めてだったので、こちらのリンクを参考にしました。ありがとうございます。m(_ _)m TypeScriptでnpmライブラリ開発ことはじめ - Qiita npmでパッケージを公開してみた手順の記録 - Qiita 作成したコード 結構雑ですが、自分が作成したコードをさらそうと思います。よろしくお願いします。 定数や型定義をglobal.tsに全部書きました。自分にとってはテトリスのロジックを考えるのに型定義があるとすごく助かりました。 export const NONE_Y = 0; export const NONE_X = 0; export const INIT_Y = 1; export const INIT_X = 5; export const MAX_X = 11; export const MAX_Y = 17; export type TRow =
JavaScriptのイテレータが持つメソッドをそろそろ知っておきたい人が読む記事 - Qiita
イテレータは今となっては多くのプログラミング言語に存在する概念で、繰り返し処理やループ、ストリームといった対象を抽象化してくれるものです。JavaScriptにはES2015でイテレータが追加されており、JavaScriptを触っている方にとっては既に馴染み深いものとなっています。 とはいえ、JavaScriptのイテレータにはひとつ問題点がありました。それは「イテレータを直接変換・操作できるメソッドが存在しない」という点です。従来イテレータが持つメソッドはイテレータから一つ値を取り出すnextメソッドのみであり1、それ以上の機能は何も提供されていませんでした。これにより、Rustなどのイテレータが強い言語に比べてJavaScriptのイテレータは有用性が大幅に低いものとなっていました。 この記事では、この問題を多少解消するプロポーザル「Iterator Helpers」を紹介します。これ
はじめてajaxを使うときに知りたかったこと - Qiita
はじめに 今更ですが最近ajaxを少し触るようになりました。 jQueryを使えば簡単にajax通信ができるため、単純なものであればそれほど実装は難しくないかと思います。 ですが少し複雑なことをやろうとしてみると、急にハードルが上がる気がします。 そこで自戒を込めて、ajax初心者の方に対してはじめにこれを知りたかったと思えるんじゃないかというものをまとめてみたいと思います。 ※jQueryを利用したajax通信を想定しています 目次 処理の順番を意識する $.ajax()の省略メソッドを知る イベントを知る デバッグ方法を知る 通信状況を想定する（タイムアウトを設定する） 連続クリックを防止する ← [New!] 連続通信を防止する ← [New!] 処理の順番を意識する ajaxを使用する場合は、非同期通信で処理したいケースがほとんどかと思います しかし単純にそのまま書いただけでは処理
モダン JavaScript プログラミングを始めるために知っておきたい技術セット - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 元々は社内向けとして書いたものですが、転載許可が出たので Qiita 向けに加筆・修正した文章です。 僕は普段ペチパーバックエンド領域を担当することが多いのですが、フロントエンド領域を含めて社内の技術アップデートを一緒に頑張っていきたい、という思いから書きました。 なんせペチパーバックエンドエンジニアの拙い知識なので一部情報が古かったり間違っているかもしれません。 フロントエンドガチ勢の皆様、間違い等ございましたら温かく指摘して頂ければと思います。 前書き JavaScript は一応書けるけど、将来心配。なんかすごく進化してるって聞く
JavaScript バーロー！変数定義、varとletの違いをまとめてみた - Qiita
JavaScriptの変数定義、varとletの違いをまとめてみた：イントロ JavaScriptを使う上で変数定義がvarとletがある。 その違いとどちらを使うべきを書いていこうと思います。 ちなみにバーローについては、某探偵少年の名セリフとvar、let(ばー、れっと）をかけてるだけです。。。。むりやりですが（笑) まず変数を宣言するとは ・ざっくりですが値を格納するための領域を確保する ・変数を利用するための宣言 といったところです。 下記の様に宣言します。 本題！varとletの違い 上記のように宣言できるのを見ると違いがない様に見えますが、 大きな違いとしては、letの方がES2015という最近追加された機能で、 letの方がコードの保守性が良いように思います。 違いを下記にまとめていきます。 ■ 相違点 ■ ①変数の重複許容 var => 許す let => 許さない va
JavaScriptの日時処理はこう変わる！ Temporal入門 - Qiita
日時の処理は様々なアプリケーションにおいて避けては通れないタスクです。JavaScriptにおいてもそれは例外ではありません。 JavaScriptでは最初期からDateオブジェクトが日時を表すオブジェクトとして存在していましたが、これは非常に使いにくいAPIで知られています。その結果、momentに代表されるような日時処理ライブラリを使うのが事実上スタンダードとなっています。 この記事では、将来的に日時処理の有力な選択肢になると期待されるモジュールであるTemporalについて解説します。Temporalでは、既存のDateによる日時処理のつらい部分が解消されることが期待されています。 なお、例によってTemporalはまだ策定中の仕様です。現在Stage 2というフェーズにあり、APIを鋭意策定中という状況です。よって、この記事にかかれている内容は確定までにまだ変化するかもしれません。
今度こそ理解できる！ JavaScriptの参照が完全に分かる記事 - Qiita
const arr1 = [1, 2, 3]; // (中略) const arr2 = arr1; arr2.push(4); // （中略） console.log(arr1); // [1, 2, 3, 4] ワイ「何や、配列を書き換えたら別の変数に入れた配列も一緒に変化したで！ JavaScriptのバグやな！」 上司「バグってんのはお前の頭やろ！ もう一回勉強し直さんかい！」 ※この記事は全編やめ太郎さんリスペクトでお送りする2次創作的な記事です。 参照について調べるワイ ワイ「なんや調べたら参照がどうのとか言ってる記事が出てきよるで……。よく分からんから周りの人に聞いてみよか」 同僚「参照ってのはオブジェクトのことやで（大嘘）」 上司「JavaScriptの関数引数は値渡しと参照渡しがあるんや（大嘘）」 ハスケル子「参照っていうのは書き換え可能なレコードのことですよ」1 ワイ「
【JS】いかがでしたか！？値渡しと参照渡しの使い分け！？ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに、の前に陳謝 要は、オブジェクトや配列の一部を変更するだけなら変数と紐づくものは変わらないし、再代入すると変わっちゃうってだけで、JSに参照渡しはないみたいです。数値でも文字列でもオブジェクトでも配列でも！ ネタ記事としてお楽しみくださいませ。 っていうか、↓この記事を読んだ方がええわ！！！ JavaScriptに参照渡し/値渡しなど存在しない ↓あとワイ自身も訂正記事を書いたからよろしくやで！ 3歳娘「パパ、もう参照渡しの話はやめて？」 はじめに 値渡しと参照渡し。 この2つの言葉、プログラミングを勉強したことがある方なら聴い
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
letとvarの違い - Qiita
