1706109003

Javascript Classes and User-Defined Functions


## What Is a Class? JavaScript ain’t got no class! If you are familiar with Java or C++ you may be wondering how to create a class in JavaScript. A class is a template or blueprint that describes the properties and behavior of all objects that belong to that specific class, so you may have a Car class or a House class or a Widget class. A Car class would be defined with the properties and methods for a Car and then you could create as many Car objects as you want using the class as a template. But JavaScript doesn’t have classes in the traditional sense. It doesn’t have a class keyword. We must develop the notion of classes in a differ- ent way. A new JavaScript class is defined by creating a simple function. The name of the function will serve as the class name for an object, and the function will define its prop- erties and methods; it serves as a blueprint or prototype of the object. When the function is called with the new keyword, it acts as a constructor; that is, it builds the new object and then returns a reference to it. We can say that if you call the Book() constructor func- tion, it returns a reference to a new Book object, an instance of the Book class. **Example** ```js <head><title>User-defined objects</title> // the script functio Book(title, author, publisher){ this.pagenumber=0; this.title = title; this.author = author; this.publisher = publisher; this.uppage = pageForward; this.backpage = pageBackward; } function pageForward(){ this.pagenumber++; return this.pagenumber; } function pageBackward(){ this.pagenumber--; return this.pagenumber; } // End of script ``` ```html </head><body> ``` ```js const myBook = new Book("Javascript by Example"); myBook.pagenumber=5; document.write("<br>" + myBook.title + "<br>" + myBook.author + "<br>" + myBook.publisher + "<br>Current page is " + myBook.pagenumber); document.write("<br>Page forward: " ); for(i=0;i0; i--){ document.write("<br>" + myBook.backpage()); // Move back a page } ``` ```html </body> ``` 1. This is the constructor function that will represent a class called “Book”. The function creates the object and assigns it properties and methods. The parameter list contains the values for the properties title, author, and publisher. Each time this function is called a new Book class is instantiated. 2. The this keyword refers to the Book object. The Book object is given a pagenumber property initialized to 0. 3. A method is defined by assigning the function to a property of the Book object. this.uppage is assigned the name of the function, pageForward, that will serve as the object’s method. Note that only the name of the method is assigned to a prop- erty, i.e., a reference to the function’s definition. There are no parentheses follow- ing the name. This is important. If you put parentheses here, you will receive an error message. But when the method is called you must use parentheses. If you want to correct, improve or even contribute to this code, please register and leave your comment here. Or you can even create a post indicating what I should change or improve in this code. If you just want to chat, I'll be here [FrontEnd Chat room](https://chat-to.dev/chat?q=javascript-room) in this chat room so we can talk more. Thank you

(0) Comments