Css Class Test1 qb-1

1. State the use of dot syntax in JavaScript with the help of suitable examples.
• The Properties and methods associated with any object can be accessed by using the object name with
a dot syntax (period), e.g. user.fname, user.lname and user.fullName().
• Dot syntax is used to describe to Javascript how to interact with the objects, properties, functions and
events in an application.
Extending an Object:
• Add a new property to previously created object is called extending the object. Following example is
showing the concept of extending an object.
Example
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<script>
var student =
{
firstName: "Amit",
lastName: "Gupta",
id: 12,
fullName: function () {
return this.firstName + " " + this.lastName
}
};
student.class = "Fifth";
document.write("Student Id = " + student.id);
document.write("<br/>");
document.write("Student Class = " + student.class);
document.write("<br/>");
document.write("Student Name = " + student.fullName());
</script>
<body>
</body>
</html>
Output:
Student Id = 12
Student Class = Fifth
Student Name = Amit Gupta
• Here, student class is created using literal notation. After creating a student class we are adding a new
property i.e. class.
2. List and explain Logical operators in JavaScript.
3. Write a JavaScript that initializes an array called “Fruits” with names of five fruits. The script
then displays the array in a message box.
<html>
<head>
<title>Fruits</title>
<script language="javascript">
var Fruits = new Array("Apple", "Mango", "Banana", "Watermelon", "Pear");

alert(Fruits);
</script>
</head>
<body>
</body>
</html>
4.
<html>
<head>
<title>Compute the average marks and grade</title>
</head>
<body>
<script>
var students = [['Advait', 80], ['Anay', 77], ['Manyata', 88], ['Saanvi', 95],
['Saachi', 68]];
var Avgmarks = 0;
for (var i = 0; i < students.length; i++) {
Avgmarks += students[i][1];
}
var avg = (Avgmarks / students.length);
document.write("Average grade: " + (Avgmarks) / students.length);
document.write("<br>");
if (avg < 60) {
document.write("Grade : E");
}
else if (avg < 70) {
document.write("Grade : D");
}
else if (avg < 80) {
document.write("Grade : C");
} else if (avg < 90) {
document.write("Grade : B");
} else if (avg < 100) {
document.write("Grade : A");
}
</script>
</body>
</html>
Output:
Average grade: 81.6
Grade : B
5. Differentiate between concat() and join() methods of array objects.
6. List the comparison operators in Javascript.

● Comparison operators are used in logical statements to determine equality or difference between
variables or values.
● Comparison operators are used to compare a condition and are always inside conditional statements.
● A comparison evaluates their true or false. These true or false values are called Booleans.
7. Write a Java script to create a person object with properties firstname, lastname, age, eyecolor,
delete eyecolor property and display remaining properties of person object.
<html>
<body>
<script>
var person = {
firstname: "John",
lastname: "Doe",
age: 50,
eyecolor: "blue"
};
delete person.eyecolor; //delete person eyecolor
document.write("After delete " + person.firstname + " " +
person.lastname + " "
+ person.age + " " + person.eyecolor);
</script>
</body>
</html>
Output : After delete John Doe 50 undefined
8. Write a Java script that initializes an array called flowers with the names of 3 flowers. The
script then displays array elements.
<html>
<head>
<title>Display Array Elements</title>
</head>
<body>
<script>
var flowers = new Array();
flowers[0] = 'Rose ';
flowers[1] = 'Mogra';
flowers[2] = 'Hibiscus';
for (var i = 0; i < flowers.length; i++) {
document.write(flowers[i] + '<br>');
}
</script>
</body>
</html>
9. Write Javascript to call function from HTML.
<html>
<head>
<title>Calling function from HTML</title>
<script>
function welcome() {
alert("Welcome students");
}
function goodbye() {
alert("Bye");
}
</script>
</head>
<body onload="welcome()" onunload="goodbye()">

</body>
</html>
10. Write a Javascript to design a form to accept values for user ID & password.
<html>
<body>
<form name="login">
Enter Username <input type="text" name="userid"><br>
Enter Password <input type="password" name="pswrd">
<input type="button" onclick="display()" value="Display">
</form>
<script language="javascript">
function display() {
document.write("User ID = " + login.userid.value + "<br>
Password = " + login.pswrd.value);
}
</script>
</body>
</html>
11. Explain prompt() and confirm() method of Java script with syntax and example.
prompt()
The prompt () method displays a dialog box that prompts the visitor for input.The prompt () method returns the
input value if the user clicks "OK". If the user clicks "cancel" the method returns null.
Syntax: window.prompt (text, defaultText)
Example:
<html>
<script type="text/javascript">
function msg() {
var v = prompt("Who are you?");
alert("I am " + v);
}
</script>
<input type="button" value="click" onclick="msg()" />
</html>
confirm()
It displays the confirm dialog box. It has message with ok and cancel buttons. Returns Boolean indicating
which button was pressed
Syntax:
window.confirm("sometext");
Example :
<html>
function msg() {
var v = confirm("Are u sure?");
if (v == true) {
alert("ok");
}
else {
alert("cancel");
}
}
</script>
<input type="button" value="delete record" onclick="msg()" />
</html>
12. Write the use of chatAt() and indexof() with syntax and example.
JavaScript String - charAt() Method
Description
charAt() is a method that returns the character from the specified index.
Characters in a string are indexed from left to right. The index of the first character is 0, and the index of the last
character in a string, called stringName, is stringName.length – 1.
Syntax
string.charAt(index);
Argument Details
index − An integer between 0 and 1 less than the length of the string.
Return Value
Returns the character from the specified index.
Example
<html>
<head>
<title>JavaScript String charAt() Method</title>
</head>
<body>
var str = new String("This is string");
document.writeln("str.charAt(0) is:" + str.charAt(0));
document.writeln("<br />str.charAt(1) is:" + str.charAt(1));
</script>
</body>
</html>
Output - str.charAt(0) is:T

str.charAt(1) is:h
str.charAt(2) is:i
str.charAt(3) is:s
str.charAt(4) is:
str.charAt(5) is:i
JavaScript String - indexOf() Method
Description
This method returns the index within the calling String object of the first occurrence of the specified value, starting
the search at fromIndex or -1 if the value is not found.
Syntax
string.indexOf(searchValue[, fromIndex])
Argument Details
● searchValue − A string representing the value to search for.
● fromIndex − The location within the calling string to start the search from. It can be any integer
between 0 and the length of the string. The default value is 0.
Return Value
Returns the index of the found occurrence, otherwise -1 if not found.
Example
<html>
<head>
<title>JavaScript String indexOf() Method</title>
</head>
<body>
var str1 = new String("This is string one");
var index = str1.indexOf("string");
document.write("indexOf found String :" + index);
document.write("<br />");
var index = str1.indexOf("one");
document.write("indexOf found String :" + index);
</script>
</body>
</html>
13. Write a JavaScript that will replace following specified value with another value in
string.
String = “I will fail”
Replace “fail” by “pass”
<html>
<head>
<body>
<script>
var myStr = 'I will fail';
document.write("String before replacement = "+myStr + "<br>");
var newStr = myStr.replace("fail", "pass");

document.write("String after replacement = " +newStr);
</script>
</body>
</head>
</html>
Output:
String before replacement = I will fail
String after replacement = I will pass
14. Write a JavaScript code to display 5 elements of array in sorted order.
<html>
<head>
<title> Array</title>
</head>
<body>
<script>
var arr1 = ["Red", "red", "Blue", "Green"];
var arr2 = [1, 20, 3, 45, 44, 0.5];
document.write("Before sorting array1 = " + arr1);
document.write("<br>After sorting array1 = " + arr1.sort());
document.write("<br>Before sorting array2 = " + arr2);
document.write("<br>After sorting array2 = " +
arr2.sort(function(a,b){return a-b}));
</script>
</body>
</html>
15. Develop JavaScript to convert the given character to Unicode and vice versa.
<html>
<head>
<title>Convert the Given Character to Unicode and vice versa</title>
<script>
function convert() {
var c = document.getElementById("input1");
var u = document.getElementById("input2");
if (c.value != "") {
u.value = c.value.charCodeAt();
}
else {
c.value = String.fromCharCode(u.value);
}
}
</script>
</head>
<body>
<p>Enter either Character or Unicode and click on CONVERT</p>
Character <input type="text" id="input1" /><br />
Unicode <input type="text" id="input2" /><br />
<input type="button" value="CONVERT" onclick="convert()" />
</body>
</html>
16. Explain any two mouse event with example.
17. Explain key event with an example.
18. Write a JavaScript code to find out first and last index of given character from string.
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<script>
var str = "Hello World";
document.write("Starting index of character l = " + str.indexOf('l') +
"<br>");
document.write("Last index of character l = " + str.lastIndexOf('l'));
</script>
<body>
</body>
</html>
Output :
Starting index of character l = 2
Last index of character l = 9
19. Explain splice() method of array with example.
Adding elements in existing array:
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<script>
var a = new Array();
a[0] = " C";
a[1] = " C++";
document.write("Original Length = " + a.length + "<br>");
a.splice(2, 0, " Java", " PHP");
document.write("New Length = " + a.length + "<br>");
for (var i = 0; i < a.length; i++) {
document.write(a[i]);
}
</script>
<body>
</body>
</html>
Output:
Original Length = 2
New Length = 4
C C++ Java PHP
Removing element from existing array
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<script>
var a = new Array();
a[0] = "C";
a[1] = "C++";
a[2] = "Java";
a[3] = "VB";
document.write("Original Length = " + a.length + "<br>");
a.splice(2);
document.write("New Length = " + a.length + "<br>");
for (var i = 0; i < a.length; i++) {
document.write(a[i]);
}
</script>
<body>
</body>
</html>
Output:
Original Length = 4
New Length = 2
CC++
20. Explain getter and setter properties in Java script with suitable example.
Property getters and setters

1. The accessor properties. They are essentially functions that work on getting and setting a value.
2. Accessor properties are represented by “getter” and “setter” methods. In an object literal they are denoted
by get and set.
let obj = {
get propName() {
// getter, the code executed on getting obj.propName
},
set propName(value) {
// setter, the code executed on setting obj.propName = value
}
};
3. An object property is a name, a value and a set of attributes. The value may be replaced by one or two
methods, known as setter and a getter.
4. When program queries the value of an accessor property, Javascript invoke getter method(passing no
arguments). The retuen value of this method become the value of the property access expression.
5. When program sets the value of an accessor property. Javascript invoke the setter method, passing the
value of right-hand side of assignment. This method is responsible for setting the property value.
If property has both getter and a setter method, it is read/write property.
If property has only a getter method , it is read-only property.
If property has only a setter method , it is a write-only property.
6. getter works when obj.propName is read, the setter – when it is assigned.
<html>
<head>
<title>Functions</title>
<body>
<script language="Javascript">
var myCar = {
/* Data properties */
defColor: "blue",
defMake: "Toyota",
/* Accessor properties (getters) */
get color() {
return this.defColor;
},
get make() {
return this.defMake;
},
/* Accessor properties (setters) */
set color(newColor) {
this.defColor = newColor;
},
set make(newMake) {
this.defMake = newMake;
}
};
document.write("Car color:" + myCar.color + " Car Make: " + myCar.make)
/* Calling the setter accessor properties */
myCar.color = "red";
myCar.make = "Audi";
/* Checking the new values with the getter accessor properties */
document.write("<p>Car color: " + myCar.color); // red
document.write(" Car Make: " + myCar.make); //Audi
</script>
</head>
</body>
</html>

Css Class Test1 qb-1

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Css Class Test1 qb-1

Uploaded by

Copyright:

Available Formats

1. State the use of dot syntax in JavaScript with the help of suitable examples.

var Fruits = new Array("Apple", "Mango", "Banana", "Watermelon", "Pear");

5. Differentiate between concat() and join() methods of array objects.

6. List the comparison operators in Javascript.

Output : After delete John Doe 50 undefined

9. Write Javascript to call function from HTML.

<body onload="welcome()" onunload="goodbye()">

Syntax: window.prompt (text, defaultText)

Returns the character from the specified index.

Output - str.charAt(0) is:T

JavaScript String - indexOf() Method

var newStr = myStr.replace("fail", "pass");

14. Write a JavaScript code to display 5 elements of array in sorted order.

16. Explain any two mouse event with example.

17. Explain key event with an example.

19. Explain splice() method of array with example.

Adding elements in existing array:

Property getters and setters

You might also like