typescript/js에서 'this'를 처리하는 방법은 무엇입니까? 파이썬 코드를 타이프 ​​스크립트로 변환해야합니다

Question

저는이 간단한 코드를 파이썬으로 작성하여 작은 카드 게임을 만들고 타이프 스크립트를 사용하여 동일하게 만들고 싶습니다. 그러나 은 내 주요 클래스에서 'this'와 큰 문제에 직면합니다.

class deck: 
    card_type=['Hearts ','Diamonds','Spades','Clubs'] 
    card_rank=[2,3,4,5,6,7,8,9,10,'A','J','Q','K'] 
    full_deck=[] 

    def build_deck(self): 
     single={} 
     for card in self.card_type: 
      for n in self.card_rank: 
       single={n: card} 
       self.full_deck.append(single) 
     shuffle(self.full_deck) 


    def reshuffle (self): 
     print('Re-shuffling again!') 
     shuffle(self.full_deck) 


    def choose_card(self): 
     chosen=choice(self.full_deck) 
     the_index= self.full_deck.index(chosen) 
     self.full_deck.pop(the_index) 

     return chosen 

    def pick_hand(self, number_of_cards): 
     hand=[] 
     new_card={} 

     for i in range(number_of_cards): 
      new_card = self.choose_card() 
      hand.append(new_card) 

     return hand 

그리고 내 주요 게임 파일에

내가 같은 것을 할 : 타이프 이 원래 파이썬 클래스는

from classes import deck 

deck1= deck() 
deck1.build_deck() 
my_hand=deck1.pick_hand(3) 
compu_hand=deck1.pick_hand(3) 

---

그러나 때 나는 다음과 같은 쓴 형 스크립트에 유사한 클래스를 만들려고 :

export class deck { 

    single_card: { 
    cType: string; 
    cNumber: any; 
    }; 

    fullDeck: any[] = []; 
    card_type=['Hearts ','Diamonds','Spades','Clubs']; 
    card_rank=[2,3,4,5,6,7,8,9,10,'A','J','Q','K']; 

    shuffle() { 
    let counter = this.fullDeck.length; 

    // While there are elements in the array 
    while (counter > 0) { 
     // Pick a random index 
     let index = Math.floor(Math.random() * counter); 

     // Decrease counter by 1 
     counter--; 

     // And swap the last element with it 
     let temp = this.fullDeck[counter]; 
     this.fullDeck[counter] = this.fullDeck[index]; 
     this.fullDeck[index] = temp; 
    } 

    // return this.fullDeck; 
    } 


    buildDeck(){ 

    for (let t in this.card_type) { 
     for (let n in this.card_rank) { 
     this.single_card.cType = this.card_type[t]; 
     this.single_card.cNumber = this.card_rank[n]; 
     this.fullDeck.push(this.single_card); 
     console.log(this.single_card); 
     } 
    } 
    // this.shuffle() 

    } 

} 

내가 지금처럼 주 '의 TS'파일에서 클래스를 사용하려고 :

import {deck} from './myclasses' 

$(document).ready (function(){ 
    let deck1= new deck; 
    deck1.buildDeck(); 
}); 

을 console.log를

jQuery.Deferred exception: Cannot set property 'cType' of undefined TypeError: Cannot set property 'cType' of undefined at deck.buildDeck (file:///run/media/Work/HTML_Porjects/Game_TS/built/myclasses.js:132:44)

어떻게 정의되지 않은 : 호출이 같은 오류를 반환? Typescript 코드를 파이썬 코드처럼 작동 시키려면 어떻게해야합니까?

미리 감사드립니다 ...

는

Answer 1

오류는 단순히 single_card가 인 정의되지 않은 것을 말한다 :

class deck { 

    single_card: { 
    cType: string; 
    cNumber: any; 
    }; 

    // … 
} 

이것은 타이프 라이터 클래스의 특성 single_card를 선언 할 수 있도록 컴파일러 해당 유형의 객체 (예 : this.single_card)의 single_card 속성을 참조 할 때 허용됩니다. 그러나 이렇게하면 이 아닌은 실제로 해당 유형의 개체를 개체에 할당합니다. 따라서 컴파일 된 JavaScript (유형 정보가 제거 된)의 경우 사용자가 지정하지 않았으므로 해당 특성이 존재하지 않습니다. compiled JavaScript there을 보면 쉽게 확인할 수 있습니다.

그래서 당신이 먼저해야 할 것입니다 당신이 파이썬 버전에서 그랬던 것처럼 single_card에 뭔가를 할당입니다

: 당신이 실제로 파이썬 버전 보면, single_card는 회원

this.single_card = {} 

그러나 아니다 객체와 실제로 그것이 어떤 의미가되지 않습니다. 이것을 사용하여 fullDeck 배열에 추가 할 카드 객체를 생성합니다. 파이썬에서는 로컬 변수이므로 TypeScript 버전에서도 로컬 변수로 사용해야합니다.

buildDeck() { 
    for (const t of this.card_type) { 
    for (const n of this.card_rank) { 
     const single_card = { 
      cType: this.card_type[t], 
      cNumber: this.card_rank[n] 
     }; 
     this.fullDeck.push(single_card); 
    } 
    } 
} 

Btw. 이 경우 for…in 대신 for…of 루프를 사용하려고합니다.

fullDeck을 올바르게 입력하는 것도 고려해야합니다. 현재는 any의 배열이므로 모든 객체를 저장할 수 있습니다. 그러나 당신이하고 싶은 것은 사실 거기에있는 물체를 그대로 두어 모양이 보이는 것입니다. single_card.그래서 이것에 대한 유형을 선언 고려해

interface SingleCard { 
    cType: string; 
    cNumber: any; 
} 

그런 다음 제대로 fullDeck를 입력 할 수 있습니다

fullDeck: SingleCard[] = [];