0% found this document useful (0 votes)
6 views13 pages

JavaScript Projects for Beginners

The document contains 10 JavaScript programs that demonstrate various date and time functions, string manipulation, mathematical calculations, and user input/output. The programs each contain the full code to display the output of short JavaScript tasks.

Uploaded by

tyhxondukd
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
6 views13 pages

JavaScript Projects for Beginners

The document contains 10 JavaScript programs that demonstrate various date and time functions, string manipulation, mathematical calculations, and user input/output. The programs each contain the full code to display the output of short JavaScript tasks.

Uploaded by

tyhxondukd
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

1.

Write a JavaScript program to display the current day and


time .

<!DOCTYPE html>
<html lang="en">
<head>
<title>Display Current Day and Time</title>
</head>
<body>

<h1>Display Current Day and Time</h1>


<div id="output"></div>

<script>
function displayCurrentDayAndTime() {
let now = new Date();
let days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday",
"Saturday"];
let day = days[[Link]()];
let time = [Link]();
[Link]('output').innerText = `Today is: ${day}\nCurrent time is:
${time}`;
}
</script>

</body>
</html>

OUTPUT :
2. Write a JavaScript program to print the contents of the
current window.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Print Current Window</title>
</head>
<body>

<h1>Print Current Window</h1>


<button onclick="printCurrentWindow()">Print</button>

<script>
function printCurrentWindow() {
[Link]();
}
</script>

</body>
</html>

OUTPUT :
3. Write a JavaScript program to get the current date.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Get Current Date</title>
</head>
<body>

<h1>Get Current Date</h1>


<div id="output"></div>

<script>
function getCurrentDate() {
let now = new Date();
let date = [Link]();
[Link]('output').innerText = `Current date is: ${date}`;
}
getCurrentDate()
</script>

</body>
</html>

OUTPUT :
4. Write a JavaScript program to find the area of a triangle where
lengths of the three of its sides are 5, 6, 7.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Triangle Area</title>
</head>
<body>

<h1>Find Triangle Area</h1>


<div id="output"></div>

<script>
function displayTriangleArea() {
let a = 5, b = 6, c = 7;
let s = (a + b + c) / 2;
let area = [Link](s * (s - a) * (s - b) * (s - c));
[Link]('output').innerText = `Area of the triangle: ${area}`;
}
displayTriangleArea()
</script>

</body>
</html>

OUTPUT :
[Link] a JavaScript program to rotate the string 'resource' in
right direction by periodically removing one letter from the end of
the string and attaching it to the front.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Rotate String</title>
</head>
<body>
<h1>Rotate String 'resource'</h1>
<div id="output"></div>

<script>
function rotateString(str) {
let arr = [Link]('');
setInterval(function() {
let lastChar = [Link]();
[Link](lastChar);
[Link]('output').innerText = [Link]('');
}, 1000);
}
rotateString('resource')
</script>

</body>
</html>

OUTPUT :
6. Write a JavaScript program to determine whether a given year
is a leap year in the Gregorian calendar.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Check Leap Year</title>
</head>
<body>

<h1>Check Leap Year</h1>


<div id="output"></div>

<script>
function checkLeapYear() {
let year = parseInt(prompt("Enter a year to check if it's a leap year:"));
let isLeap = ((year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0));
[Link]('output').innerText = `${year} is a leap year: ${isLeap}`;
}
checkLeapYear();
</script>

</body>
</html>

OUTPUT :
7. Write a JavaScript program to find 1st January is being a
Sunday between 2014 and 2050.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Find Sundays on 1st January</title>
</head>
<body>

<h1>Find Sundays on 1st January (2014-2050)</h1>


<div id="output"></div>

<script>
function findSundayYears() {
let output = '';
for (let year = 2014; year <= 2050; year++) {
let date = new Date(year, 0, 1); // January 1st of the year
if ([Link]() === 0) {
output += `1st January is a Sunday in the year: ${year}\n`;
}
}
[Link]('output').innerText = output;
}
findSundayYears();
</script>

</body>
</html>

OUTPUT :
8. Write a JavaScript program where the program takes a
random integer between 1 to 10, the user is then prompted to
input a guess number. If the user input matches with guess
number, the program will display a message "Good Work"
otherwise display a message "Not matched".

<!DOCTYPE html>
<html lang="en">
<head>
<title>Guessing Game</title>
</head>
<body>

<h1>Guessing Game</h1>
<button onclick="guessingGame()">Play Game</button>

<script>
function guessingGame() {
let randomNumber = [Link]([Link]() * 10) + 1;
let userGuess = prompt("Guess a number between 1 and 10:");

if (parseInt(userGuess) === randomNumber) {


alert("Good Work");
} else {
alert("Not matched. The number was " + randomNumber);
}
}
</script>

</body>
</html>
OUTPUT :
9. Write a JavaScript program to calculate days left until next
Christmas.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Days Until Christmas</title>
</head>
<body>

<h1>Days Until Christmas</h1>


<div id="output"></div>

<script>
function daysUntilChristmas() {
let now = new Date();
let year = [Link]();
let christmas = new Date(year, 11, 25);

if ([Link]() > [Link]()) {


[Link](year + 1);
}

let oneDay = 24 * 60 * 60 * 1000;


let daysLeft = [Link](([Link]() - [Link]()) / oneDay);

[Link]('output').innerText = `Days until next Christmas: ${daysLeft}`;


}
daysUntilChristmas();
</script>

</body>
</html>
OUTPUT :
10. Write a JavaScript program to calculate multiplication and
division of two numbers (input from user).

<!DOCTYPE html>
<html lang="en">
<head>
<title>Multiplication and Division</title>
</head>
<body>

<h1>Multiplication and Division</h1>


<button onclick="calculateMultiplicationAndDivision()">Calculate</button>
<div id="output"></div>

<script>
function calculateMultiplicationAndDivision() {
let num1 = parseFloat(prompt("Enter the first number:"));
let num2 = parseFloat(prompt("Enter the second number:"));

let multiplication = num1 * num2;


let division = num1 / num2;

[Link]('output').innerText = `Multiplication result:


${multiplication}\nDivision result: ${division}`;
}
</script>

</body>
</html>
OUTPUT :

Common questions

Powered by AI

A JavaScript program can find the years where the 1st of January is a Sunday by iterating over each year in the range and creating a date object for January 1st of each year. Using `date.getDay()`, check if the result is 0 (Sunday). If true, append the year to the output. This can be done with a simple loop from 2014 to 2050 in the `findSundayYears` function .

To rotate a string by moving its last character to the beginning periodically in JavaScript, you can use the `setInterval` function to perform the operation at regular intervals. Start by splitting the string into an array of characters. Use `arr.pop()` to remove the last character and `arr.unshift(lastChar)` to insert it at the beginning. Use `document.getElementById('output').innerText = arr.join('');` to display the rotated string. This approach ensures continuous string rotation every second as implemented in the given `rotateString` function .

The guessing game can be implemented by generating a random number between 1 and 10 using `Math.floor(Math.random() * 10) + 1`. The user is prompted to input a guessed number. If the guessed number matches the generated random number, an alert displays 'Good Work'; otherwise, it shows 'Not matched' with the correct number. This logic is handled in the `guessingGame` function .

Heron's formula calculates the area of a triangle when the lengths of all sides are known. The formula states that if a, b, and c are the lengths of the sides, and s is the semi-perimeter `(a+b+c)/2`, then the area is `√(s(s-a)(s-b)(s-c))`. The JavaScript implementation for sides 5, 6, and 7 calculates s as `(5 + 6 + 7) / 2 = 9` and then evaluates the area using the formula, resulting in the output from `displayTriangleArea()` .

The program checks if the current date is after December 25th of the current year. If so, it sets Christmas to December 25th of the next year. It then calculates the difference in milliseconds between now and Christmas, converts this to days using `24*60*60*1000` milliseconds per day, and rounds the result to get the days left. This is achieved using `daysUntilChristmas()` function .

The method used in JavaScript to print the contents of the current window is `window.print()`. This can be attached to a button click event to initiate the printing operation, a common feature in web applications for generating hard copies of documents or web page views .

To rotate the string 'resource', set an interval to remove the last character using `arr.pop()` and prepend it to the start using `arr.unshift(lastChar)`. The interval controls the periodic rotation, moving one character per second to the beginning, which simulates flowing rotation displayed in real-time .

The program obtains two numbers via user input with `prompt()`, parses them as floats, and then calculates multiplication using `num1 * num2` and division using `num1 / num2`. Results are displayed by updating a webpage element. This basic arithmetic operation is efficient for demonstrating user input handling and real-time calculation display within web pages .

The algorithm to determine if a year is a leap year checks whether the year is divisible by 4 but not by 100, or divisible by 400. This can be expressed in JavaScript as `let isLeap = ((year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0));` This checks the standard rules for leap years in the Gregorian calendar .

In determining if a given input year is a leap year, the program prompts the user for a year, checks the leap year conditions with `let isLeap = ((year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0));` If true, it displays the result in a webpage element, indicating if the input year is a leap year .

You might also like