Tasks & Solution of JavaScript Language

1. Alert Function

1) Write a script to greet your website visitor using JS alert box.

Output:

Source Code

let greet=alert("Hello User!");
console.log(greet)

2) Write a script to display following message on your web page: (Hint : Use line break)

Output:

Source Code

let password=123;
let pass=+prompt("Enter Password:")
if(pass===password){
alert("Congratulations!");}
else{
alert("Enter Valid Password");}

3) Write a script to display following message on your web page.

Output:

Source Code

let show=alert("Welcome to JS Land...\r\n Happy Coding");
console.log(show)

4) Write a script to display following messages in sequence:

Output:

Source Code

let show=alert("Welcome to JS Land...");
let show2=alert("Happy Coding")
console.log(show+show2)

5) Generate the following message through browser’s developer console:

Output:

Source Code

alert("Hello.. I can run JS through my web browser's console");

2. User Input

1) Write a program that takes input a name from user & greet the user like this:

Output:

Source Code

let input=prompt("Enter your Name:");
let print=alert("Hello "+ input);
console.log(print)

2) Write a program to take input a number from user & display it’s multiplication table on your browser. If user does not enter a new number, multiplication table of 5 should be displayed by default.

Output:

Source Code

let table=prompt("Enter table Number:");
if(table===""){
for(let i=1;i<=10;i++){
console.log("5 x "+ i+ "= "+ (5*i));}}
else{
for(let i=1;i<=10;i++){
console.log(table+" x "+ i+ "= "+ (table*i));}}

3) Write a program to take “city” name as input from user. If user enters “Karachi”, welcome the user like this: “Welcome to city of lights”

Output:

Source Code

let table=prompt("Enter city Name:");
console.log("Welcome to "+ table);
if(table==='karachi'||table==='Karachi'){
alert("Welcome to city of lights")
console.log("Welcome to city of lights")}
else{
alert("Welcome to "+ table)
console.log("Welcome to "+ table);}

4) Write a program to take “gender” as input from user. If the user is male, give the message: Good Morning Sir. If the user is female, give the message: Good Morning Madam.

Output:

Source Code

let gender=prompt("Enter your gender:");
if(gender==='male'){
alert("Good Mornig Sir");}
else{
alert("Good Morning Madam")}

5) Write a program to take input color of road traffic signal from the user & show the message according to this table:

Output:

Source Code

let light=prompt("Enter light color");
if(light==='red'){
alert("Stop");}
else if(light==="yellow"){
alert("Start");}
else{
alert("Go")}

6) Write a program to take input max age & current age from user. If the current age is less than or equal to max age, show the message “You are welcome”

Output:

Source Code

var maxAge=+prompt("Enter your maximum age");
var curAge=+prompt("Enter your current age");
if(curAge<=maxAge){
alert("You are welcome");}

7) Write a program to take input remaining fuel in car (in litres) from user. If the current fuel is less than 0.25litres, show the message “Please refill the fuel in your car”

Output:

Source Code

var fuel=+prompt("Enter remaining fuel of your car in litres");
var curFuel=0.25;
if(fuel alert("Please refill the fuel in your car");}

3. Conditional Statements

1) Write a program to check whether the given input number is divisible by 3 or else show a message “Number is not divisible by 3”.

Output:

Source Code

let num=+prompt("Enter any Number:");
if(num%3===0){
console.log("The given Number is divisible by 3");}
else{
console.log("The given Number is not divisible by 3");}

2) Write a program that checks whether the given input is an even number or an odd number.

Output:

Source Code

let num=+prompt("Enter any Number:");
if(num%2===0){
console.log("This is Even Number");}
else{
console.log("This is Odd Number");}

3) Write an if/else statement with the following condition: If the variable age is greater than 18, output "Old enough", otherwise output "Too young".

Output:

Source Code

let age=+prompt("Enter age:");
if(age>18){
console.log("Old enough");}
else{
console.log("Too young");}

4) Write a program to check whether the given input number is divisible by 3 or not by using Switch Case statements. Show a message “Number is not divisible by 3” or “Number is divisible by 3”.

Output:

Source Code

let num=+prompt("Enter Number:");
switch(num%3){
case 0:
console.log("This Number is divisible by 3");
break;
default:
console.log("This Number is not divisible by 3");}

5) Write a program to create a calculator for +, -, *, /, % using switch case statements. (number1, number2 and operator will be input)

Output:

Source Code

let num1=+prompt("Enter First Number");
let num2=+prompt("Enter Second Number");
let opt=prompt("Enter Operator");
switch(opt){
case "+":
console.log(`The Addition of ${num1} and ${num2} is ${num1+num2} `);
break;
case "-":
console.log(`The Subtraction of ${num1} and ${num2} is ${num1-num2} `);
break;
case "*":
console.log(`The Multiplication of ${num1} and ${num2} is ${num1*num2} `);
break;
case "/":
console.log(`The Division of ${num1} and ${num2} is ${num1/num2} `);
break;
default:
console.log("Please enter correct Operator");}

4. Loops

1) . Write a program to display the message “Hello World” 5 times in your browser using for loop.

Output:

Source Code

for(let i=1;i<=5;i++){
console.log(i+" Hello World")
}

2) Write a program to print numeric counting from 1 to 10.

Output:

Source Code

for(let i=1;i<=10;i++){
console.log(i);
}

3) Write a program to print multiplication table of any number using for loop. Table number & length should be taken as an input from user.

Output:

Source Code

let tableNum=+prompt("Enter Table Number");
let times=+prompt("How many times the table would be print?");
for(let i=1;i<=times;i++){
console.log(tableNum+" x "+i+" = "+(tableNum*i));}

4) You have an array
A = [“Nokia”, “Samsung”, “Apple”, “Sony”, “Huawei”]
Write each element on new line with the help of for loop.

Output:

Source Code

let arr= ["Nokia", "Samsung", "Apple", "Sony", "Huawei"];
for(let i=0;i console.log(arr[i])}

6. Array

1) Declare an empty array using JS literal notation to store student names in future.

Output

JavaScript Source Code

let studentNames=[];
studentNames.push("Shoaib",'Akhter');
console.log(studentNames)

2) Declare and initialize a strings array.

Output

JavaScript Source Code

let studentNames=[];
studentNames.push("Shoaib",'Akhter');
console.log(studentNames)

3) Declare and initialize a numbers array.

Output

JavaScript Source Code

let numbers=[2,3,4];
numbers.unshift(0,1);
console.log(numbers)

4) Declare and initialize a boolean array.

Output

JavaScript Source Code

let boolean=[true,false];
console.log(boolean)

5) Declare and initialize a mixed array.

Output

JavaScript Source Code

let mixedArray=[0,1,2,"Shoaib","Akhter",true,false];
console.log(mixedArray)

6) Declare and Initialize an array and store available mobile networks in Pakistan.

Output

JavaScript Source Code

let network=["Zong","Ufone","Jazz","Warid"];
console.log(network)

7) Declare and Initialize an array and store available education qualifications in Pakistan (eg. SSC, HSC, BCS, BS, BCOM, MS,M. Phil., PhD). Show the listed qualifications in your browser.

Output

JavaScript Source Code

let education=["SSC", "HSC"," BCS"," BS"," BCOM"," MS","M. Phil","PhD"];
console.log(education)

8) Declare and initialize an empty array to store top Names of university. Add Names one by one in an array. Display the elements & length of array in your browser. (Use array’s length method).

Output

JavaScript Source Code

let education=["Bahria Uni","Fast Uni","Al-Madinah Uni","NED Uni"];
console.log(education.length)
console.log(education)

9) Declare and Initialize an array with your favorite cars. Show that
a. First index of the array
b. Car at first index of the array
c. Last index of the array
d. Car at last index of the array

Output

JavaScript Source Code

let car=["Corola","Passo","Mehran","Civic"];
console.log(car)
console.log("The car at first index is "+car[0])
console.log("The car at last index is "+car[3])

9. String Methods

1) Write a program that takes two user inputs for first and last name using prompt and merge them in a new variable titled fullName. Greet the user using his full name.

Output:

JavaScript Source Code

let firstName=prompt("Enter your first Name");
let lastName=prompt("Enter your last Name");
let fullName=firstName+lastName;
alert("Your fullName is "+fullName);

2) Write a program to take a user input about his favorite mobile phone model. Find and display the length of user input in your browser.

Output:

JavaScript Source Code

let names=prompt("Enter Mobile Phone Model");
alert("The length of Mobile phone model is "+names.length);

3) Write a program to find the index of letter “n” in the word “Pakistani” and display the result in your browser.

Output:

JavaScript Source Code

let indexNumber="Pakistan";
for(let i=0;i if(indexNumber[i]=="n"){
alert("The index number of n is "+i);
document.write("The index number of n is "+i)}}

4) Write a program to find the last index of letter “l” in the word “Hello World” and display the result in your browser.

Output:

JavaScript Source Code

let word="Hello World";
alert("The index of last L is "+word.lastIndexOf("l"));

5) Write a program to find the character at 3rd index in the word “Pakistani” and display the result in your browser.

Output:

JavaScript Source Code

let word="Pakistan";
alert("The third index in Pakistan name is "+word[3]);

10. Map Method

1) Write a program that takes two user inputs for first and last name using prompt and merge them in a new variable titled fullName. Greet the user using his full name.

HTML Source Code

JavaScript Source Code

2) Write a program to take a user input about his favorite mobile phone model. Find and display the length of user input in your browser.

HTML Source Code

JavaScript Source Code

3) Write a program to find the index of letter “n” in the word “Pakistani” and display the result in your browser.

HTML Source Code

JavaScript Source Code

4) Write a program to find the last index of letter “l” in the word “Hello World” and display the result in your browser.

HTML Source Code

JavaScript Source Code

5) Write a program to find the character at 3rd index in the word “Pakistani” and display the result in your browser.

HTML Source Code

JavaScript Source Code

11. Filter Method

1) Write a program that takes two user inputs for first and last name using prompt and merge them in a new variable titled fullName. Greet the user using his full name.

HTML Source Code

JavaScript Source Code

2) Write a program to take a user input about his favorite mobile phone model. Find and display the length of user input in your browser.

HTML Source Code

JavaScript Source Code

3) Write a program to find the index of letter “n” in the word “Pakistani” and display the result in your browser.

HTML Source Code

JavaScript Source Code

4) Write a program to find the last index of letter “l” in the word “Hello World” and display the result in your browser.

HTML Source Code

JavaScript Source Code

5) Write a program to find the character at 3rd index in the word “Pakistani” and display the result in your browser.

HTML Source Code

JavaScript Source Code

12. Reduce Method

1) Write array of numbers and add amoung them by using Reduce Method and print result.

Output:

Source Code:

let numbers=[1,2,3,4];
let sum=numbers.reduce((accum,item)=>{
return accum+item
},0);
console.log(sum);

2) write array of numbers and multiply amoung them by using Reduce Method and print result.

Output:

Source Code:

let num=[5,2,4,6,9,1];
let product=num.reduce((accum,item)=>{
return accum*item
},1);
console.log(product)

3) Make array and write names of any living thing and count that living thing who came in many times.

Output:

Source Code:

let pets=['dog','cat','chicken','dog','chicken','rabit'];
let petscount=pets.reduce((accum,item)=>{
if(accum[item]){
accum[item]++;}
else{
accum[item]=1;}
return accum;
},{})
console.log(petscount);

4) Write a program in which show greater number in console screen by using Reduce Method.

Output:

Source Code:

let num=[5000,6000,81,10,112,99999, 2030];
let large=num.reduce((accum,item)=>{
if(accum < item ) {
return item;}
else{
return accum}
},1)
console.log(large)

13. Classes

1) Make one class and make constructor and give parameters and make function in Animal class and display output.

Output:

Source Code:

class Animal{
constructor(name,legs,color){
this.name=name;
this.legs=legs;
this.color=color;}
eat(){
console.log(`${this.name} eats bone`);}}
let anim=new Animal("Dogs",4,"White");
console.log(anim)
anim.eat()

2) Write a Animal class with constructor and make two more child class and inherits its Parent class.

Output:

Source Code:

class Animal{
constructor(name,legs){
this.name=name;
this.legs=legs;}
speed1(name,name1){
console.log(name+` runs `+name1)}}
class Rabit extends Animal{
constructor(name,legs,speed,quality){
super(name,legs);
this.speed=speed;
this.quality=quality;}}
class Turtle extends Animal{
constructor(name,legs,quality,specialPower){
super(name,legs);
this.quality=quality;
this.specialPower=specialPower;}}
let rabit=new Rabit("rabit",4,"fast",'hide');
let turtle=new Turtle("turtle",4,"consistent",'hard shell');
console.log(rabit,turtle)
rabit.speed1("Rabit","Fast");
turtle.speed1("Turtle","Slow")