Learn JavaScript 04 (functions)

Hey, How are you? ūüôā I think u r getting well. Ok first look at the below code.

Capture 10

Just type and run. You can’t copy and paste ūüėÄ Type your¬†own code and run. It is the best way to practice ūüôā
Ok did you get any idea what we are gonna talk about. Yes we are going to talk about JavaScript FUNCTIONS.

In JavaScript we use function keyword to define a function, followed by a name, followed by parentheses ().

Syntax
function function_name(parameter1, parameter2, parameter3) {
code to be executed
}

Capture 11

Let’s consider about this small program. In here function name is “myFunction” and “a” and “b” are the parameters. This function returns the multiplication of a and b.¬†When JavaScript reaches a return statement, the function will stop executing.
In “myFunction(4,3)” ¬†we call the function and pass value 4 to letter a and pass value 3 to letter b.

Nested Functions

Capture 12
Did you get that ? ¬†The “square” function is in the “myFunction” function. Oh! Function function everywhere ūüôā ¬†don’t get confused just think simple. Nested Functions mean function within a function. This is a simple definition for that. We can learn more about future parts.

Function() CONSTRUCTOR

The above way is not the only way to define a new function. We can define function dynamically using Function() constructor along with the new operator.
Now you may think what is constructor.
“A constructor is a special method of a class or structure in object-oriented programming that initializes an object of that type. A constructor is an instance method that usually has the same name as the class, and can be used to set the values of the members of an object, either to default or to user-defined values”

For example, if you have a Car class, you can create new objects of this type by saying new Car() . We can understand about constructors by looking some examples.

Syntax


var variablename = new Function(Arg1, Arg2, “Function Body”);

The Function() constructor can hold any number of string arguments. The last argument is the body of the function. It can contain arbitrary JavaScript statements, separated from each other by semicolons.
Youknow? the Function() constructor is not passed any argument that specifies a name for the function it creates. The unnamed functions created with the Function() constructor are called anonymous functions.

Capture 13
This is a small program which explains what constructor function is. You can see the underlined statement. It is the line which create a “funct” function. “x” and “y” are the parameters and “return x*y;” is the function body. Ok ¬†I think that you got the idea.

Ok boss ūüôā This is the end of Function part. We can get more idea about functions in future parts.

 

 

Advertisements

Learn JavaScript 03

In this part let’s talk about some important things like syntax, variables, ….etc.

  • JavaScript uses the var keyword to declare variables.var x;
    x = 10;

     

  • JavaScript uses an assignment operator ( = ) to assign values to variables.var x = 4;
    var y = 10;

     

  • JavaScript uses arithmetic operators ( + – *¬† / ) to compute values.(2 + 3) * 6;

     

  • JavaScript allows you to work with three primitive data types.Numbers: 12, 12.50
    Strings: “Hello Sam”
    Boolean: true or false.
  • JavaScript comments.¬†Code after double slashes // or between /* and */ is treated as a comment.// This is a single line comment.

    /*
    This is a multi line
    comment in JavaScript
    */

  • JavaScript variables must be identified with unique names.
    These unique names are called identifiers.
    JavaScript identifiers. In JavaScript, the first character must be a letter, an underscore (_), or a dollar sign ($). Subsequent characters may be letters, digits, underscores, or dollar signs.

    Numbers are not allowed as the first character.
    JavaScript identifiers are case sensitive.

  • JavaScript Arithmetic Operators
    Operator Description
    + Addition
    Subtraction
    * Multiplication
    / Division
    % Modulus
    ++ Increment
    Decrement
  • JavaScript Assignment operators.
    Operator Example Same As
    = x = y x = y
    += x += y x = x + y
    -= x -= y x = x – y
    *= x *= y x = x * y
    /= x /= y x = x / y
    %= x %= y x = x % y

Learn JavaScript 02

In first part we discussed about some facts about JS. Let’s go ahead….

Here let’s talk about OUTPUTS in JavaScript.
JavaScript does NOT have any built-in print or display functions. JavaScript can display data in different ways.

  • Writing into an alert box, using window.alert()

    Capture 4-alert
    try this code and you can see  an alert box.

  • Writing into the HTML output using document.write().

    Capture 5
    The document.write() method should be used only for testing. Because If we’ll ¬†use document.write() after an HTML document is fully loaded, will delete all existing HTML.
    below example will explain it. Try this code and you can understand what I’ve told above.

    Capture 6

  • Writing into an HTML element, using innerHTML.

    By using document.getElementById(id) method, we can access an HTML element.
    The id attribute defines the HTML element. The innerHTML property defines the HTML content:

    Capture 7.1
    When we click the “click” button, document.getElementById() method runs and It passes the “Ohh this is cool” string to header which id = “ID”.

  • Writing into the browser console, using console.log().

    In browser we can use the console.log() method to display data. For this we have to activate the browser console with F12 and select console in the menue.

    Capture 8
    First run the html file. Then press F12 and you can see a window. then click a console menue and you can see the answer 11.

OK in this part we discussed about OUTPUTS in JavaScript. In the next part
let’s discuss about more things.

 

 

 

 

Learn JavaScript 01

JavaScript is the programming language of HTML and the web. It is a dynamic computer programming language. We use JavaScript to program the behavior of web pages. It is a interpreted programming language.

Let’s look a small example…..

Capture 1

above code gives you this

Capture 2

by clicking the Click Me button you can change the content

Capture 3

  • Ok! now we have small idea that what JS(JavaScript) can do. Now we are going to learn JS.JavaScript can be implemented using JavaScript statements that are placed within the HTML tags in a web page.
         JavaScript codeJS tag takes two important attributes.
  • Language:¬†This attribute specifies what scripting language you are using.
  • Type:¬†This attribute is what is now recommended to indicate the scripting language ¬† ¬† ¬† ¬† ¬† ¬† ¬† ¬†in use
         JavaScript codeWe can be placed these tags in the <body> and the <head> sections of an HTML page.

Ok as usually let’s start from HELLO World ! ¬†ūüôā

<html>
<body>

¬† ¬†document.write (“Hello World!”)
</body>
</html>

This code will produce the following result:
Hello World!

We can talk more about JS by next parts.