Wednesday, June 30, 2021

TypeScript - String | Example | Demo

String is another primitive data type that is used to store text data. String values are surrounded by single quotation marks or double quotation marks.
Method Description
charAt() Returns the character at the given index
concat() Returns a combination of the two or more specified strings
indexOf() Returns an index of first occurrence of the specified substring from a string (-1 if not found)
replace() Replaces the matched substring with a new substring
split() Splits the string into substrings and returns an array
toUpperCase() Converts all the characters of the string into upper case
toLowerCase() Converts all the characters of the string into lower case
charCodeAt() Returns a number that is the UTF-16 code unit value at the given index
codePointAt() Returns a nonnegative integer Number that is the code point value of the UTF-16 encoded code point starting at the specified index
includes() Checks whether a string includes another string
endsWith() Checks whether a string ends with another string
LastIndexOf() Returns the index of last occurrence of value in the string
localeCompare() Checks whether a string comes before, after or is the same as the given string
match() Matches a regular expression against the given string
normalize() Returns the Unicode Normalization Form of the given string.
padEnd() Pads the end of the current string with the given string
padStart() Pads the beginning of the current string with given string
repeat() Returns a string consisting of the elements of the object repeated in the given times.
search() Searches for a match between a regular expression and a string
slice() Returns a section of a string
startsWith() Checks whether a string starts with another string
substr() Returns a string beginning at the specified location and of the given characters
substring() Returns a string between the two given indexes
toLocaleLowerCase() Returns a lower case string while respecting current locale
toLocaleUpperCase() Returns an upper case string while respecting current locale
trim() Trims the white space from beginning and end of string
trimLeft() Trims the white space from left side of the string
trimRight() Trims the white space from right side of the string


Demo





TypeScript Data Type - Number Example | Demo

JavaScript, TypeScript supports number data type. All numbers are stored as floating point numbers. These numbers can be Decimal (base 10), Hexadecimal (base 16) or Octal (base 8);

Numbers Method


Method Description
toExponential() Returns the exponential notation in string format.
toFixed() Returns the fixed-point notation in string format.
toLocaleString() Converts the number into a local specific representation of the number.
toPrecision() Returns the string representation in exponential or fixed-point to the specified precision.
toString() Returns the string representation of the number in the specified base.
valueOf() Returns the primitive value of the number.



Data Type Demo




TypeScript - Variable With Example Demo ( var, let ,const)



TypeScript follows the same rules as JavaScript for variable declarations. Variables can be declared using: var, let, and const.

var

Variables in TypeScript can be declared using var keyword, same as in JavaScript. The scoping rules remains the same as in JavaScript.

let

To solve problems with var declarations, ES6 introduced two new types of variable declarations in JavaScript, using the keywords let and const. TypeScript, being a superset of JavaScript, also supports these new types of variable declarations.

Const

Variables can be declared using const similar to var or let declarations. The const makes a variable a constant where its value cannot be changed. Const variables have the same scoping rules as let variables.
Demo:
Demo:

TypeScript - Type Annotations With Example Demo

TypeScript - Type Annotations

TypeScript is a typed language, where we can specify the type of the variables, function parameters and object properties. We can specify the type using :Type after the name of the variable, parameter or property. There can be a space after the colon. TypeScript includes all the primitive types of JavaScript- number, string and boolean.

Type annotations are used to enforce type checking. It is not mandatory in TypeScript to use type annotations. However, type annotations help the compiler in checking types and helps avoid errors dealing with data types. It is also a good way of writing code for easier readability and maintenance by future developers working on your code.

We can still follow the JavaScript way of declaring variables and have the TypeScript compiler infer the data type of the variable.

The following example demonstrates the type annotation of paramters. Similarly, we can declare an object with inline annotations for each of the properties of the object.

Typescript Program and Example

Here You will be learn Simple Program in Typscript With Demo

How to Install Typescript


Install TypeScript

There are three ways to install TypeScript:

  1. Install TypeScript as an NPM package on your local machine or in your project.
  2. Install TypeScript NuGet Package in your .NET or .NET Core project.
  3. Install TypeScript as a Plug-in in your IDE (Integrated Development Environment).

Install TypeScript using NPM

NPM (Node.js package manager) is used to install the TypeScript package on your local machine or a project. Make sure you have Node.js install on your local machine. If you are using JavaScript frameworks for your application, then it is highly recommended to install Node.js.

To install or update the latest version of TypeScript, open command prompt/terminal and type the following command:

npm install -g typescript

The above command will install TypeScript globally so that you can use it in any project. Check the installed version of TypeScript using the following command:

tsc -v

Execute the following command to install the TypeScript to your local project as dev dependency.

npm install typescript --save-dev

Install TypeScript as NuGet Package

For .NET or .NET Core projects, TypeScript can be installed as a NuGet package in your project. The NuGet package Microsoft.TypeScript.MSBuild is an MSBuild task for TypeScript, which will automatically compile all .ts files to .js files as per tsconfig.json configuration when you build your project.

To install the TypeScript NuGet package, open NuGet Package Manager by right-clicking on a project node, click Manage NuGet Packages.., and search for typescript in the Browse tab. It will list all the packages related to TypeScript. Select Microsoft.TypeScript.MSBuild and click on the Install button. This will install TypeScript in your local ASP.NET project.

TypeScript Visual Studio Extension

If your project type does not support the NuGet packages, then you can use TypeScript Visual Studio Extension. You can find and install the extension in Visual Studio from Tools > Extensions and Updates menu.

Visual Studio Code comes with built-in support for TypeScript.

Install TypeScript Plug-in in your IDE

You can install an IDE specific TypeScript package or plugin for your IDE.

A few examples of plugins for popular code editors are:

  1. Atom-TypeScript: a TypeScript language service for Atom developed by TypeStrong.
  2. TypeScript IDE for Eclipse: an Eclipse plugin developed by Angelo Zerr.
  3. TypeScript Plug-in for Eclipse: an Eclipse plugin developed by Palantir.
  4. WebStorm includes TypeScript support out of the box.

Visit TypeScript Github Repository for the full list of IDEs that support TypeScript development.

TypeScript Playground

TypeScript provides an online playground https://www.typescriptlang.org/play to write and test your code on the fly without the need to download or install anything.

This is a great place for beginners to learn TypeScript and try different TypeScript features. You also have the option to share your code via a shareable link provided by the playground.

TypeScript Best Important Features


  • Cross-Platform: TypeScript runs on any platform that JavaScript runs on. The TypeScript compiler can be installed on any Operating System such as Windows, macOS, and Linux.
  • Object-Oriented Language: TypeScript provides powerful features such as Classes, Interfaces, and Modules. You can write pure object-oriented code for client-side as well as server-side development.
  • Static type-checking: TypeScript uses static typing. This is done using type annotations. It helps type checking at compile time. Thus, you can find errors while typing the code without running your script each time. Additionally, using the type inference mechanism, if a variable is declared without a type, it will be inferred based on its value.
  • Optional Static Typing: TypeScript static typing is optional, if you prefer to use JavaScript's dynamic typing.
  • DOM Manipulation: Like JavaScript, TypeScript can be used to manipulate the DOM.
  • ES 6 Features: TypeScript includes most features of planned ECMAScript 2015 (ES 6, 7) such as class, interface, Arrow functions etc.

What is TypeScript

TypeScript is an open-source object-oriented language developed and maintained by Microsoft, licensed under Apache 2 license. It is a typed superset of Javascript that compiles to plain JavaScript. TypeScript was developed under Anders Hejlsberg, who also led the creation of the C# language. TypeScript was first released in October 2012.

Sunday, June 13, 2021

Angular pass data app to child component

Below you can see Demo

Sending data to a parent component @Output


Sending data to a parent component @Output

The child component uses the @Output() property to raise an event to notify the parent of the change. To raise an event, an @Output() must have the type of EventEmitter, which is a class in @angular/core that you use to emit custom events.

Angular Pipe

Here You can see Angular Pipe

DatePipe: Formats a date value according to locale rules.

UpperCasePipe: Transforms text to all upper case.

LowerCasePipe: Transforms text to all lower case.

CurrencyPipe: Transforms a number to a currency string, formatted according to locale rules.

DecimalPipe: Transforms a number into a string with a decimal point, formatted according to locale rules.

PercentPipe: Transforms a number to a percentage string, formatted according to locale rules.

Hackerrank Day 1: Data Types

process.stdin.resume();
process.stdin.setEncoding('ascii');
var input_stdin = "";
var input_stdin_array = "";
var input_currentline = 0;
process.stdin.on('data', function (data) {
input_stdin += data;
});
process.stdin.on('end', function () {
input_stdin_array = input_stdin.split("\n");
main();
});
// Reads complete line from STDIN
function readLine() {
return input_stdin_array[input_currentline++];
}
function main() {
var i = 4
var d = 4.0
var s = "HackerRank "
// Declare second integer, double, and String variables.
var i2 = +(readLine());
// Read and save an integer, double, and String to your variables.
var d2 = +(readLine());
// Print the sum of both integer variables on a new line.
console.log(i + i2)
// Print the sum of the double variables on a new line.
console.log((d + d2).toFixed(1));
// Concatenate and print the String variables on a new line
// The 's' variable above should be printed first.
var s2 = readLine();
console.log(s + s2);
}

Hackerrank Day 0: Hello, World

function processData(inputString) {
// This line of code prints the first line of output
console.log("Hello, World.");
// Write the second line of output that prints the contents of 'inputString' here.
}
process.stdin.resume();
process.stdin.setEncoding("ascii");
_input = "";
process.stdin.on("data", function (input) {
_input += input;
});
process.stdin.on("end", function () {
processData(_input);
});

HackerRank Angular Basic Weather Details Solution |Vijay Chauhan | #HackerRank #angularBasic

Demo Link

HackerRank Angular Basic Temperature Converter | Vijay Chauhan #HackerRank #angular #Temperature

DEMO : https://stackblitz.com/edit/angular-temperatureconverter?file=src%2Fapp%2Fapp.component.ts HackerRank Angular Basic Temperature Converter Solution

How to build an Express and Node.js app with Typescript

  In this tutorial, you will learn how to set up a Node.js and Express project with Typescript and live auto-reloading. Note that this metho...