JavaScript tutorial – part 001 – free-tutorials.org with free tutorials and source code

Because many users used javascript with a web browser or to make web development I will make a few tutorials about JavaScript.
I will try to cover the most important details and features that JavaScript has to offer.
First, the JavaScript language has no concept of input or output because is designed to run as a scripting language in a host environment.
The JavaScript is an object-oriented dynamic language with types and operators, standard built-in objects, and methods.
The syntax is based on the Java and C languages.
JavaScript’s types are:

Number
String
Boolean
Function
Object
Symbol

Because Symbol type is new in Edition 6 then you need to know this: A symbol is a unique and immutable data type and may be used as an identifier for object properties. See this example with one symbol type definition.

var mysym = Symbol("foo");
typeof mysym;     // output will be "symbol"

1 2	var mysym = Symbol("foo"); typeof mysym; // output will be "symbol"

One good website to learn the basics of JavaScript its www.w3schools.com.
Let’s try to get screen resolution with javascript.
First, you need to make your HTML file and to add this source code under <script></script> HTML tags:

var width = screen.width;
var height = screen.height;

1 2	var width = screen.width; var height = screen.height;

This variable will be used with this source code:

&lt;script type="text/javascript"&gt;if ((screen.width&lt;=1000) &amp;&amp; (screen.height&lt;=768)) {
 window.location.replace('window url for 1000/768 ');
}
else {
   window.location.replace('if not the another window url ');
}&lt;/script&gt;

window.location.replace('window url for 1000/768 ');

}

else {

window.location.replace('if not the another window url ');

}</script>

Detecting the screen resolution comes when we used variables and then we used that to make redirecting on another page.
How to create an object constructor
This is the source code :

&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;body&gt;
&lt;h1&gt;My First Web Page&lt;/h1&gt;
&lt;p&gt;My first paragraph.&lt;/p&gt;
&lt;script&gt;
function Person(firstName, lastName){
this.firstName =  firstName;
this.lastName = lastName;
}
var My_NAME = new Person("My_first_name", "My_last_name");
window.alert(My_NAME.firstName);
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;

<!DOCTYPE html>

<html>

<body>

<h1>My First Web Page</h1>

<p>My first paragraph.</p>

function Person(firstName, lastName){

this.firstName = firstName;

this.lastName = lastName;

}

var My_NAME = new Person("My_first_name", "My_last_name");

window.alert(My_NAME.firstName);

</script>

</body>

</html>

The output will be one window with this text: My_first_name ;

You can test it online with jsbin.com website.

Leave a Reply Cancel reply