FSD-II Practical Assignment 5

 5.1Understand how generics can enhance type safety and code reusability

in TypeScript -Create a TypeScript function that accepts an array of any

type and returns the first element of that array.

npm install -g typescript

genericfunction.ts

function getFirstElement<T>(array: T[]): T | undefined {

return array[0];

}

// Using the function with a number array

const numbers = [1, 2, 3, 4];

const firstNumber = getFirstElement(numbers);

console.log(firstNumber); // Output: 1

// Using the function with a string array

const strings = ["apple", "banana", "cherry"];

const firstString = getFirstElement(strings);

console.log(firstString); // Output: "apple"

// Using the function with an array of objects

const objects = [{ id: 1 }, { id: 2 }, { id: 3 }];

const firstObject = getFirstElement(objects);

console.log(firstObject); // Output: { id: 1 }


PS C:\Users\admin\angular> tsc genericfunction.ts

PS C:\Users\admin\angular> node genericfunction.js

1

apple

{ id: 1 }


2. - Refactor the function to use generics to enforce type safety.

// Function to get the first element of an array


function getFirstElement<T>(array: T[]): T | undefined {

if (array.length === 0) {

return undefined; // Explicitly return undefined if the array is empty

}

return array[0];

}

// Using the function with different types


// Array of numbers

const numbers = [1, 2, 3, 4];

const firstNumber = getFirstElement(numbers);

console.log(firstNumber); // Output: 1


// Array of strings

const strings = ["apple", "banana", "cherry"];

const firstString = getFirstElement(strings);

console.log(firstString); // Output: "apple"


// Array of objects

const objects = [{ id: 1 }, { id: 2 }, { id: 3 }];

const firstObject = getFirstElement(objects);

console.log(firstObject); // Output: { id: 1 }


// Empty array

const emptyArray: number[] = [];

const firstElement = getFirstElement(emptyArray);

console.log(firstElement); // Output: undefined


Output

PS C:\Users\admin\angular> tsc genericfunction.ts

PS C:\Users\admin\angular> node genericfunction.js

1

apple

{ id: 1 }

Undefined


2.Create a generic class that implements a basic stack data structure (push,

pop, peek). - Test the stack class with different data types.


// Stack.ts

export class Stack<T> {

private items: T[] = [];

// Add an item to the stack

push(item: T): void {

this.items.push(item);

}

// Remove and return the top item from the stack

pop(): T | undefined {

return this.items.pop();

}

// Return the top item without removing it

peek(): T | undefined {


return this.items[this.items.length - 1];

}

// Return the size of the stack

size(): number {

return this.items.length;

}

// Check if the stack is empty

isEmpty(): boolean {

return this.size() === 0;

}

}


// Stack.test.ts

import { Stack } from './Stack';

// Test with numbers

const numberStack = new Stack<number>();

numberStack.push(1);

numberStack.push(2);

numberStack.push(3);

console.log('Number Stack');

console.log('Peek:', numberStack.peek()); // 3

console.log('Pop:', numberStack.pop()); // 3

console.log('Size:', numberStack.size()); // 2

// Test with strings

const stringStack = new Stack<string>();

stringStack.push('a');

stringStack.push('b');

stringStack.push('c');

console.log('String Stack');

console.log('Peek:', stringStack.peek()); // 'c'

console.log('Pop:', stringStack.pop()); // 'c'

console.log('Size:', stringStack.size()); // 2

// Test with objects

const objectStack = new Stack<{ id: number; name: string }>();

objectStack.push({ id: 1, name: 'Object1' });


objectStack.push({ id: 2, name: 'Object2' });

objectStack.push({ id: 3, name: 'Object3' });

console.log('Object Stack');

console.log('Peek:', objectStack.peek()); // { id: 3, name: 'Object3' }

console.log('Pop:', objectStack.pop()); // { id: 3, name: 'Object3' }

console.log('Size:', objectStack.size()); // 2


Output-

PS C:\Users\admin\angular> tsc Stack.test.ts


PS C:\Users\admin\angular> node Stack.test.js

Number Stack

Peek: 3

Pop: 3

Size: 2

String Stack

Peek: c

Pop: c

Size: 2

Object Stack

Peek: { id: 3, name: 'Object3' }

Pop: { id: 3, name: 'Object3' }

Size: 2

PS C:\Users\admin\angular>

Comments

Post a Comment

Popular posts from this blog

Slip 11: Write node js application that transfer a file as an attachment on web and enables browser to prompt the user to download file using express js.

  const express = require ( 'express' ); const path = require ( 'path' ); const app = express (); const PORT = 3000 ; // Route to download file app . get ( '/download' , ( req , res ) => {     res . download ( 'a.txt' , ( err ) => {         if ( err ) {             console . log ( "Error downloading file:" , err );         } else {             console . log ( "File sent successfully" );         }     }); }); // Home app . get ( '/' , ( req , res ) => {     res . send ( '<h2>Click below to download file</h2><a href="/download">Download File</a>' ); }); app . listen ( PORT , () => {     console . log ( `Server running at http://localhost: ${ PORT } ` ); });
Read more

Slip 7 Create a node js file named main.js for event-driven application. There should be a main loop that listens for events, and then triggers a callback function when one of those events is detected.

 // import event module var events = require('events'); // create an eventEmitter object var eventEmitter = new events.EventEmitter(); // create an event handler var connectHandler = function (s) {    console.log('Its', s); }; // Bind the data_received event eventEmitter.on('data_received', function (name) {    console.log(name, "Understood event -Driven"); }); // trigger data_received event eventEmitter.emit('data_received', "FYMSC(CS)"); // Bind the connection event eventEmitter.on('connection', connectHandler); // trigger connection event eventEmitter.emit('connection', "SIMPLE SOLUTION"); console.log("program Ended");
Read more

Slip 1(a) Write an Angular 13 application addition of two numbers using ng-init, ng-model & ng-bind. And also demonstrate ng-show, ng-disabled, ng-click directives on button component.

Image
 a) ng new slip1 b) cd slip1 c) open app.component.ts   import { Component } from '@angular/core' ; @ Component ({   selector : 'app-root' ,   templateUrl : './app.component.html' ,   styleUrls : [ './app.component.css' ] }) export class AppComponent {   num1 : number = 0 ;   num2 : number = 0 ;   result : number = 0 ;   disableButton : boolean = false ;   showResult : boolean = false ;   add () : void {     this . result = this . num1 + this . num2 ;     this . disableButton = true ;   // Disable the button after calculation     this . showResult = true ;       // Show the computed result   } }                                                                ...
Read more