Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / NewStats: 3,194,494 members, 7,954,895 topics. Date: Saturday, 21 September 2024 at 11:57 AM |
Nairaland Forum / Science/Technology / Webmasters / JavaScript Tutorial From The Scratch Brought To You From Part 2 (1647 Views)
Free Tutorial From Baze9ja.tk– How To Make Money Blogging[for BLOGGERS] / Javascript Tutorial From The Scratch Brought to you from Part 1 / Responsive Web Design Tutorial From Scratch (2) (3) (4)
(1) (Go Down)
JavaScript Tutorial From The Scratch Brought To You From Part 2 by dhtml(m): 11:51pm On Jul 12, 2014 |
In the previous class which took place here - https://www.nairaland.com/1789014/javascript-tutorial-scratch-brought- - we looked at the following topics: 01. Introduction to javaScript 02. Alert Box: Display messages with alert 03. Math Rules: Order of operation math rules 04: Write JavaScript: the Script Element 05. Variables: Store data with variables 06. Prompt Box: Ask questions with prompt 07. Adding Strings: Joining strings and numbers with + 08. If Statements: Check user responses with if statements 09. Boolean values: true & false 10. Confirm Box: The confirm command 11. Null value: The special value null 12. If Conditions: Combining conditions with && and || 13. While loop: Repeat code with while loops Now, we shall progress to the new topics: 01. JavaScript Functions 02. JavaScript Events & handlers 03. Working With Arrays 04. Working With Dates 05. String functions in JavaScript 06. Working with DOM 07. Form Validation The JavaScript calculator created on this thread - https://www.nairaland.com/1809691/creating-simple-calculator-raw-javascript#24648265 - will be better understood after this Part 2 tutorial. 1 Like |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by Nastydroid(m): 11:54pm On Jul 12, 2014 |
*spray mat* |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by Nobody: 12:01am On Jul 13, 2014 |
following, dhtml write a function that will push this to FP |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by dhtml(m): 12:04am On Jul 13, 2014 |
Chapter 01 : JavaScript Functions A function is a block of reusable code. It is useful because you can execute it many times. Let us create a function called hello which will just display an alert. Please note that in the two examples below, you will not get any result because the functions were not called and so will not be executed. Example 1: creating the function var hello = function () { Example 2: function hello () { Example 3: executing the functions var hello = function () { Example 4: function hello () { The syntax of functions is shown below: functionName(parameter1, parameter2, parameter3) { A function can have what we call arguments or parameters. Let us create a function that will alert the first and last name of a person. Example 5: function myname(first,last) { Example 6: A function can also return a result function myname(first,last) { |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by dhtml(m): 11:43pm On Jul 14, 2014 |
Chapter 02 : JavaScript Events & handlers JavaScript can react to DOM EVENTS. For example, when a key is pressed on the keyboard, or when mouse is clicked. However, before we can fully delve into JavaScript events, we need to take a brief look at DOM. HTML DOM (Document Object Model) When an html page is loaded, the browser creates a representation of every object on the page - this representation is called DOM. A graphical representation of DOM goes like this: The HTML DOM is a standard object model and programming interface for HTML. It defines: * The HTML elements as objects * The properties of all HTML elements * The methods to access all HTML elements * The events for all HTML elements With the object model (DOM), JavaScript gets all the power it needs to create dynamic HTML (dhtml): * JavaScript can change all the HTML elements in the page * JavaScript can change all the HTML attributes in the page * JavaScript can change all the CSS styles in the page * JavaScript can remove existing HTML elements and attributes * JavaScript can add new HTML elements and attributes * JavaScript can react to all existing HTML events in the page * JavaScript can create new HTML events in the page In this example, the content of the <h1> element is changed when a user clicks on it: <html> We can assign a function to the event, so when the event is triggered, the function is called - this kind of function is called an event handler. <html>When an event handler is called with 'this'. this represents the DOM object where the event took place in. So the handler used above called changetext can use id (which is the variable used to represent this). There are different classes of DOM events: * Mouse Events * Keyboard Events * Frame/Object Events * Form Events In the next class, we are going to be looking at the various classes and commonly used events with examples. 2 Likes |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by blueyedgeek(m): 5:15am On Jul 15, 2014 |
What is the difference between creating functions this way: function functionName(){ and this way: var variableName = function(){ Is there any difference in the two or is it just a matter of preference? Additionally, what is the difference between a parameter and an argument? 1 Like |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by dhtml(m): 6:06am On Jul 15, 2014 |
Excellent questions, let us illustrate. When you declare a function as a variable, the function body can change in the execution of the code, for example: var hello=function() {alert('Hello');} Function Parameters vs Argument Consider the function used earlier: function myname(first,last) {'Tony' and 'Olawale' are arguments, while first and last are parameters. |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by blueyedgeek(m): 2:35pm On Jul 15, 2014 |
dhtml: Excellent questions, let us illustrate.Clear on the difference between parameters and arguments but not on the two different methods of creating functions. Why are there two different methods? is one particular way more efficient than the other? 1 Like |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by dhtml(m): 3:33pm On Jul 15, 2014 |
The two have their advantages and drawbacks, however I will say that using var seem to be the more powerful method especially when creating prototype classes and oop javascript in general. However, that is beyond the scope of this current tutorial. |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by GodMode: 3:37pm On Jul 15, 2014 |
blueyedgeek: Clear on the difference between parameters and arguments but not on the two different methods of creating functions. Why are there two different methods? is one particular way more efficient than the other? I thought u created a javascript study group |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by GodMode: 3:39pm On Jul 15, 2014 |
dhtml: The two have their advantages and drawbacks, however I will say that using var seem to be the more powerful method especially when creating prototype classes and oop javascript in general. However, that is beyond the scope of this current tutorial. Liar liar pants on fire |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by blueyedgeek(m): 3:42pm On Jul 15, 2014 |
GodMode:Yes, to connect with like minds. How does that prevent me from commenting on this thread? |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by GodMode: 3:46pm On Jul 15, 2014 |
blueyedgeek: Yes, to connect with like minds. How does that prevent me from commenting on this thread? To create a study group means u have considerable amount of knowledge in javascript. So I guess u already know the answers to your question |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by blueyedgeek(m): 3:55pm On Jul 15, 2014 |
GodMode:Study Group: a group of people who meet to study a particular subject. The keyword there is "study" and study means to pursue knowledge |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by dhtml(m): 4:04pm On Jul 15, 2014 |
Jeez, spamming my threads is one way to frustrate my efforts, And so I unfollow and resign from this thread. It is possible that this was my last tutorial on nairaland. |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by GodMode: 4:07pm On Jul 15, 2014 |
blueyedgeek: Study Group: a group of people who meet to study a particular subject. Na cult be dat na... dhtml should explain functions in this order: Anonymous functions Function declaration Function expression Function constructor Function hoisting Self-invoking functions Functions as values Functions as expression Functions as objects. This is how javascript functions work. Na my opinion be dis Oooo me never reach blueyedgeek level Oooo . |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by blueyedgeek(m): 4:29pm On Jul 15, 2014 |
dhtml: Jeez, spamming my threads is one way to frustrate my efforts, |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by dhtml(m): 4:50pm On Jul 15, 2014 |
GODMode, you should continue the thread, because it is your jamtalking that made me end this class permanently. So let us all troll and enjoy ourselves while we are at it. |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by sunday478(m): 5:08pm On Jul 15, 2014 |
dhtml: GODMode, you should continue the thread, because it is your jamtalking that made me end this class permanently. So let us all troll and enjoy ourselves while we are at it.Bros abeg, just like the bible said and I quote, "he that is well doesn't need a doctor except he that is seek'. He may not need it, but we are seriously following, pls contnue it for our own sake. |
Re: JavaScript Tutorial From The Scratch Brought To You From Part 2 by Nobody: 7:27pm On Jul 15, 2014 |
dhtml do you want me to die? |
(1)
I Have A Website For Sale With Free Twitter Account Of 237k Followers / Who's Interested In Starting A News Blog/ Agency Wit Me / Which WP Plugin Displays "A New User Just Signed Up" Popup And Disappears.
(Go Up)
Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health religion celebs tv-movies music-radio literature webmasters programming techmarket Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10) Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 34 |