Objects, properties and methods in JavaScript

Object-oriented programming is a type of programming where programmers can define not just the data type of a data structure,  but also the different types of operations (or functions) that can be applied to a data structure. Under this model, a data structure is an object which consists of both data and functions. Programmers can create relationships between different objects. For example, objects can be given characteristics that belong to another object.

Programming languages which support object-oriented programming include Java, C++, Python, Visual Basic .Net, Ruby, and of course JavaScript.

In Javascript, an object is something that can have properties and a method is an action that you can perform on an object. A property is something about an object (eg. the length of a string).

Watch the video below first, and then scroll down to view the sample code.

In the example below,  the sentence is the object, the length is the property of the object, and the method is the action used to convert the string to uppercase letters. Look at the sample code below to see how properties and methods are used on objects.

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="utf-8"/>
 <title>JavaScript - Objects, properties and methods</title>
 <script type="text/javascript">
 
 /* Remember that JS is an object-oriented language. 
 An object is something that has properties in JS.
 A method is an action you can perform with an object.
 A property is something about an object (eg. the length of a string).
 
 In the example below, sentence is the object, length is the property of the object and method is the
 action used to convert the string to uppercase letters.
 To work with properties, we use the syntax objectname.propertyname 
 A method will always be followed by brackets eg. objectname.methodname()
 A method will sometimes require parameters.
 */
 
 var sentence = "Hello world";
 // This is an example of using a property
 document.write(sentence.length,"<br/>"); // the <br/> tag is simply used to make a new line here
 // This is an example of using a method.
 document.write(sentence.toUpperCase());
 
 //With document.write , document is the object and write is the method.
 
 </script>
 
</head>
<body>
 
</body>
</html>

Next tutorial: Using the getElementById() method