JavaScript 勉強中メモ

・配列に対するfilterメソッド
return true を返すものだけを抽出した配列を返してくれる。
下記例は配列の中から偶数のみを抽出した配列を作成。

  const numbers = [1,4,7,6,7,8,3,0];

  const num = numbers.filter(number => (number%2 ===0));
  console.log(num); //結果[4,6,8,0]

・配列に対するmapメソッド
配列の各要素に対して、それぞれ処理を行った配列を返してくれる。
下記例はそれぞれの値段の税込価格を返してくれる。
Math.floorの中にいれることで、小数点以下を切り捨ててくれる。

  const prices = [350, 500, 600, 900]

  const updateprice = prices.map(price => Math.floor(price * 1.1));

  console.log(updateprice); //　結果[385,550,660,990]


//・日時の生成について
//基本は 
const d = new Date();
//で現在の時間を取得可能。
//気をつける点は月が０(January)〜１１、曜日が０（Sunday）〜６が割り当てられている点。

  const d = new Date(2019,10);  //年と月を指定した日時を生成。2019年11月
  d.setHours(10,20,30); //10:20:30を指定
  d.setDate(31); //31日に指定したが、11月は30日までのため、12月1日を返す
  d.setDate(d.getDate() + 3);
  console.log(d);
  // d.getFulYear()  //2020
  // d.getMonth() //0-11
  // d.getDate() //1-31
  // d.getDay(); //0-6
  // d.getHours();
  // d.getMinutes();
  // d.getSeconds();
  // d.getTime()
  // console.log(d.getTime()); 

//・ランダム値で範囲を指定した整数値を返す方法。
console.log(Math.floor(Math.random() * 3));
//0-2のランダムな整数値を返す。
console.log(Math.floor((Math.random() * 6)  + 1));
//1-6のランダムな整数値を返す。つまりサイコロの生成。

Math.floor(Math.random() * (max + 1 - min)) + min;
//max〜minまでのランダムな整数値を返す基本的な書き方。


//・配列とforEach()の使い方
//以下アロー関数の例
const scores = [10,7,9];
let sum = 0;
scores.forEach(score =>{
sum += score
return sum
})
//返し値は配列の合計値。
let average = sum / scores.length;
//平均を求めるには合計値（sum）を要素の個数で割る.
//要素の個数は配列.lengthで取得可能。
 console.log(sum);　// 26
 console.log(Math.floor(average));  //平均値をfloorで小数点以下を切り捨て 結果8
 console.log(Math.ceil(average));   //平均値をceilで小数点を切り上げ 結果 9
 console.log(Math.round(average));  //小数第一位を四捨五入 結果9
 console.log(average.toFixed(3));  //小数第４位を四捨五入する。


//配列→文字列、文字列→配列にする方法。


const d = [2020,6,7];
console.log(d.join('/')); //配列を文字列にできる。
//結果　2020/6/7 というstring型

const t = '10:03:33';
console.log(t.split(':')); //文字列を配列にできる。
//[10,03,33] という配列

const[hour,minutes,second] = t.split(':'); //それぞれを変数として取り出すことができる。
console.log(hour); //結果10
console.log(minutes); //結果03
console.log(second); //結果33

const str = 'hello';

console.log(str.length);  //結果5

console.log(str.substring(2,4)); //結果'll'

  // console.log(str[2]); //配列と同様には扱えない。
  //str[2] = 'u' はできない。

//代入時の異なる挙動について

let x = [1,2]; //配列への代入(参照型なのでyはxと同じところを参照しなさいとなるから、xの要素を変更したらyも変わる。)
let y = [...x]; //スプレッド演算子を使うと値そのものを代入できる。→元の値を変更してもyはそのまま。
x[0] = 5;

console.log(x);  //結果[5,2]
console.log(y);  //結果[1,2]⇦元のxを代入できてる

let x = [1,2]; //配列への代入(参照型なのでyはxと同じところを参照しなさいとなるから、xの要素を変更したらyも変わる。)
let y = x;
x[0] = 5;

console.log(x);  //結果[5,2]
console.log(y);  //結果[5,2]


  // const point = {
  //   x: 100,
  //   y: 180
  // };

  // const points = [
  //   {x: 30, y: 20},
  //   {x: 50, y: 40},
  //   {x: 70, y: 60},
  // ]
  // console.log(points[1].y)
  // const keys = Object.keys(point); //keysはpointの配列として取得
  // keys.forEach(key =>console.log(`Key:${key}, Value: ${point[key]}`)); //keysは配列のため、forEachが使える。
}
  // const otherProps ={
  //   r: 4,
  //   color: 'red'
  // };
  // const point = {
  //   x : 100,
  //   y : 180,
  //   ...otherProps //objectに他のobjectを加えたい時は「...」を書いてから加える。 
  // };
  // console.log(point);

  // const {x,color,...others} = point;  //値はそのまま代入ができる。

  // console.log(`x:${x}`);
  // console.log(`color: ${color}`);
  // console.log(others);


  // console.log(point['y']);

  // point.x = 200;
  // point['y'] = 360;

  // console.log(point);

  // point.z = 800;

  // console.log(point);
  // delete point.y;

  // console.log(point);

}