alienHRNの訓練日記

IT業界初心者で勉強中。

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(), 1115);
var newYear = new Date(today.getFullYear(), 1015);

// イベント当日の日時「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() + 11115);


// イベント当日の日時「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(), 73);

// イベント当日の日時「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(24));
// 文字列の2番目から(4番目-1番目)までの文字列を抽出する。
console.log(str3.slice(-3));
//この場合、負の値は末尾からカウントしつつ、抽出する文字は省略されているので
// 指定した位置右から-3文字目まで抽出する。
console.log(str3.substring(24));
// インスタンス.substring(抽出開始する文字番[,抽出する文字数])
// sliceとの違い※イレギュラーな使い方をするときに違いが出る。
//console.log(str3.slice(-3));→開始位置が末尾から!
// console.log(str3.substring(-3));→開始位置が0として扱う!
console.log(str3.substr(23));
//文字列の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(positionposition += count));
}