TypeScript: أساسيات العناصر العامة في TypeScript

// Option 1: Use any — missing type information
function firstAny(arr: any[]): any {
  return arr[0];
}

let n = firstAny([1, 2, 3]);    // n is any — don't know if it's number
let s = firstAny(["a", "b"]);   // s is any — don't know if it's string

// Option 2：Write a function for each type——Code Duplication
function firstNumber(arr: number[]): number { return arr[0]; }
function firstString(arr: string[]): string { return arr[0]; }
// Endless...

function first<T>(arr: T[]): T {
  return arr[0];
}

let n = first([1, 2, 3]);       // T Inferred as number → Back number
let s = first(["a", "b"]);      // T Inferred as string → Back string
let b = first([true, false]);   // T Inferred as boolean → Back boolean

console.log(n.toFixed(2));      // ✅ TypeScript knows n is number
console.log(s.toUpperCase());   // ✅ TypeScript knows s is string

function identity<T>(value: T): T {
  return value;
}

// TypeScript Automatic Inference T
let num = identity(42);       // T = number
let str = identity("hello");  // T = string

// You can also specify it explicitly T（Sometimes it is necessary to）
let result = identity<string>("hello");

function pair<A, B>(first: A, second: B): [A, B] {
  return [first, second];
}

let p1 = pair("name", 42);        // [string, number]
let p2 = pair(true, [1, 2, 3]);   // [boolean, number[]]

function map<T, U>(arr: T[], transform: (item: T) => U): U[] {
  return arr.map(transform);
}

let numbers = [1, 2, 3];
let strings = map(numbers, n => `No.${n}`);
// T = number, U = string → Back string[]

console.log(strings);  // ["No.1", "No.2", "No.3"]

// Filter Array
function filter<T>(arr: T[], predicate: (item: T) => boolean): T[] {
  return arr.filter(predicate);
}

// Searching an Array
function find<T>(arr: T[], predicate: (item: T) => boolean): T | undefined {
  return arr.find(predicate);
}

// Array Chunking
function chunk<T>(arr: T[], size: number): T[][] {
  let result: T[][] = [];
  for (let i = 0; i < arr.length; i += size) {
    result.push(arr.slice(i, i + size));
  }
  return result;
}

let nums = [1, 2, 3, 4, 5, 6, 7];
let evens = filter(nums, n => n % 2 === 0);
let found = find(nums, n => n > 5);
let groups = chunk(nums, 3);

console.log("Even number：" + evens);        // "Even number：2,4,6"
console.log("Found：" + found);        // "Found：6"
console.log("Chunking：" + JSON.stringify(groups));  // "[[1,2,3],[4,5,6],[7]]"

Even number：2,4,6
Found：6
Chunking：[[1,2,3],[4,5,6],[7]]

interface Box<T> {
  value: T;
}

let stringBox: Box<string> = { value: "hello" };
let numberBox: Box<number> = { value: 42 };

interface Transformer<A, B> {
  (input: A): B;
}

let toString: Transformer<number, string> = (n) => String(n);
let toLength: Transformer<string, number> = (s) => s.length;

console.log(toString(42));       // "42"
console.log(toLength("hello"));  // 5

interface Repository<T> {
  findById(id: string): T | null;
  findAll(): T[];
  save(item: T): void;
  delete(id: string): boolean;
}

interface User {
  id: string;
  name: string;
}

class UserRepo implements Repository<User> {
  private data: User[] = [];

  findById(id: string): User | null {
    return this.data.find(u => u.id === id) ?? null;
  }

  findAll(): User[] {
    return this.data;
  }

  save(item: User): void {
    this.data.push(item);
  }

  delete(id: string): boolean {
    let len = this.data.length;
    this.data = this.data.filter(u => u.id !== id);
    return this.data.length < len;
  }
}

class Stack<T> {
  private items: T[] = [];

  push(item: T): void {
    this.items.push(item);
  }

  pop(): T | undefined {
    return this.items.pop();
  }

  peek(): T | undefined {
    return this.items[this.items.length - 1];
  }

  get size(): number {
    return this.items.length;
  }
}

let numStack = new Stack<number>();
numStack.push(1);
numStack.push(2);
numStack.push(3);
console.log(numStack.pop());   // 3
console.log(numStack.peek());  // 2
console.log(numStack.size);    // 2

let strStack = new Stack<string>();
strStack.push("a");
strStack.push("b");
console.log(strStack.pop());   // "b"

class GenericClass<T> {
  // static defaultValue: T;  // ❌ Static members cannot reference a class's type parameters

  // ✅ Static methods require their own type parameters.
  static create<U>(value: U): GenericClass<U> {
    let instance = new GenericClass<U>(value);
    return instance;
  }

  constructor(public value: T) {}
}

let instance = GenericClass.create("hello");  // GenericClass<string>

interface HasLength {
  length: number;
}

// T Must have length Properties
function logLength<T extends HasLength>(value: T): void {
  console.log(`Length：${value.length}`);
}

logLength("hello");        // ✅ string has length
logLength([1, 2, 3]);      // ✅ The array contains length
logLength({ length: 10 }); // ✅ Objects include length
// logLength(42);          // ❌ number None length

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}

let user = { name: "Charlie", age: 20, email: "xiao@example.com" };

console.log(getProperty(user, "name"));   // ✅ "Charlie" —— K = "name"
console.log(getProperty(user, "age"));    // ✅ 20 —— K = "age"
// getProperty(user, "phone");            // ❌ "phone" No user the key

function createInstance<T>(Constructor: new () => T): T {
  return new Constructor();
}

class Dog {
  bark() { return "Woof！"; }
}

let dog = createInstance(Dog);
console.log(dog.bark());  // "Woof！"

function pick<T, K extends keyof T>(obj: T, ...keys: K[]): Pick<T, K> {
  let result = {} as Pick<T, K>;
  for (let key of keys) {
    result[key] = obj[key];
  }
  return result;
}

let user = { id: 1, name: "Charlie", email: "c@example.com", age: 25 };

let summary = pick(user, "id", "name");
// Type: { id: number; name: string }
console.log(summary.name);  // "Charlie"
// summary.email;           // ❌ email was not picked

Charlie

function merge<T extends object, U extends object>(a: T, b: U): T & U {
  return { ...a, ...b };
}

let defaults = { host: "localhost", port: 3000 };
let custom = { port: 8080, debug: true };

let config = merge(defaults, custom);
// Inference Types: { host: string; port: number } & { port: number; debug: boolean }
// After simplification: { host: string; port: number; debug: boolean }

console.log(config.host);   // "localhost"
console.log(config.port);   // 8080
console.log(config.debug);  // true

localhost
8080
true

// Examples of Actual Use
interface User {
  id: number;
  name: string;
  email: string;
  age: number;
}

// When creating a user id Not required
type CreateUser = Omit<User, "id">;

// All fields are optional when updating a user
type UpdateUser = Partial<User>;

// The user summary includes only some fields
type UserSummary = Pick<User, "id" | "name">;

let newUser: CreateUser = { name: "Charlie", email: "xiao@example.com", age: 20 };
let update: UpdateUser = { age: 21 };
let summary: UserSummary = { id: 1, name: "Charlie" };