Föregående

Nästa

Labb – Organisera kod med namnområden

Slutförd

I den här labbuppgiften ska du prova olika sätt att organisera koden med hjälp av TypeScript.

Övning 1

TypeScript-koden i projektet innehåller två gränssnitt: Loan och ConventionalLoan. Den innehåller också tre funktioner:

• calculateInterestOnlyLoanPayment, som beräknar betalningen för ett räntelån.
• calculateConventionalLoanPayment, som beräknar betalningen för ett konventionellt lån.
• calculateInterestRate, en arbetsfunktion som beräknar lånets månatliga räntesats.

Funktionerna calculateInterestOnlyLoanPayment och calculateConventionalLoanPayment accepterar principle och interestRate parametrar. Skillnaden mellan dem är att calculateConventionalLoanPayment funktionen accepterar en tredje egenskap, months som calculateInterestOnlyLoanPayment funktionen inte gör.

Property	beskrivning
principle	Lånets huvudbelopp.
interestRate	Lånets årliga räntesats. Till exempel anges 5 % som 5.
months	Låneperioden som anges i månader. En ränta endast lån inte kräver denna egendom eftersom antalet månader är irrelevant (lånet kommer aldrig att återbetalas när en ränta endast betalning görs varje månad.)

I den här övningen ska du ordna koden med hjälp av namnområden i en enda TypeScript-fil.

1. Klona startlagringsplatsen genom att ange följande i kommandotolken.

   git clone https://github.com/MicrosoftDocs/mslearn-typescript
   cd mslearn-typescript/code/module-08/m08-start
   code .
   

2. Öppna filen module08_main.ts TypeScript-redigeraren i startarbetsytan.

3. Leta upp TODO Create a the Loans namespace.

4. Skapa ett nytt namnområde med namnet Loans.

5. Flytta gränssnitten Loan och ConventionalLoan till Loans namnområdet.

6. Uppdatera gränssnitten Loan och ConventionalLoan så att de visas utanför Loans namnområdet.

   namespace Loans {
      export interface Loan {
          principle: number,
          interestRate: number        //* Interest rate percentage (eg. 14 is 14%)
      }
      export interface ConventionalLoan extends Loan {
          numberOfMonths: number      //* Total number of months
      }
   }
   

7. Leta upp TODO Create LoanPrograms namespace.

8. Skapa ett nytt namnområde med namnet LoanPrograms.

9. Flytta de tre funktionerna till LoanPrograms namnområdet.

   namespace LoanPrograms {
      /*  TODO Update the calculateInterestOnlyLoanPayment function. */
      function calculateInterestOnlyLoanPayment(loanTerms: Loan): string {
          let payment: number;
          payment = loanTerms.principle * calculateInterestRate(loanTerms.interestRate);
          return 'The interest only loan payment is ' + payment.toFixed(2);
      }
      /*  TODO Update the calculateConventionalLoanPayment function. */     
      function calculateConventionalLoanPayment(loanTerms: ConventionalLoan): string {
          let interest: number = calculateInterestRate(loanTerms.interestRate);
          let payment: number;
          payment = loanTerms.principle * interest / (1 - (Math.pow(1/(1 + interest), loanTerms.months)));
          return 'The conventional loan payment is ' + payment.toFixed(2);
      }
      function calculateInterestRate (interestRate: number): number {
          let interest: number = interestRate / 1200;
          return interest
      }
   }
   

10. Leta upp TODO Update the calculateInterestOnlyLoanPayment function.

11. calculateInterestOnlyLoanPayment I funktionen:

    1. Uppdatera referensen Loan till gränssnittet så att den innehåller Loans namnområdet.
    2. Gör funktionen synlig utanför LoanPrograms namnområdet.

    export function calculateInterestOnlyLoanPayment(loanTerms: Loans.Loan): string {
        let payment: number;
        payment = loanTerms.principle * calculateInterestRate(loanTerms.interestRate);
        return 'The interest only loan payment is ' + payment.toFixed(2);
    }
    

12. Leta upp TODO Update the calculateConventionalLoanPayment function.

13. calculateConventionalLoanPayment I funktionen:

    1. Uppdatera referensen ConventionalLoan till gränssnittet så att den innehåller Loans namnområdet.
    2. Gör funktionen synlig utanför LoanPrograms namnområdet.

     // Calculates the monthly payment of a conventional loan      
     export function calculateConventionalLoanPayment(loanTerms: Loans.ConventionalLoan): string {
         let interest: number = calculateInterestRate(loanTerms.interestRate);
         let payment: number;
         payment = loanTerms.principle * interest / (1 - (Math.pow(1/(1 + interest), loanTerms.months)));
         return 'The conventional loan payment is ' + payment.toFixed(2);
     }
    

14. Leta upp TODO Update the function calls. LÄGG TILL DETTA I START- OCH SLUTKODEN.

15. Lägg till namnområdet LoanPrograms i namnet på funktionerna.

let interestOnlyPayment = LoanPrograms.calculateInterestOnlyLoanPayment({principle: 30000, interestRate: 5});
let conventionalLoanPayment = LoanPrograms.calculateConventionalLoanPayment({principle: 30000, interestRate: 5, months: 180});

1. Spara, kompilera och testa ditt arbete.

Övning 2

I den här övningen ska du ordna om namnrymderna till flera TypeScript-filer.

1. Fortsätt projektet från övning 1.

2. Skapa två nya TypeScript-filer på arbetsytan, module08_loans.ts och module08_loan-programs.ts.

3. Loans Flytta namnområdet från module08_main.ts till module08_loans.ts.

4. LoanPrograms Flytta namnområdet från module08_main.ts till module08_loan-programs.ts.

5. Överst i module08_loan-programs.ts lägger du till en reference instruktion som beskriver relationen mellan gränssnitten i module08_loans.ts och module08_loan-programs.ts.

   /// <reference path="module08_loans.ts" />
   

6. Leta upp TODO Add reference pathsi module08_main.ts .

7. Lägg till de reference instruktioner som beskriver relationen mellan module08_loans.ts, module08_loan-programs.ts och module08_main.ts.

   /// <reference path="module08_loans.ts" />
   /// <reference path="module08_loan-programs.ts" />
   

8. Kör följande kommando i kommandotolken för att kompilera alla beroende .ts-filer och skapa en enda JavaScript-fil med namnet main.js.

   tsc --outFile main.js module08_main.ts
   

9. Testa ditt arbete genom att köra filen main.js .

Labblösning

Klona den avslutande lagringsplatsen genom att ange följande i kommandotolken.

git clone https://github.com/MicrosoftDocs/mslearn-typescript
cd mslearn-typescript/code/module-08/m08-end
code .

Öppna varje .ts-fil för att se lösningen på den här labbuppgiften. Mer information om hur du konfigurerar utvecklingsmiljön för att köra lösningen finns i avsnittet Labbkonfiguration ovan.

Fortsätt