Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Comprehensive TypeScript Cheatsheet with Intro and Installation Guide #357

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
227 changes: 227 additions & 0 deletions languages/typescript.sh
Original file line number Diff line number Diff line change
@@ -0,0 +1,227 @@
# *****************************************************************************
# Introduction to TypeScript
# *****************************************************************************

# What is TypeScript?
# TypeScript is a strongly typed programming language that builds on JavaScript, giving you better tooling at any scale.
# It's a superset of JavaScript, which means all JavaScript code is valid TypeScript, but TypeScript has additional features like static typing, interfaces, and generics.

# Why Use TypeScript?
# - Provides type safety on top of the JavaScript, reducing runtime errors.
# - Makes the code more readable and maintainable.
# - Offers great tooling support with IntelliSense in popular editors.
# - Facilitates easier refactoring and debugging.

# *****************************************************************************
# Installing TypeScript
# *****************************************************************************

# Prerequisites:
# - Ensure Node.js is installed on your system. If not, download and install it from https://nodejs.org/

# Installation:
# - TypeScript can be installed as a Node.js package globally or in your project using npm (Node Package Manager).
# - To install TypeScript globally, use the following command in your terminal:
npm install -g typescript

# Checking Installation:
# - To verify that TypeScript has been installed correctly, you can check its version:
tsc --version

# Compiling TypeScript to JavaScript:
# - Once installed, you can compile .ts files to .js using the TypeScript compiler. For example:
tsc hello.ts

# *****************************************************************************
# Basic Syntax and Data Types
# *****************************************************************************

// Boolean type
let isDone: boolean = false;

// Number type
let decimal: number = 6;

// String type
let color: string = "blue";

// Array type
let list: number[] = [1, 2, 3];

// Tuple type
let tuple: [string, number] = ["hello", 10];

// Enum type
enum Color { Red, Green, Blue }

// Any type
let notSure: any = 4;

// Void type
let unusable: void = undefined;

// Null and Undefined
let u: undefined = undefined;
let n: null = null;

# *****************************************************************************
# Functions
# *****************************************************************************

// Function with no return type
function warnUser(): void { /* ... */ }

// Function with return type
function buildName(firstName: string, lastName: string): string { /* ... */ }

// Function with optional parameters
function buildNameOptional(firstName: string, lastName?: string): string { /* ... */ }

// Function with default parameters
function buildNameDefault(firstName: string, lastName = "Smith"): string { /* ... */ }

# *****************************************************************************
# Interfaces
# *****************************************************************************

// Simple interface
interface LabelledValue {
label: string;
}

// Function in an interface
interface SearchFunc {
(source: string, subString: string): boolean;
}

// Indexable types
interface StringArray {
[index: number]: string;
}

// Class types in interfaces
interface ClockInterface {
currentTime: Date;
setTime(d: Date): void;
}

# *****************************************************************************
# Classes
# *****************************************************************************

// Basic class
class Greeter {
greeting: string;
constructor(message: string) { this.greeting = message; }
greet() { return "Hello, " + this.greeting; }
}

// Inheritance
class Animal {
move(distanceInMeters: number = 0) { /* ... */ }
}
class Dog extends Animal {
bark() { /* ... */ }
}

// Class with interfaces
class Clock implements ClockInterface {
currentTime: Date = new Date();
setTime(d: Date) { this.currentTime = d; }
}

# *****************************************************************************
# Advanced Types
# *****************************************************************************

// Union types
function padLeft(value: string, padding: string | number) { /* ... */ }

// Intersection types
interface BusinessPartner {
name: string;
credit: number;
}
type Contact = BusinessPartner & { email: string };

// Type guards
function isFish(pet: Fish | Bird): pet is Fish { /* ... */ }

// Nullable types
function f(sn: string | null): string { /* ... */ }

// Type Aliases
type NameOrNameArray = string | string[];

// Generics
function identity<T>(arg: T): T { return arg; }

# *****************************************************************************
# Enums and Namespaces
# *****************************************************************************

// Numeric enums
enum Direction { Up = 1, Down, Left, Right }

// String enums
enum Response { No = "NO", Yes = "YES" }

// Namespaces
namespace Validation {
export interface StringValidator {
isAcceptable(s: string): boolean;
}
}

# *****************************************************************************
# Modules
# *****************************************************************************

// Importing modules
import { moduleName } from "module";

// Exporting from modules
export function someFunction() { /* ... */ }

// Default exports
export default class SomeType { /* ... */ }

# *****************************************************************************
# Decorators
# *****************************************************************************

// Class decorator
function sealed(constructor: Function) { /* ... */ }

// Method decorator
function enumerable(value: boolean) {
return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) { /* ... */ };
}

// Accessor decorator
function configurable(value: boolean) { /* ... */ }

# *****************************************************************************
# Type Assertions
# *****************************************************************************

let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;

# *****************************************************************************
# Miscellaneous
# *****************************************************************************

// Type inference
let x = 3; // `x` will be inferred as `number`

// Type compatibility
interface Named {
name: string;
}
let x: Named;
let y = { name: "Alice", location: "Seattle" };
x = y; // OK

// Ambient declarations
declare var $: JQuery;