Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
30 views

L2 Features Object (1.2)

The document discusses the basics of JavaScript programming including features of JavaScript, objects, properties, methods, and dot syntax. It provides examples of creating objects using object literals, the new keyword, and object constructors. It also covers accessing and adding properties with dot operators and defining methods.

Uploaded by

Aryan K
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
30 views

L2 Features Object (1.2)

The document discusses the basics of JavaScript programming including features of JavaScript, objects, properties, methods, and dot syntax. It provides examples of creating objects using object literals, the new keyword, and object constructors. It also covers accessing and adding properties with dot operators and defining methods.

Uploaded by

Aryan K
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 28

Client Side Scripting

Language (22519)

P R O G R A M : IN F O R M ATI O N T E C H N O L O G Y ( N B A
A C C R E D ITED )
S E M E S T ER : V
N A M E O F FA C U LTY: M S . Y O G I TA J O R E
Unit 1 :
Basics of JavaScript
Programming
(12 M)

P R O G R A M : IN F O R M ATI O N T E C H N O L O G Y ( N B A
A C C R E D ITED )
: V
N A M E O F FA C U LTY: M S . E M A I L :
y o g it a . k h a n d a g a le@v p t . e d u . in
Basics of JavaScript
Programming
1.1 Features of JavaScript
1.2 Object Name, Property, Method, Dot Syntax, Main Event
1.3 Values and Variables
1.4 Operators and Expressions
1.5 if statement , if…else. If…elseif, Nested if
1.6 switch… case statement
1.7 Loop statement
1.8 Querying and setting properties and Deleting properties,
Property Getters and Setters
Client side Scripting vs.
Server Side Scripting
Client-side scripting requires browsers to run the scripts on
the client machine but does not interact with the server
while processing the client-side scripts

Server-side scripting involves server for its processing


Comparison
Server-side scripting Client-side scripting

Basic Works in the back end which Works at the front end and
could not be visible at the script are visible among the
client end. users.

Processing Requires server interaction Does not need interaction with


the server
Languages PHP, ASP.net, Ruby, Python HTML, CSS, JavaScript
involved
Affect Could effectively customize the Can reduce the load to the
web pages and provide server.
dynamic websites.

Security Relatively secure Insecure


1.1 Features of JavaScript
1.2 Object Name, Property ,
Method, Dot Syntax, Main Event
JavaScript is a Object based scripting language.
A JavaScript object is a collection of named values.
These named values are usually referred to as properties of
the object.
A JavaScript objects are collection of properties and
methods.
A Methods is a function that is a member of an object.
A Property is a value or set of values that is the
member of an object.
Object
In JavaScript, almost "everything" is an object.
 Booleans can be objects (if defined with the new keyword)
 Numbers can be objects (if defined with the new keyword)
 Strings can be objects (if defined with the new keyword)
 Dates are always objects
 Maths are always objects
 Regular expressions are always objects
 Arrays are always objects
 Functions are always objects
 Objects are always objects
Types of Object
Built –in • Defined by JavaScript (such as
Objects Math, Date, String, Array)

User-Defined • Objects which user (we) create)


Objects
• Always available to JavaScript by
Host Objects browser environment (such as
window, document, form)
Object Name
Each object is uniquely identified by a name or ID.
With JavaScript, you can define and create your own
objects.
There are different ways to create new objects:
1. Define and create a single object, using an object literal.
2. Define and create a single object, with the keyword “new”.
Or By creating instance of Object
3. Define an object constructor, and then create objects of
the constructed type.
Using an Object Literal
Easiest way to create a JavaScript Object.
Using an object literal, you both define and create an object in
one statement.
An object literal is a list of name: value pairs (like age:10) inside
curly braces {}.
The following example creates a new JavaScript object with 3
properties:
var person = {
Example: firstName: “Girija",
lastName: “Jore",
Person is age: 10,
a object };
Example
<html>
<body>
<script>
emp={id:"VP-179",name:"Yogita Jore",salary:50000}
document.write(emp.id+" "+emp.name+" "+emp.salary);
</script>
</body>
OUTPUT VP-179 Yogita Jore 50000

</html>
Using “new” keyword
new keyword is used to create object.
Syntax: var objectname=new Object();
Example:
var person = new Object();
person.firstName = “Girija";
person.lastName = “Jore";
person.age = 10;
Example
<html>
<body>
<script>
var emp=new Object();
emp.id="VP-179";
emp.name="Yogita Jore";
emp.salary=50000;
document.write(emp.id+" "+emp.name+" "+emp.salary);
</script>
</body> OUTPUT VP-179 Yogita Jore 50000
</html>
By using Object Constructor
Here,
create you need
function
arguments. to
with
Each
can argument
be
current assigned
object value
byin the
using
this
The keyword.
this keyword refers
to the
Example:current object.
function person(firstName,
lastName, age)
{this. firstName =
firstName;
this. lastName =
lastName;
this. age = age;
}p=new person(“Girija”,”Jor
e”,10);
document.write(p.firstNam
e+"
e); "+p.lastName+" "+p.ag
Example
<html> <body>
<script>
function emp(id,name,salary)
{
this.id=id;
this.name=name;
this.salary=salary; OUTPUT VP-179 Yogita Jore 50000
}
e=new emp("VP-179","Yogita Jore",50000);
document.write(e.id+" "+e.name+" "+e.salary);
</script>
</body> </html>
Property
Properties are the values associated with a JavaScript object.
A JavaScript object is a collection of unordered properties.
Properties can usually be changed, added, and deleted, but some are
read only.
The syntax for accessing the property of an object is:
objectName.property // person.age

objectName["property"] // person["age"]

objectName[expression] // x = "age"; person[x]


Dot Operator
The properties and methods associated with any object can be
accessed by using . Operator.
Example, emp.id or op.add();
Also used to how to inteact with objects, methods, events and
properties.
Dot operator is also used to add new property.
Example, emp.designation=“Lecturer”;
Accessing properties with dot operator
<html> <body>
<h2>JavaScript Object Properties</h2>
<script>
var person = {
firstname:"Girija",
lastname:"Jore“,
age:10,
};
document.write(person.firstname+"<br>");
document.write(person.lastname);
</script> JavaScript Object Properties
</body> </html>
OUTPUT Girija
Jore
Adding properties with dot operator
<html> <body>
<script>
var person =
{
firstname:"Girija",
lastname:"Jore",
age:10 OUTPUT Girija is in Fifth standard
};
person.std = "Fifth";
document.write(person.firstname+" "+"is in "+person.std+" standard");
</script>
</body> </html>
Methods
JavaScript methods are actions that can be performed on
objects.
A JavaScript function is a block of code designed to perform a
particular task.
A JavaScript function is defined with the function keyword,
followed by a name, followed by parentheses ().
The parentheses may include parameter names separated by
commas:
(parameter1, parameter2, ...)
Methods
The code to be executed, by the function, is placed inside curly
brackets: {}
Syntax:
function name(parameter1, parameter2, parameter3)
{
// code to be executed
}
Methods-Example 1)
<html>
<body>
<script>
function op_add(p1, p2)
{
return p1 + p2;
}
document.write("Addition is="+op_add(4, 5));
</script>
</body>
</html>
OUTPUT Addition is=9
Methods- Example 2)
<script>
var person =
{
firstname:"Girija",
lastname:"Jore",
Fullname:function() OUTPUT Person Detail is=Girija Jore
{
return this.firstname+" "+this.lastname;
}
};
document.write("Person Detail is="+person.Fullname());
</script>
Methods
Javascript_function.webm
Quiz Time !
Q1. A Property is a data or value associated with ________.
Ans : Object

Q2. Intrinsic/Built-in objects are defined by ________ .

Ans: JavaScript

Q3. Each object is uniquely identified by a name or ___ .

Ans : ID
Quiz

https://forms.office.com/Pages/ResponsePage.aspx?
id=QEUap70T20yz690UXwrJwIuVSIKHZ3RDo4EeJ2CYjgFUNVVKOElMTTBY
UVhFOVBOWVA4OUtPNlJINy4u

You might also like