20200805 授業メモ Dateオブジェクト続き stringオブジェクト
授業内容
要約
誕生日へのカウントダウン
console.log('問1');
console.log('1回目の出力');
誕生日まであと何日かブラウザ上で表示させること
var today = new Date();
// ↑PCの最新の日付と時間
// var today = new Date('2018/12/20 12:00:00');
// var newYear = new Date(today.getFullYear() + 1, 0, 1);
var birth = new Date(today.getFullYear(), 11, 15);
var newYear = new Date(today.getFullYear(), 10, 15);
// イベント当日の日時「2021年1月1日」
// 2021年=today.getFullYear() + 1 注意
console.log(today.toLocaleDateString());
console.log(newYear.toLocaleDateString());
console.log(birth.toLocaleDateString());
var diff = (birth.getTime() - today.getTime());
console.log('翌年元日' + newYear.getTime());
// ↑ミリ秒で表現
console.log('現在日時' + today.getTime());
// ↑ミリ秒で表現
console.log('経過ミリ秒差分' + diff);
// ↑ミリ秒で表現
console.log('1日分のミリ秒' + 1000 * 60 * 60 * 24);
// 1000mm秒*60=1分 1分*60=60分 60分*24=24時間
diffDate = Math.ceil(diff / (1000 * 60 * 60 * 24));
// diffDate=(diff/24時間)()を切り上げ
console.log('切り上げされた日付差分' + diffDate);
document.getElementById('display1').innerHTML
// = '来年まであと' + diff + '日';
// = 'イベントまであと' + diff + '日';
= '誕生日まであと' + diffDate + '日';
console.log('問2');
var today = new Date();
var birth = new Date(today.getFullYear() + 1, 11, 15);
// イベント当日の日時「2021年1月1日」
// 2021年=today.getFullYear() + 1 注意
console.log(today.toLocaleDateString());
console.log(birth.toLocaleDateString());
var diff = (birth.getTime() - today.getTime());
console.log('翌年元日' + newYear.getTime());
console.log('現在日時' + today.getTime());
console.log('経過ミリ秒差分' + diff);
console.log('1日分のミリ秒' + 1000 * 60 * 60 * 24);
// 1000mm秒*60=1分 1分*60=60分 60分*24=24時間
diffDate = Math.ceil(diff / (1000 * 60 * 60 * 24));
// diffDate=(diff/24時間)()を切り上げ
console.log('切り上げられた日付差分' + diffDate);
document.getElementById('display2').innerHTML
// = '来年まであと' + diff + '日';
// = 'イベントまであと' + diff + '日';
= '誕生日まであと' + diffDate + '日';
console.log('問3');
当日ならおめでとう、誕生日前だったらあと何日、過ぎてたら何日すぎてるか
ブラウザ上に表示させること
var today = new Date();
var birth = new Date(today.getFullYear(), 7, 3);
// イベント当日の日時「2021年1月1日」
// 2021年=today.getFullYea8r() + 1 注意
console.log(today.toLocaleDateString());
console.log(birth.toLocaleDateString());
var diff = (birth.getTime() - today.getTime());
var diff = diff / (1000 * 60 * 60 * 24)
console.log('翌年元日' + newYear.getTime());
console.log('現在日時' + today.getTime());
console.log('経過ミリ秒差分' + diff);
console.log('1日分のミリ秒' + 1000 * 60 * 60 * 24);
console.log('日付差分' + diff);
diffDate = Math.ceil(diff);
console.log('日付差分切り上げ' + diffDate);
if (diffDate == 0)
{
document.getElementById('display3').innerHTML
= '誕生日おめっとさん( ;∀;)b';
} else {
if (diffDate > 0) {
document.getElementById('display3').innerHTML
= '誕生日まであと' + diffDate + '日';
} else {
document.getElementById('display3').innerHTML
= '誕生日' + Math.abs(diffDate) + '日過ぎてるし(・´з`・)';
}
};
// Math.abs()→()内の値を絶対値にして返す。
※else ifは使えないのか?
→使えないこともないが「何日過ぎてる」という処理を2通り
記述しなきゃいけないのでちょっと手間がかかる。
→elseの中にまたifを記述する形にすると「何日過ぎてる」という処理
を1通りだけの記述で済む。
PG作成や解読
◇値(変数)
◇条件(「いくつ分岐」もしくは「反復処理はあるのか?」)
◇処理(条件に紐づく処理)
〇stringオブジェクト
例題
JSファイル
console.log('1回目の出力');
var str1 = 'Hello';
var str0 = new String('あいうえお');
//stringインスタンス→オブジェクト内に様々な値を管理する場合に用いる。
console.log(str0);
console.log(str1);
console.log(str1.length);
// お問い合わせフォームの文字制限等に利用できる
console.log(str1.charAt());
//インスタンス.charAt([index])
//指定したindex位置にある文字を返す
console.log(str1.toLowerCase());
//指定したindex位置にある文字を小文字に変換された値を返す
console.log(str1.toUpperCase());
//指定したindex位置にある文字を大文字に変換された値を返す
console.log('2回目の出力');
var str2 = 'それちゃうちゃうちゃうで';
console.log(str2);
console.log(str2.length);
console.log(str2.indexOf('ちゃう'));
// 引数→()内の値のことを言う
//インスタンス.indexOf(検索する文字[,検索する文字列の番号])
//第1引数(必須):検索する文字
//第2引数(省略可):検索を始める位置
//要はindexOfは検索する機能を持つ
それちゃうちゃうちゃうで
0 1 2 3 4 5 6 7 8 9 10 11 0番を含めて全部で12文字
console.log(str2.indexOf('ちゃう', 4));
console.log(str2.lastIndexOf('ちゃう'));
console.log(str2.lastIndexOf('ちゃう', 9));
// 文字番号9番目から左方向に向かって検索。
// この場合文字番号8番目に該当。
console.log(str2.lastIndexOf('ちゅう'));
//↑この場合は該当なし。-1という値で返ってくる。
console.log('3回目の出力');
var str3 = 'テラハウス ICA';
console.log(str3);
console.log(str3.length);
console.log(str3.slice(2, 4));
// 文字列の2番目から(4番目-1番目)までの文字列を抽出する。
console.log(str3.slice(-3));
//この場合、負の値は末尾からカウントしつつ、抽出する文字は省略されているので
// 指定した位置右から-3文字目まで抽出する。
console.log(str3.substring(2, 4));
// インスタンス.substring(抽出開始する文字番[,抽出する文字数])
// sliceとの違い※イレギュラーな使い方をするときに違いが出る。
//console.log(str3.slice(-3));→開始位置が末尾から!
// console.log(str3.substring(-3));→開始位置が0として扱う!
console.log(str3.substr(2, 3));
//文字列の2番目から3文字抽出する
console.log(str3.substr(2, -3));
//この場合はイレギュラーで()内の数値が左値>右値になった場合は
//左と右を入れ替える(-3,2)
// 結果、0番目から開始、2文字抽出するという処理になる
console.log('4回目の出力');
var str4 = '田中,佐藤,鈴木';
console.log(str4);
console.log(str4.length);
var array = str4.split(',');
// インスタンス.split(文字列を区切る文字[最大分割数(省略されていたら部屋数に制限はない)])
// 戻り値:分割文字で分割された値を持つ配列。
// この場合田中、佐藤、鈴木
var array = str4.split(',', 1);
// この場合田中
var array = str4.split(',', 2);
// この場合田中、佐藤
console.log(array);
console.log(array.length);
console.log('endが-1だと便利');
var count = 2; //抽出する文字数
var position = 0; //抽出する位置
while (position < str3.length) {
console.log(str3.slice(position, position += count));
}