JavaScript
コンストラクタ関数（p80,176） オブジェクト指向（p78） クラスベース プロトタイプベース オブジェクトをつくる「もと」なのか？ 抽象クラス、インターフェース コンストラクタ関数（p80,176） ・new式を使用して新規オブジェクト（インスタンス）を作成す…
■スプレッド構文 できること ・配列式や文字列などの反復可能オブジェクトを、0 個以上の引数 (関数呼び出しの場合) や要素 (配列リテラルの場合) を期待された場所で展開する ・オブジェクト式を、0 個以上のキーと値の組 (オブジェクトリテラルの場合) を…
関数の定義（p66） JavaScript では、関数は文、式どちらによっても定義できる 『文（Statement）』 ・何らかの手続きを処理系に命令するもの ・変数に代入できない 例）ifは文であり、値として評価されない ※Haskell やScala のような関数型言語ではifは式…
DOMとは ・Document Object Model ・HTMLドキュメントコンテンツを表したり操作したりするAPI ・HTMLドキュメントをミラーリングする ・新しいElementノードやTextノードを作成するためのメソッドや、ほかのElementオブジェクトの子ノードしてとしてドキュメ…
型を調べたいとき 返却する値を数字にしたいとき 型を調べたいとき 【Udemy】TypeScript セクション１-3 js-only.js // querySelector // 指定されたセレクターに一致する最初の Element を返す const button = document.querySelector('button'); const inp…
リダイレクト HTTPリダイレクト…サーバー側で設定するリダイレクト設定 javascriptによるリダイレクト…ブラウザ側で実行されるリダイレクト設定 javascriptでリダイレクトする場合の注意点 ・リダイレクト前のページが「流入ページ」として計測される ・旧ペ…
めちゃ難しい…！！ 初心者の壁かも？ 焦らずゆっくり理解しよう✨ 同期処理／非同期処理 ＜同期処理＞ ・１つの処理を実行し、完了したら次の処理を実行し…を繰り返していく ＜非同期処理＞ ・処理を実行したら、完了する前に次の処理に進む ・メリット：時間…
concat const ary1 = [1, 2, 3];const ary2 = ary1.concat(); console.log(ary1); // => [ 1, 2, 3 ]console.log(ary2); // => [ 1, 2, 3 ] // ary2 の要素を変更するary2[0] = 4;console.log(ary2); // => [ 4, 2, 3 ] // ary1 は変更されないconsole.log(a…
HTMLでは実現できないので、Javascriptを用いる input type="date"を使った日付入力フォーム - Qiita →getElementById()をマウント後に使うと、DOM要素が確定したあとにHTML要素を書き換えようとして失敗する！ 対策 ・書き換えをset up() のdataに対して行…
delete演算子 splice()メソッド concat()メソッド push()メソッド map()メソッド 所感 delete演算子 ・配列の要素の削除を行う ・実行の結果、配列は疎になる →削除した要素は消えるのではなく、「定義されていない」状態になる ・lengthプロパティは変化し…
基本値型 例）underfined,null,論理値,数値,文字列 ・不変。変更する方法がない。 例）変数「ｓ」を大文字表記にする方法はあるが、それによって元の変数が変わることはない。 ・値で比較する オブジェクト参照 例）オブジェクト,配列,関数も含む ・可変 例…
Map Set スプレッド構文 おまけ Map 複数の値が保持できるものに、List,Map,Setなどがあるが、 Mapは他の２つと何が違うのか？ →キーの重複をなくせる！（ダブりは上書きされる） List、Map、Setを使用して複数の値を保持してみよう！【プログラミング】 | …
〇onchangeイベント フォームに入力された内容が変わったときに発生 <body> <form id="form"> <select name="select"> <option value="1">日本語</option> <option value="2">English</option> <option value="3">中文</option> </select> </form> </body> <script> document.getElementById('form').select.onchange = function(){ 処理 ; } </script> 参考：jav…
〇setTimeoutメソッド 待ち時間後にファンクションを一度だけ実行する setTimeout(ファンクション,待ち時間); 例）1000ミリ秒（＝1秒）後にcalcファンクションを実行する setTimeout(calc,1000); ＝MEMO＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝…
＜やり方＞ 取得した<form>要素.読み取りたいフォーム部品のname属性.value</form>
○配列の要素をすべて取得する（for…of文） for(let 変数名 of 対象となる配列名){ 処理 } ○配列に要素を追加する 配列の変数名.push(追加したいデータ) 〇配列の各項目を繰り返し処理する（forEachメソッド） 配列.forEach(function(function,index){ 処理内…
例） <html> <body> <section> <p>最終アクセス日時：<span id="time"></span></p> </section> </body> </html> <script> const now = new Date(); const year = now.getFullYear(); const month = now.getMonth(); const date = now.getDate(); const hour = now.getHours(); const min = now.getMinutes(); const output = `${year}/…
onsubmitイベント 送信ボタンがクリックされた直後で、入力内容がサーバーに送信される直前に発生する。 ＜使用方法＞ 取得した要素.onsubmit = function(){ 処理内容 }; ※イベントに代入するファンクションには、ファンクション名はつけない。 ＜使用例＞ <html> <section> <form action="#" id="form"></form></section></html>…
○アラートダイアログボックス（p46） window.alert('ここに書いた文字や数式がでる'); 使用例）データの中身を確かめるのに、console.log()みたいに使える。 alert('click'); ○確認ダイアログボックス（p58） window.confirm('メッセージ'); confirmメソッド…
○要素の取得-1（id） document.getElementById('id名') 例）html <p id="choice">ここに日時を表示します</p> JavaScript console.log(document.getElementById('choice')); ○要素の取得-2（cssセレクタ） document.querySelector('CSSセレクタ') 例）HTMLのボタンをクリックし…
