JavaScript Objects

From Wikiversity
Jump to navigation Jump to search

Portal:Engineering and TechnologySchool:Computer ScienceTopic:Computer ProgrammingTopic:JavaScriptAdvanced JavaScript → JavaScript Objects
The following JavaScript script lessons allow the coder to specifically create objects to direct the script process. This lesson outlines further use of the JavaScript language. Objects as used in JavaScript are part of the study of current web technology and the implications from other languages migrating to new and extended uses. Programmers migrating from other languages bring a lot of variety to the functionality and purpose of objects in JavaScript. JavaScript was designed to be immediately learn-able and useful for migrating programmers in the industry.

Nuvola apps kcoloredit.png Subject classification: this is a design resource.
Nuvola apps kcmprocessor.png Subject classification: this is a technology resource.
Nuvola apps kcmsystem.svg Subject classification: this is an engineering resource.
Javascript.jpg

JavaScript has a language that allows scripts to be more logically operated than a batch file. The language is not of the application running the environment. JavaScript interacts with the specific languages used in several technologies.

By setting out a language, beyond the environmental activities, all JavaScript objects are available in most interpreting applications. If an application (program) attribute has been utilized for JavaScript, then most likely it can be called by our script (within secure allowances). Its the Object Model!

Programming with Objects[edit]

Programming with objects is fundamental to a few (code) languages. Some object concepts can be emulated in JavaScript. Arrays are an example of an emulation which is consistent to programmer's fundamentals. Yet, the arrays in JavaScript are just name-based, and therefore, can be utilized under variations according to the (fundamental) theme. For example, with an array, any position can be utilized without an immediate predecessor in the adjacent memory position. So, 'memory-slot one' is not needed to 'start in memory-slot two'.

Array Objects[edit]

<script>
//Array objects
//The array object allows the script to access and manipulate arrays. 
//An array is an object with properties/content being identified into positions. 
//The position number refers to (an association of) an index. 
//In computer programming the number starts at the default zero position. 
//So if a programmer packed a javascript array it could be different. 
//Some people like to count in tens, hundreds, or even thousands. 
//[Another example of this behavior is the z-index in CSS].


var anArray = new Array;
anArray[0] = 21;
anArray[1] = 22;
anArray[2] = "ate the bananas.";
anArray[3] = "monkeys"; 

var anotherArry = new Array;
anotherArry[500] = "Slim chances of a return" 
anotherArry[1000] = "Pick this," 
anotherArry[132] = 43;
anotherArry[2] = '2' + "nd";

alert( anotherArry[1000] + " " + anArray[1] + " " + anArray[3] + " " + anArray[2] + " "  +  anotherArry[500]); 
</script>


<script>
//Making Objects

var hello = {};
alert(hello);

//result in box: [object Object]

var hello = {};
hello.meaningoflife = 42;
alert(hello.meaningoflife);

//result in box: 42

//But the object can be reassigned to a data type without any properties (by accident).

var helloagain = {};
helloagain.meaning = 42;
helloagain = 2;
alert(helloagain.meaning);


//result in box: undefined

//see: http://msdn.microsoft.com/en-us/library/89t1khd2(v=VS.94).aspx

var moreObject = new Object(); //creates an object
moreObject.context = function (last) { alert(this.denote + ' ' + this.signified + ' ' + this.activity + ' ' + last);} //add the function
moreObject['denote'] = 'Some'; //combine some content
moreObject['activity'] = 'eat'; //combine some content
moreObject.signified = 'elephants'; //combine some content
moreObject.context("peanuts"); //call the function and pass in context content

//Here's another example that looks for an equality (through inequalities and Boolean logic).

var notGreater = new Object;
notGreater.y = 2;
notGreater.result = function(x) {(x > this.y || this.y > x)? alert('it fails'):alert('it works')};
notGreater.result(2);

//Equally, this works:

var notGreater = new Object;
notGreater.y = 2;
notGreater.result = function(x) {(x > this.y || this.y > x)? alert('it fails'):alert('it works')};
notGreater.result(1+1);
</script>


Here's a simple example in a prompt-box-program within a webpage.

<!DOCTYPE html>
<html>
	<body>
		<p>
			Click the button to check an equality with 'y'.
		</p>
		<button onclick="anotherFunction()">
			Enter a number (or expression)
		</button>
		<script>
			var nots = new Object;
			nots.y = 2;
			nots.result = function(x) {(x > this.y || this.y > x) ? alert('It fails') : alert('It works')};

			function anotherFunction() {
				nots.result(prompt("To continue select a number", "1+1"));
			}
		</script>
	</body>
</html>


This example is a more complex way to add two numbers. It involves not using the "+" positive operator. (More easily done with a-(-b)).

<!DOCTYPE html>
<html>
	<body>
		<p>
			Click the button to add two numbers.
		</p>
		<button onclick="anotherFunction()">
			Enter two numbers separated by a comma.<br>
			(Not strings or expressions)
		</button>
		<script>
			var hereagain = {};
			hereagain.a
			hereagain.b
			hereagain.result = function(x) {
				var get = x.split(',', 2);
				this.a = (get[0] >= get[1]) ? get[0] : get[1];
				this.b = (get[0] >= get[1]) ? get[1] : get[0];
				this.answer = (2 * this.a) - (this.a - this.b);
				return this.answer;
			};
			
			function anotherFunction() {
var getanswer =	hereagain.result(prompt("Enter two comma-separated values \n (Not strings or expressions)", "1 , 1"));
	                        var added = document.createElement("label");
	                        added.style.fontSize = "38px";
			        added.innerHTML = getanswer;
			        document.body.appendChild(added);
			}

		</script>
	</body>
</html>


Predefined Objects[edit]

The use of predefined objects is slightly different to coder-defined objects. See: This collection with the about.com tutorials.

Note: You can simply review the operation of a predefined object by entering smaller scripts at the console command-line. The console is available in browsers with developer tools. In the same way a Mathematician plugs in variables, the object-orientated-language coder needs to plug in objects. Learning to cycle through development and testing, in this way, is an essential skill. With modern medias popularity, it may be shrewd to review demonstration videos from around the world. Some coders learn to 'test' at an early age. Don't be frightened away by the younger demonstrators. Young coders are often interested in producing games at skill levels beyond standard classwork.

alert("This is our time " + predefinedObject.getFullYear());