koan

20738 ワード

koanで知った新しい事実
ユニットテストの作成方法
  • 実際のプログラミング時の問題点を探しやすい
    expect(테스트하는값).기대하는조건
       expect(isEven(3)).to.be.true => 'isEven(3)'의 결과값은 (true)이어야 한다'
       expect(1 + 2).to.equal(3) => 'sum(1, 2)의 결과값은 3과 같아야(equal) 한다'
  • '기대하는조건'에 해당하는 함수를 matcher라고 한다.
    `.equal`은 두값의 타입까지 엄격하게 같은지 검사한다, `===`과 비슷하다.
    
    
    Obj.toString() - 객체나 변수가 가지고 있는정보를 문자열로 변환해줌
    
    (==) 느슨한 동치 연산자 예시
    ```js
    	expect(0 == false).to.be.true;
        expect('' == false).to.be.true;
        expect([] == false).to.be.true;
        expect(![] == false).to.be.true;
        expect([] == ![]).to.be.true;
        expect([] == '').to.be.true;
        expect([] == 0).to.be.true;
        expect([''] == '').to.be.true;
        expect([''] == 0).to.be.true;
        expect([0] == 0).to.be.true;
    ばらばらな代入演算子なのでタイプ値の比較はできませんが、それ以外に明確なルールはありません.
  • タイプ規則
  • (-)演算子はすべて数値列として認識されます.文字からなる文字列-文字列にNANを表示します.
    JavaScriptではtrueは1と認識され、falseは0と認識される.
  • 変数
  • contは定数変数で、再割り当てできません.
    配列またはオブジェクトを変数に再割り当てすることはできませんが、属性を追加または削除できます.
    const arr = [];
     arr.push(42);
    console.log(arr)// [42]
    //---------------------------------------
    const obj = {}
    obj['a'] = 4
    console.log(obj) // { a: 4 }
  • 矢印関数
  • // function 키워드를 생략하고 화살표 => 를 붙인다.
        const add = (x, y) => {
          return x + y
        }
        expect(add(10, 20)).to.eql(30)
    
    // 중괄호와 리턴을 생략 가능
        const subtract = (x, y) => x - y
        expect(subtract(10, 20)).to.eql(-10)
    
    // 필요에 따라 소괄호 사용
        const multiple = (x, y) => (x * y) / (4 * 5) 
        expect(multiple(10, 20)).to.eql(10)
    
    // 파라미터가 하나일 경우 소괄호 생략 가능
        const divideBy10 = x => x / 10
        expect(divideBy10(100)).to.eql(10)
      })
  • 矢印関数で示すエンクロージャ関数
  • const adder = x => {
          return y => {
            return x + y
          }
        }
    
        expect(adder(50)(10)).to.eql(60)
    
    // 외부함수 return생략
        const subtractor = x => y => {
          return x - y
        }
    
        expect(subtractor(50)(10)).to.eql(40)
    
    // 괜찮게 써먹을것같은 예시
    const htmlMaker = tag => textContent => `<${tag}>${textContent}</${tag}>`
    	
    expect(subtractor(div)(죽이는데 함수)).to.eql(`<div>죽이는데 함수</div>`)
  • Hoisting
    JavaScriptで関数を最後まで宣言しても、上部から関数を呼び出すことができます.
    var宣言もそうです.ただし、割り当てられた値は呼び出されません.
  • 
    console.log (sum(4,5)) // 상단에 있음에도 9값이 리턴됨
    
    function sum(n1,n2){
      return n1+n2
    }
    // -------------
    console.log (test(4,5)) 
    // 변수test는 함수가 아니라고함 즉, 변수는 인식하나 변수에 값이 할당되지않음을 인식
    
    var test = function sum(n1,n2){
      return n1+n2
    }
    
    この現象により、長いコードを記述する際に歪みが生じる可能性があるため、letまたはconstを使用することを推奨します.
  • オブジェクト鍵の数決定方法Object.keys():オブジェクトキー値を要素として返す配列を使用します.
  • const obj = { a: 3, b: 4, c: 6 }
    
    Object.keys(obj) // [ a, b, c ]
    配列に戻るので、要素の長さを決定できます.
    すなわち、オブジェクトのキー数を決定することができる.
    const obj = { a: 3, b: 4, c: 6 }
    
    Object.keys(obj) // [ a, b, c ]
    
    const keyArr =Object.keys(obj);
    
    KeyArr.length // 3
    .deep.equalは、配列内の要素またはオブジェクトの属性が同じかどうかを決定するマッチング器です.
  • Array.slice(start, end)
  • const arr = [1, 2, 3, 4]
    
    arr.slice(2,2) // []이 복사되어 반환
    
    arr.slice(0, 20) // [1, 2, 3, 4]값이 복사되어 반환
    
    arr.slice(3, 0) // []이 복사되어 반환
    パラメータのstartとend値が同じ場合、空の配列をコピーして返します.
    エンディングソングArraylegentより大きくても、既存の配列でのみコピーされ、最後のインデックスが返されます.
    endがstartより小さい場合は、空の配列をコピーして返します.

  • this
    これはこれを意味します.つまり、誰が私を呼んだのですか.
    どこで呼び出されるかによって、thisの戻り値が異なります.
    △正直に言うと、私の理解が正しいかどうか分かりません.
    自分の値を呼び出しますか?戻る場所は?

  • Date
    Dateは現在の時刻を返し、年度月日時刻として作成します.
    Dateオブジェクトを作成する唯一の方法はnew演算子を使用することです.

  • str.repeat()
    数値で文字列を返す
  • 'jm'.repeat(3) // 'jmjmjm'
  • Object.assign()
    1つまたは複数のソースオブジェクトからターゲットオブジェクトに属性をコピーする
  • const obj1 = {a:1};
    const obj1 = {a1: 1, b1: 2};
    
    Object.assign(obj, obj2) // { a: 1, a1: 1, b1: 2 }

  • 浅いレプリケーション
    オブジェクトをコピーするときに、元のアドレスとコピーが同じアドレス値を1つ以上表示することを意味します.

  • 深くコピー
    オブジェクト内にオブジェクトがある場合でも、元のオブジェクトとの参照が完全に切断されるオブジェクトを指します.