KnowHow

技術的なメモを中心にまとめます。
検索にて調べることができます。

JavaScriptのチートシート１（基本構文）

登録日 ：2025/02/09 14:13
カテゴリ ：Linux

// 変数名はキャメルケースが良い　currentYear
// boolean：isLogin, hasHeader, など
// その他
// aaa_bbb:スネークケース
// CurrentYear:パスカルケース

// string
// .trim(), .toUppercase(), .indexof(arg), .slice(0, 1), replace('str1', 'str2')
// .repeat(10)

//　テンプレートリテラル　I counted ${3 + 4} sheep

//プリミティブ型
// null:　ないことを明示的に示す ex) let loggedInUser = null;
// undefined: わからないことを示す。

// Mathオブジェクト
// math.floor():切り下げ, math.ceil():切り上げ
// ランダムな数

// let val = Math.random() * 5
// Math.floor(val)
// Math.floor(Math.random() * 10) + 1
// Math.floor(Math.random() * 3) + 20
// Math.pow(2,3) == 2 ** 3

//
== : 値が等しいかをチェックするが、型が等しいかをチェックしない。（否定は!=）
=== : 値だけでなく、型が等しいかもきちんとチェックする：基本的には===を使うことが大切。（否定は!==）

console.log()
alart
prompt
perseInt(usetInput) + 1

//じょうけん分岐

if (){

}else if(){

}else{

}

switch(){
    case 1:
        console.log()
        break;
    case 2:
    case 3:
        console.log()
        break;
    default:
        console.log()
}

配列の操作

//push(末尾の追加), pop(末尾の要素を取り出す)
//shift(先頭の取り出す), unshift(先頭に追加する)
//concat: 配列の結合
//includes: 配列の中に、特定の要素が入っているかをかくにんする
//indexOf: 配列の中の特定要素のインデックスを返す
//reverse:　元々の配列を逆順に変えてしまう
//slice: 一部を切り出して新しい配列にする
//splice: 配列の途中に要素を追加する,置き換える操作 ex) color.splice(4, 0, 'yellow')
//sort: 並び替え（ただし、文字列として扱う）

// 配列の比較
// [] == []: falseになる。なぜなら、メモリアドレスを比較するから。
// 配列の代入は、参照渡し（メモリ）となるので、その理解も大切
// constで宣言した場合は、メモリを固定するので、配列のpush, popなどの操作は可能。新しい配列の代入は不可。

//オブジェクト・・・キーと値のペア
オブジェクトリテラル

const person = {
    firstName: 'Taro',
    lastName: 'Yamada',
}

要素へのアクセス

person['firstname']
'Taro'
person.firstname
'Taro'

キーは、自動的にstringに変換されている。

//繰り返し処理（ループ）
//forループ

for(let i=1; i<=10; i++){
    console.log(i)
}

//配列のループ

const animals = ['lions', 'tigers', 'bears'];
for (let i=0; i<animals.length; i++){
    console.log(i, animals[i]);
}

//while ループ

let contu=0;
while(count<10){
    console.log(count);
    count++;
}

const SECRET = 'supersecret';
let guess = '';
while (guess !== SECRET){
    prompt('Plase input code again');
}
console.log('Success');

let input = prompt('');
while(true){
    input = prompt(input);
    if(input==='quit') break;
}

//for of

for (let subreddit of subreddits){
    console.log(subreddit);
}

const testScores = {
    ken: 80,
    yuki:67,
}
for (let student of Object.keys(testScores)){
    console.log(`${student}: ${testScores[student]}`);
}
for (let x in testScores){
    console.log(x);
}

//scopeについて
//blockスコープ
varは、ブロックスコープが効かない。関数の中で宣言しても外から使えてしまう。
そのため、letやconstで宣言するようにしよう(これはブロックスコープになるので)

//レキシカルスコープ
ブロックの中のブロックが参照できる範囲。（どこで定義したかで決まる）

let x = 'aaa';
function hoge(){
    console.log(x);
}
function moge(){
    let x = 'bbb';
    hoge();
}
// aaa
hoge()
// bbbにはならない、aaaと表示されることに注意
moge()

//間数式：関数も値である

const square = function(radius){
    return radius**2*3.14
}
console.log(square(2));
console.log(2*2*3.14);

//高階関数
// case1.引数に関数を与えるもの、返り値を関数にするもの

function callTwice(func){
    func();
    func();
}

function callTenTimes(f){
    for (let i=0; i<10; i++){
        f();
    }
}

function rollDie(){
    const roll = Math.floor(Math.random()*6)+1;
    console.log(roll);
}

// callTwice(rollDie);
// callTenTimes(rollDie);

// case2. 関数から関数をリターンする例

function makeRandomFunc(){
    const rand = Math.random();
    if (rand > 0.5){
        return function(){
            console.log('Congraturation.');
        }
    }else{
        return function(){
            console.log("Hello!!!!!");
        }
    }
}

const randfunc = makeRandomFunc();
randfunc();

function makeBetweenFunc(min, max){
    return function(num){
        return num >= min && num <= max;
    }
}

const isChild = makeBetweenFunc(0, 18)
const isAdult = makeBetweenFunc(19,64);
const isSenior = makeBetweenFunc(65, 120);

console.log(isChild(18));
// console.log(isChild(25));
// console.log(isAdult(18));
// console.log(isAdult(54));
// console.log(isSenior(70));

//メソッド：オブジェクトの関数に関する定義

const myMath = {
    PI: 3.14,
    square: function(num){
        return num*num;
    },
    cube: function(num){
        return num**3;
    }
}

console.log('------------------');
console.log(myMath.square(2));
console.log(myMath.cube(3));
console.log(myMath['cube'](4));

const myMath2 = {
    PI: 3.14,
    square(num){
        return num**2;
    },
    cube(num){
        return num**3;
    }
}

console.log(myMath2.square(4));
console.log(myMath2.cube(4));


console.log('------------------');

//メソッドの中のthis
//同じオブジェクト内の、他のプロパティを使いたい時にthisを活用しよう

const cat = {
    name: 'tama',
    color: 'grey',
    breed: 'American shot hear',
    cry(){
        console.log(this);
        console.log(`${this.name} is cried.`)
    }
}
cat.cry();
const cry2 = cat.cry;
cry2();

console.log('------------------');
//try, catch
try{
    hello.toUperCase();
}catch{
    console.log('Error');
}
console.log('next');

function shout(msg){
    try{
        console.log(msg.toUperCase().repeat(3))
    }catch(e){
        // console.log(e);
        console.log(msg);
    }
}
shout('aaaa');
shout(1234)

戻る