Real Life Objects, Properties, and Methods - Zenodo

16
28.3.2019 JavaScript Objects https://www.w3schools.com/js/js_objects.asp 1/16 Previous Next JavaScript Objects Real Life Objects, Properties, and Methods In real life, a car is an object. A car has properties like weight and color, and methods like start and stop: Object Properties Methods car.name = Fiat car.model = 500 car.start() car.drive() THE WORLD'S LARGEST WEB DEVELOPER SITE w3schools .com HTML CSS JAVASCRIPT MORE We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising. Manage choices OK

Transcript of Real Life Objects, Properties, and Methods - Zenodo

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 1/16

❮ Previous Next ❯

JavaScript Objects

Real Life Objects, Properties, and MethodsIn real life, a car is an object.

A car has properties like weight and color, and methods like start and stop:

Object Properties Methods

car.name = Fiat car.model = 500

car.start() car.drive()

T H E W O R L D ' S L A R G E S T W E B D E V E L O P E R S I T E

w3schools.com

HTML CSS JAVASCRIPT MORE

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 2/16

car.weight = 850kg car.color = white

car.brake() car.stop()

All cars have the same properties, but the property values differ from car to car.

All cars have the same methods, but the methods are performed at different times.

JavaScript ObjectsYou have already learned that JavaScript variables are containers for data values.

This code assigns a simple value (Fiat) to a variable named car:

var car = "Fiat";

Try it Yourself »

Objects are variables too. But objects can contain many values.

This code assigns many values (Fiat, 500, white) to a variable named car:We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 3/16

var car = {type:"Fiat", model:"500", color:"white"};

Try it Yourself »

The values are written as name:value pairs (name and value separated by a colon).

JavaScript objects are containers for named values called properties or methods.

Object DefinitionYou define (and create) a JavaScript object with an object literal:We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 4/16

Example

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

Try it Yourself »

Spaces and line breaks are not important. An object definition can span multiple lines:

Example

var person = { firstName: "John", lastName: "Doe", age: 50, eyeColor: "blue" };

Try it Yourself »

Object PropertiesThe name:values pairs in JavaScript objects are called properties:

Property Property Value

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 5/16

firstName John

lastName Doe

age 50

eyeColor blue

Accessing Object PropertiesYou can access object properties in two ways:

objectName.propertyName

or

objectName["propertyName"]

Example1

person.lastName;

Try it Yourself »We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 6/16

Example2

person["lastName"];

Try it Yourself »

Object MethodsObjects can also have methods.

Methods are actions that can be performed on objects.

Methods are stored in properties as function definitions.

Property Property Value

firstName John

lastName Doe

age 50

eyeColor blue

fullName function() {return this.firstName + " " + this.lastName;}

A method is a function stored as a property.We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 7/16

Example

var person = { firstName: "John", lastName : "Doe", id : 5566, fullName : function() { return this.firstName + " " + this.lastName; } };

The this KeywordIn a function definition, this refers to the "owner" of the function.

In the example above, this is the person object that "owns" the fullName function.

In other words, this.firstName means the firstName property of this object.

Read more about the this keyword at JS this Keyword.

Accessing Object MethodsYou access an object method with the following syntax:We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 8/16

objectName.methodName()

Example

name = person.fullName();

Try it Yourself »

If you access a method without the () parentheses, it will return the function definition:

Example

name = person.fullName;

Try it Yourself »

Do Not Declare Strings, Numbers, and Booleans as Objects!When a JavaScript variable is declared with the keyword " new ", the variable is created as an object:

var x = new String(); // Declares x as a String object var y = new Number(); // Declares y as a Number object

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 9/16

var z = new Boolean(); // Declares z as a Boolean object

Avoid String , Number , and Boolean objects. They complicate your code and slow down execution speed.

You will learn more about objects later in this tutorial.

Test Yourself With Exercises

Exercise:Alert "John" by extracting information from the person object.

var person = { firstName: "John", lastName: "Doe" }; alert( );

Submit Answer »

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 10/16

❮ Previous Next ❯

Start the Exercise

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 11/16

COLOR PICKERWe use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 12/16

HOW TO

Tabs Dropdowns Accordions Side Navigation Top Navigation Modal Boxes Progress Bars Parallax Login Form HTML Includes Google Maps Range Sliders Tooltips Slideshow Filter List Sort List

SHARE

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 13/16

CERTIFICATES

HTML CSS

JavaScript SQL

Python PHP

jQuery Bootstrap

XML

Read More »

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 15/16

REPORT ERROR PRINT PAGE FORUM ABOUT

Top TutorialsHTML Tutorial CSS Tutorial

Top ReferencesHTML Reference CSS Reference

Kartenzahlungen leicht gemachtAb jetzt auch kontaktlose Zahlungen akzeptieren.

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK

28.3.2019 JavaScript Objects

https://www.w3schools.com/js/js_objects.asp 16/16

JavaScript Tutorial How To Tutorial

SQL Tutorial Python Tutorial W3.CSS Tutorial

Bootstrap Tutorial PHP 5 Tutorial PHP 7 Tutorial jQuery Tutorial Java Tutorial

JavaScript Reference SQL Reference

Python Reference W3.CSS Reference

Bootstrap Reference PHP Reference HTML Colors

jQuery Reference Angular Reference

Java Reference

Top ExamplesHTML Examples CSS Examples

JavaScript Examples How To Examples

SQL Examples Python Examples W3.CSS Examples

Bootstrap Examples PHP Examples

jQuery Examples Java Examples XML Examples

Web CertificatesHTML Certificate CSS Certificate

JavaScript Certificate SQL Certificate

Python Certificate jQuery Certificate

PHP Certificate Bootstrap Certificate

XML Certificate

Get Certified »

W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding. Tutorials, references, andexamples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using this site, you agree to have read and accepted our

terms of use, cookie and privacy policy. Copyright 1999-2019 by Refsnes Data. All Rights Reserved. Powered by W3.CSS.

We use cookies to understand how you use our site and to improve your experience. This includes personalizing content and advertising.

Manage choicesOK