Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / New
Stats: 3,148,898 members, 7,802,900 topics. Date: Saturday, 20 April 2024 at 02:37 AM

Javascript Corners - Webmasters - Nairaland

Nairaland Forum / Science/Technology / Webmasters / Javascript Corners (925 Views)

as webmaster you can make over 150 million naira through four corners / Dhtml Quiz: How Will You Detect If A Browser Support Javascript From Php Code? / Rounded Table Corners In A Webpage,how? (2) (3) (4)

(1) (Reply) (Go Down)

Javascript Corners by Nobody: 12:43pm On Oct 16, 2012
Sorry guys was terribly busy with School(Aptech) and Life and ex-Relationships( cry)), but now am back and i have stuffs to write here about JavaScript development and first i'll be using this as introduction, just decided to pick a new place to rant about JS Development because as much as you know it JS is getting Faster(V8) and even in Server Environments(NodeJS) or even with more powerful architecture (Dojo/Backbone/amberJS) but am not jumping into frameworks as they hinder your knowledge of JavaScript so i'll start with the basic to the hardest. so have fun.
Re: Javascript Corners by Nobody: 12:48pm On Oct 16, 2012
We are all familiar with the simple pattern of creating JavaScript Objects like this,Rule 1 Everything is an object in JavaScript, even function is a First-Class Object with properties,

// A car "class"
function Car( model ) {

this.model = model;
this.color = "silver";
this.year = "2012";

this.getInfo = function () {
return this.model + " " + this.year;
};

}

var test=new Car();
test.model="Toyota";
test.color="Red";
test.year="2010";
console.dir(test);

Re: Javascript Corners by Nobody: 12:51pm On Oct 16, 2012
Re: Javascript Corners by Nobody: 1:05pm On Oct 16, 2012
//Let's try using Literal Object also

var Car={
year:"2012",
color:"Red",
getinfo:function(){
console.log(this.color);
},

};

car.year="2012";
car.color="Blue";


However with this Pattern we can't have a constructor so can't do this

var x="Toyota Ramus";

var Car=new car(x); //Car doesn't not have a constructor
console.log(car.year); //works



The Classical approach actually allows us to achieve Prototypical Inheritance to All Objects, while this creates an Object with keys and functions attached to this, calling a car.prototype yields to "Object"
Re: Javascript Corners by Nobody: 1:07pm On Oct 16, 2012
//Style 2
var x=Object.create(null); //Empty Object
x['year']=2012;
x['getinfo']=function(){console.log(this.year)};
x['model']="Toyota";
console.log(x.getinfo());
Re: Javascript Corners by Nobody: 1:10pm On Oct 16, 2012
//Style 3 Using Object API
var x=Object.create(null);
x['year']=2012;
x['getinfo']=function(){console.log(this.year)};
x['model']="Toyota";
console.log(x.getinfo());

var y=Object.create(x);
y['addFunc']=function(){console.log("Bleep Shit New Functions"wink}
console.log(x.getinfo()); //Works
console.log(y.getinfo()); //Works too
console.log(x.addFunc()); //Dude seriously undecided
console.log(y.addFunc()); //freaking works too

So we can create a Top Object and have several Objects inherit from them e.g Car->SuperCar->Super-Space-Car
Re: Javascript Corners by Nobody: 1:23pm On Oct 16, 2012
//But wait a min there's a danger here assuming am i have an array of functions which should hold objects of cars and display their name while traversing

function Car(model){
this.model=model
}
var t=new Car("Skirach" );
var x=Object.create(null);
x['year']=2012;
x['getinfo']=function(){console.log(this.year)};
x['model']="Toyota";
console.log(x.getinfo());

var y=Object.create(x);
y['addFunc']=function(){console.log("Bleep Shit New Functions" )}
//Array of Functions
//[] means array and because JavaScript is Function i can do stuff like this 2.toString() or "i Love Sex".trim() or [a,b,c].slice().forEach(function(i){console.log(i);}) That Shit Cray right
var ArrayOfFunctions=[new Car("Toyota" ),new Object(),new Car("Honda" ),x].forEach(function(item){
//Because x is an Object and not function Object of Car it skips it and that's it
if(item instanceof Car){
console.log(item.model); //This Code assumes the item has a model and this is bad to write
//for JS Purist
if('model' in item)
{
console.log(item['model'] || item.model);
}
}
else{
console.log("This Item[%s] has no property model and is not a car Object ",item);
}


And people say JavaScript is Crap
Re: Javascript Corners by Nobody: 7:47pm On Oct 16, 2012
console.log -> you need to explain that one to your students. Only FF or crossbrowser?
Re: Javascript Corners by Nobody: 8:37pm On Oct 16, 2012
it works on all browsers well i think I.E too should work
Re: Javascript Corners by Nobody: 11:09pm On Oct 16, 2012
pc guru: it works on all browsers well i think I.E too should work
Well, i am a student on this thread, but i somehow feel that it is tied to firebug and is not crossplatform, but please help the olodo student to confirm.
Re: Javascript Corners by Nobody: 11:17pm On Oct 16, 2012
won't work on IE but its no big deal, console.log is never in your production site, and to be frank I.E i hardly test on I.E but with Firebug Lite on IE it will work.
Re: Javascript Corners by Nobody: 8:42am On Oct 17, 2012
^^^Gracias teacher. . .
Re: Javascript Corners by Nobody: 9:40pm On Oct 17, 2012
//Today am a bit drunk so i can't write much so we will look at Prototype Inheritance
Because in JavaScript everything is an Object we can add a function to a prototype to a Object to Share an a method to any Function created, a prototype method/variable can be attached before initialization and after initialization. example let's create a Class Objects

//Create a Class Called Song
function Song(title){
this.title=title;
}
//Create a Class Called Artist
function Artist(name){
this.name=name;

}
//Create a Class Called Album
function Album(title,genre){
this.title=title; this.genre=genre;
}
//Create a shared Array to Hold Database and Functions to Add Songs
Album.prototype.database=[];
Album.prototype.addSongs=function(a){
if(a instanceof Song || a instanceof Array){
this.database.push(a);
}
}
//Create a shared Database and a function to list the Records
Artist.prototype.database=[];

//This will create a function that will traverse the properties of each
//NOTE: This is not a Good practice you should make use of a getAlbum that returns the data after transvered

Artist.prototype.listTracks=function(){
this.database.forEach(function(item){
item.database.forEach(function(index){
index.forEach(function(e)
{
console.log(e.title);
});
});
})
}
//Adding Album to Artist
Artist.prototype.addAlbum=function(a){
if(a instanceof Album){
this.database.push(a);
}
else{
console.log( " %s is not a Class of Album " );
}
}
//Let's make use of the newly created Objects
var trak=[new Song(" it's over " ),new Song( " Oyato " )];
var NaijaMix=new Album(" NaijaMix 2012"," Party Track " );
var ArtistJimmyJat=new Artist(" Tonto Dike " );
NaijaMix.addSongs(trak);
ArtistJimmyJat.addAlbum(NaijaMix);
ArtistJimmyJat.listTracks();
Re: Javascript Corners by Nobody: 2:59pm On Oct 24, 2012
Just a Simple Update all my tutorials will be tested with Firebug and FireUnit on FireFox to give a professional feel so next lessons will use it so u can download it
http://fireunit.org/fireunit-1.0a4.xpi (Requires Firebug)
Re: Javascript Corners by dhtml(m): 2:18am On Oct 25, 2012
iite man
Re: Javascript Corners by Nobody: 2:13pm On Oct 25, 2012
Before i head out for sallah since i was a former Muslim, let's practice a bit with some FireUnit Code;

1. Testing Your Code with simple ok


var test=["remi","body"];

fireunit.ok(test instanceof Array,"The test Variable is an array Object" );
fireunit.ok(test instanceof Object,"Test too is an Object" );
fireunit.ok(test == 2,"Test is Equal to 2" );
fireunit.testDone();
Re: Javascript Corners by Nobody: 2:16pm On Oct 25, 2012
2. Comparing with Compare API


var test=["remi","body","geostigma"];
var comparingTest=["tayo","bisi","geostigma"];
for(i=0;i < comparingTest.length;i++){
fireunit.compare(test[i],comparingTest[i],"The Comparing test" );
}
fireunit.testDone()

Re: Javascript Corners by dhtml(m): 7:29pm On Oct 25, 2012
*Peeping*
Re: Javascript Corners by Ajibel(m): 2:11am On Oct 26, 2012
*copying*
Re: Javascript Corners by Ajibel(m): 2:13am On Oct 26, 2012
I'd appreciate a JS Math object tutorial. Not gettin d best of it via w3s Sir/teacher!
Re: Javascript Corners by Nobody: 9:50am On Oct 28, 2012
Actually Maths Functions are easy to use based on what you are using them for so i can't really give an example because it will involve an Application of it e.g Animation,Graphics, or something else, but they are static methods just by using Math.sin() and you get your results.
Re: Javascript Corners by Nobody: 10:02am On Oct 28, 2012
Today we will create a Module with Self Executing Function inside and the purpose of this is to have it return a function and keeping our private codes, now why do we do this, 1 to expose only some methods to users, and also to avoid naming-collision, this is what is also used as APIS in javascript, and it allows you to easily change the code once and it reflects in all places. i'll be testing with fireunit as stated before.

DO: Create an API of BrothelFinder with 3 method and 1 properties Methods, FindAllBrothels,FindSexWorker,FindCheapestBrother Properties Version,
Re: Javascript Corners by Nobody: 11:17am On Oct 28, 2012

var BrotherFinder=(function(){
var VERSION=0.1;
var brothels=[["99",100],["Peckers",1000],["Obalande side",2000],["Ambassadors",3000],["Why Not Road side",400],["Casino",2000],["Elegushi",50],["Moremi Hall",2000]];
var workers=["candy99","shollaBaby","sizzlyJoke","hotP","sexyDiva","endlessO","sweetBottom"];



//Hidden Methods
function _findAllBrother(){
fireunit.ok(brothels instanceof Array,"Yes the Objects are all arrays" );
fireunit.testDone();
return brothels;
}


function _findSexWorker(name){
fireunit.ok(typeof name === 'string',"Yes this is a String" );
fireunit.ok(workers instanceof Array,"Yes this record is an Array" );
fireunit.testDone();
var foundName=false;
workers.forEach(function(item){
if(item === name){
foundName=true;
}
})
if(foundName === true){
return "Yes "+name+" is in Our Records";
}
else{
return "Sorry we don't have any Hooker called "+name+" but we are sure the others will meet your needs";
}
}


function _findCheapest(){

var _foundRecord=null;
fireunit.ok(brothels instanceof Array,"Yes this are all instances of Array" );
fireunit.testDone();
//go through the brothels
var price;
brothels.forEach(function(item,index){

//if first record store
if(index == 0){
price=item[1]; //store the first price
_foundRecord=item[1];
}
else{
//if the next price is lower the current price append to it
if(item[1] == price || item[1] < price){
price=item[1];
_foundRecord=item[0];
console.log(item[0]);
}
}
});


return {"price":price,"name":_foundRecord};
}

return {
findAllBrothels:_findAllBrother ,
findCheapestBrothel:_findCheapest,
findSexWorker:_findSexWorker,
ver:VERSION
};




})();
Re: Javascript Corners by Nobody: 11:39am On Oct 28, 2012
and to use simply say

BrothelFinder.findAllBrothers();
BrothelFinder.ver
BrothelFinder.findSexWorker(name);

(1) (Reply)

Webmaster Needed Urgently / www.technologyavenue.com.ng / htaccess

(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. 54
Disclaimer: Every Nairaland member is solely responsible for anything that he/she posts or uploads on Nairaland.