LoginSignup
0
0

More than 3 years have passed since last update.

javascript学習(2020/06/18)

Posted at

要素にイベントを追加する

sample.js
取得した要素.onsubmit = function() {
  処理内容
}

onsubmitの部分はイベントによって書き換える
取得した要素のイベントに=を使ってファンクションを代入する形でイベントが発生したときの処理内容を設定。
イベントに代入するファンクションにファンクション名は付けず、{}内にreturnなし

フォームに入力内容を読み取る

sample.js
取得したform要素.読み取りたいフォーム部品のname属性.value

タグの基本動作をキャンセルする

sample.js
event.preventDefault();

Dateオブジェクト

Dateオブジェクトは以下のことができる
1. 現在日時を取得する
2. 過去や未来の日時を設定
3. 日時の計算

Dateオブジェクトの初期化

sample.js
const now = new Date() 

Dateオブジェクトを使い、日時の設定や計算を行うとき最初に初期化する必要がある。
newはオブジェクトを初期化するキーワード。

年、月、日などを個別に取得する

sample.js
    const year = now.getFullYear();
    const month = now.getMonth();
    const date = now.Date();
    const hour = now.getHours();
    const min = now.MInutes();

getMonthメソッドは実際の月-1の数字が取得される。

Dateオブジェクトから日時を取得する主なメソッド

メソッド 説明
getFullYear() 年を取得する
getMonth() 月を0~11の数値で取得
getDate() 日を取得
getDay() 曜日を0~&の数値で取得
getHours() 時を取得
getMinutes() 分を取得
getSeconds() 秒を取得
getMiiseconds() ミリ秒を0~999の数値で取得
getTimezoneOffset() 時差を取得
getTime() 1970年1月1日0時からの時間をミリ秒で取得
setFullYear(年) 年(西暦)を設定
setMonth(月) 月を0~11の数値で設定
setDate(日) 日を設定
setHours(時) 時を設定
setMinutes(分) 分を設定
setSeconds(秒) 秒を設定
setMiiseconds(ミリ秒) ミリ秒を0~999の数値で設定
setTime(ミリ秒) 1970年1月1日0時からの時間をミリ秒で設定

Mathオブジェクトの主なメソッド、プロパティ

プロパティ 説明
Math.PI 円周率
Math.SQRT1_2 1/2の平方根
Math.SQRT2 2の平方根
メソッド 説明
Math.abs(x) xの絶対値
Math.atan2(y.x) 座標(x,y)のX軸からの角度(ラジアン)
Math.celi(x) xの小数点以下を切り上げる
Math.cos(x) xのコサイン
Math.floor(x) x小数点いかを切り捨てて、xより小さい整数にする。xが負数だった場合の結果に注意
Math.max(a,b,...) ()内のパラメータのうち最大の数を返す
Math.min(a,b,...) ()内のパラメータのうち最小の数を返す
Math.pow(x.y) xのy乗
Math.random( ) 0以上1未満の乱数
Math.round(x) xの小数点以下を丸める(四捨五入)
Math.sin(x) xのサイン
Math.sqrt(x) x平方根
Math.tan(x) xのタンジェント
Math.trunc(x) xの小数点以下を単純に切り捨てる

Math.rondom()の0以上1未満のままでは使いづらいので、通常これを0以上または1以上の整数に直す。1以上の整数を乱数で発生させたい場合は次のような式を書く。
この場合はxを欲しい数の上限に置き換える。

sample.js
Math.floor(Math.random() * x) + 1

例:サイコロの目を出したい場合はxを6にする

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0