Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 06-30-2012, 03:16 PM   PM User | #1
Sylvain_
New Coder

 
Join Date: Apr 2012
Posts: 14
Thanks: 2
Thanked 0 Times in 0 Posts
Sylvain_ is an unknown quantity at this point
Unhappy Object doesn't work properly

Code:
//cashRegister constructor

function CashRegister() {
    this.total = 0;
    this.items = new Array();
}

//cashRegister methods
Cashregister.prototype.addItem = function (item) {

    if (typeof item === "object") {
        this.items.push(item);
    }
    
}

//item constructor
function Item(name, unityPrice, category) {
    this.name = name;
    this.unityPrice = unityPrice;
    this.category = category;
}

//testing

var myCash = new CashRegister();
var myItem = new Item("cola", 2, "drinks");

myCash.addItem(myItem);

for (items in myCash.items) {
    document.writeln(items.name);
}
I want to make a cashregister framework in javascript. I'm used to make such things in fully OOP languages like C# and java, and thought it would be a challenge to make the same using javascript. In this example I try to print out the name of the objects in the items array, this array should be a property of the cashRegister object. I expected to see "cola", but i don't get any output. Sorry for my bad English, I'm a Belgian IT student.

Last edited by Sylvain_; 06-30-2012 at 03:42 PM.. Reason: uncomplete
Sylvain_ is offline   Reply With Quote
Old 06-30-2012, 04:02 PM   PM User | #2
DaveyErwin
Regular Coder

 
Join Date: Aug 2010
Posts: 814
Thanks: 12
Thanked 168 Times in 166 Posts
DaveyErwin is on a distinguished road
if you are trying to make it
like C# or Java then don't
use prototype
make it more like this ...

Code:
<script>
function CashRegister() {
    this.total = 0;
    this.items = new Array();
    this.addItem = function addItem(item){
	this.items.push(item);	
    }
}
function Item(name, unityPrice, category) {
    this.name = name;
    this.unityPrice = unityPrice;
    this.category = category;
}
var cola=new Item("cola", 2, "drinks")
var tea=new Item("tea", 4, "drinks")
var myCash = new CashRegister();
myCash.addItem(cola);
myCash.addItem(tea);
// because myCash.items is an array do this ..,
for (var i = 0; i < myCash.items.length; i++) {
    document.writeln(myCash.items[i].name);
}
</script>

Last edited by DaveyErwin; 06-30-2012 at 04:24 PM..
DaveyErwin is offline   Reply With Quote
Users who have thanked DaveyErwin for this post:
Sylvain_ (06-30-2012)
Old 06-30-2012, 04:10 PM   PM User | #3
Nile
Regular Coder

 
Nile's Avatar
 
Join Date: Jun 2008
Posts: 280
Thanks: 2
Thanked 46 Times in 46 Posts
Nile is an unknown quantity at this point
There are two main problems going on here.

The name of the type you're trying to access doesn't correspond to your object's name. It needs to be CashRegister.prototype.addItem.
Code:
//cashRegister methods
Cashregister.prototype.addItem = function (item) {
This now makes your object semi-completely functional, however, the way you're trying to access the data is flawed.
Code:
for (items in myCash.items) {
    document.writeln(items.name);
}
Here, you're setting a variable "items" to be equal to each key of myCash.items. Then, in the next line, you're trying to read an array of the key called "name". Naturally, something like this would be undefined.

To fix this, change the for loop to:
Code:
for (items in myCash.items) {
    document.writeln(myCash.items[items].name);
}
This should return something like cola Array. You can look further into this by looking deeper in the array:
Code:
for (items in myCash.items) {
    for(specific in myCash.items[items]){
        document.writeln(myCash.items[items][specific]);
    }
}
Good luck
Nile is offline   Reply With Quote
Users who have thanked Nile for this post:
Sylvain_ (06-30-2012)
Old 06-30-2012, 04:29 PM   PM User | #4
Sylvain_
New Coder

 
Join Date: Apr 2012
Posts: 14
Thanks: 2
Thanked 0 Times in 0 Posts
Sylvain_ is an unknown quantity at this point
Quote:
Originally Posted by DaveyErwin View Post
if you are trying to make it
like C# or Java then don't
use prototype
make it more like this ...

Code:
<script>
function CashRegister() {
    this.total = 0;
    this.items = new Array();
    this.addItem = function addItem(item){
	this.items.push(item);	
    }
}
function Item(name, unityPrice, category) {
    this.name = name;
    this.unityPrice = unityPrice;
    this.category = category;
}
var cola=new Item("cola", 2, "drinks")
var tea=new Item("tea", 4, "drinks")
var myCash = new CashRegister();
myCash.addItem(cola);
myCash.addItem(tea);
// because myCash.items is an array do this ..,
for (var i = 0; i < myCash.items.length; i++) {
    document.writeln(myCash.items[i].name);
}
</script>
If you can make it like this, I'm wondering why both in school and a site like codecademy learn the use of prototype. Or is there a difference between prototype and your approach?
Sylvain_ is offline   Reply With Quote
Old 06-30-2012, 04:39 PM   PM User | #5
DaveyErwin
Regular Coder

 
Join Date: Aug 2010
Posts: 814
Thanks: 12
Thanked 168 Times in 166 Posts
DaveyErwin is on a distinguished road
Quote:
Originally Posted by Sylvain_ View Post
If you can make it like this, I'm wondering why both in school and a site like codecademy learn the use of prototype. Or is there a difference between prototype and your approach?
Because they are teaching the javascript way,
not the C# or Java way.

this looks more javaScriptish to me …

Code:
<script>
function addItem(i){	
	i.dinc();
	this.totalCash = "$"+(Number(this.totalCash.split("$")[1]) + Number(i.unitPrice.split("$")[1])).toFixed(2);
	this.items.push({name:i.name,unitPrice:i.unitPrice,catagory:i.catagory,numOnhand:i.numOnhand,regTotcash:this.totalCash});
}
function dinc(){
	--this.numOnhand
}
Register1 = {totalCash:"$100.00",items:[],addItem:addItem}
Register2 = {totalCash:"$100.00",items:[],addItem:addItem}
var cola = {name:"cola",unitPrice:"$1.28",catagory:"drinks",numOnhand:24,dinc:dinc};
tea = {name:"tea",unitPrice:"$3.99",catagory:"drinks",numOnhand:16,dinc:dinc};
Register1.addItem(cola);
Register1.addItem(tea);
Register2.addItem(cola);
Register2.addItem(tea);
Register2.addItem(cola);
//!price of cola goes up!
cola.unitPrice = "$1.39";
Register2.addItem(tea);
Register1.addItem(cola);
Register1.addItem(tea);
var ri = Register1.items;
document.writeln("Register1<br>");
for (var i = 0; i < ri.length; i++) {
    document.writeln("this sale ",ri[i].name,ri[i].unitPrice," you have ",ri[i].numOnhand," left your register has ",ri[i].regTotcash,"<br>");
}
document.writeln("Register2<br>");
var ri = Register2.items;
for (var i = 0; i < ri.length; i++) {
    document.writeln("this sale ",ri[i].name,ri[i].unitPrice," you have ",ri[i].numOnhand," left your register has ",ri[i].regTotcash,"<br>");
}
</script>

Last edited by DaveyErwin; 07-01-2012 at 01:26 AM..
DaveyErwin is offline   Reply With Quote
Old 06-30-2012, 08:17 PM   PM User | #6
Richter
New Coder

 
Join Date: Jun 2012
Posts: 63
Thanks: 0
Thanked 11 Times in 11 Posts
Richter is an unknown quantity at this point
^
Weird javascript code I ever seen.
I fix your code in addItem function, your function can't check type of "item" is "Item" type.

Code:
//cashRegister constructor
function CashRegister() {
    this.total = 0;
    this.items = [];
    this.addItem = function (item) { if (item instanceof Item) this.items.push(item); }
}

//item constructor
function Item(name, unityPrice, category) {
    this.name = name;
    this.unityPrice = unityPrice;
    this.category = category;
}

//testing
var myCash = new CashRegister();
myCash.addItem( new Item("cola", 2, "drinks") );
myCash.addItem( new Item("pepci", 2, "drinks") );
myCash.addItem( new Item("spice", 2, "drinks") );

var Tmp = myCash.items;
for (var i = 0; i < Tmp.length; i++) document.writeln( Tmp[i].name );
Richter is offline   Reply With Quote
Old 06-30-2012, 11:53 PM   PM User | #7
Sylvain_
New Coder

 
Join Date: Apr 2012
Posts: 14
Thanks: 2
Thanked 0 Times in 0 Posts
Sylvain_ is an unknown quantity at this point
Quote:
Originally Posted by Richter View Post
^
Weird javascript code I ever seen.
I fix your code in addItem function, your function can't check type of "item" is "Item" type.

Code:
//cashRegister constructor
function CashRegister() {
    this.total = 0;
    this.items = [];
    this.addItem = function (item) { if (item instanceof Item) this.items.push(item); }
}

//item constructor
function Item(name, unityPrice, category) {
    this.name = name;
    this.unityPrice = unityPrice;
    this.category = category;
}

//testing
var myCash = new CashRegister();
myCash.addItem( new Item("cola", 2, "drinks") );
myCash.addItem( new Item("pepci", 2, "drinks") );
myCash.addItem( new Item("spice", 2, "drinks") );

var Tmp = myCash.items;
for (var i = 0; i < Tmp.length; i++) document.writeln( Tmp[i].name );
Thanks for the instanceof hint. My code doesn't really look weird to me, the only things is that is not really the javascript way, which I consider as positive.
Sylvain_ is offline   Reply With Quote
Old 06-30-2012, 11:56 PM   PM User | #8
Sylvain_
New Coder

 
Join Date: Apr 2012
Posts: 14
Thanks: 2
Thanked 0 Times in 0 Posts
Sylvain_ is an unknown quantity at this point
Quote:
Originally Posted by DaveyErwin View Post
if you are trying to make it
like C# or Java then don't
use prototype
make it more like this ...

Code:
<script>
function CashRegister() {
    this.total = 0;
    this.items = new Array();
    this.addItem = function addItem(item){
	this.items.push(item);	
    }
}
function Item(name, unityPrice, category) {
    this.name = name;
    this.unityPrice = unityPrice;
    this.category = category;
}
var cola=new Item("cola", 2, "drinks")
var tea=new Item("tea", 4, "drinks")
var myCash = new CashRegister();
myCash.addItem(cola);
myCash.addItem(tea);
// because myCash.items is an array do this ..,
for (var i = 0; i < myCash.items.length; i++) {
    document.writeln(myCash.items[i].name);
}
</script>
Thanks for the help. But I don't really like the javascript way, it really looks old-fashioned. I'm using the OOP-language way, which is in my opinion much better because it makes it more easy to use it as a extern library.
Sylvain_ is offline   Reply With Quote
Old 07-01-2012, 01:11 AM   PM User | #9
Richter
New Coder

 
Join Date: Jun 2012
Posts: 63
Thanks: 0
Thanked 11 Times in 11 Posts
Richter is an unknown quantity at this point
Quote:
Originally Posted by Sylvain_ View Post
Thanks for the instanceof hint. My code doesn't really look weird to me, the only things is that is not really the javascript way, which I consider as positive.
Oh, I didn't mean your code I mean DaveyErwin's example .

Quote:
Originally Posted by DaveyErwin View Post
Because they are teaching the javascript way,
not the C# or Java way.

this looks more javaScriptish to me …

Code:
<script>
function addItem(i){	
	i.dinc();
	this.totalCash = "$"+(Number(this.totalCash.split("$")[1]) + Number(i.unitPrice.split("$")[1])).toFixed(2);
	this.items.push({name:i.name,unitPrice:i.unitPrice,catagory:i.catagory,numOnhand:i.numOnhand,regTotcash:this.totalCash});
}
function dinc(){
	--this.numOnhand
}
Register = {totalCash:"$100.00",items:[],addItem:addItem}
var cola = {name:"cola",unitPrice:"$1.28",catagory:"drinks",numOnhand:24,dinc:dinc};
tea = {name:"tea",unitPrice:"$3.99",catagory:"drinks",numOnhand:16,dinc:dinc};
Register.addItem(cola);
Register.addItem(tea);
//!price of cola goes up!
cola.unitPrice = "$1.39";
Register.addItem(cola);
Register.addItem(tea);
var ri = Register.items;
for (var i = 0; i < ri.length; i++) {
    document.writeln("this sale ",ri[i].name,ri[i].unitPrice," you have ",ri[i].numOnhand," left your register has ",ri[i].regTotcash,"<br>");
}
</script>
As someone who run around .Net framework since version 2.0, I could say propotype of javascript is something really amazing that .Net framework will never has it even if you use MSIL.

If you like OOP concept, I suggest you study about real concept of OOP, not just their formation. After you understand OOP concept's purpose, you should study about Refactoring. If you can master these thing, your will coding OOP style in almost language like you breath
Richter is offline   Reply With Quote
Old 07-01-2012, 02:23 AM   PM User | #10
Sylvain_
New Coder

 
Join Date: Apr 2012
Posts: 14
Thanks: 2
Thanked 0 Times in 0 Posts
Sylvain_ is an unknown quantity at this point
Quote:
Originally Posted by Richter View Post
Oh, I didn't mean your code I mean DaveyErwin's example .



As someone who run around .Net framework since version 2.0, I could say propotype of javascript is something really amazing that .Net framework will never has it even if you use MSIL.

If you like OOP concept, I suggest you study about real concept of OOP, not just their formation. After you understand OOP concept's purpose, you should study about Refactoring. If you can master these thing, your will coding OOP style in almost language like you breath
Well I don't know if really understand what you mean... I've had OOP course in school, making UML schemes, learning about inheritance, polymorfism, and other related things. You mean to tell me there is more i have to know?
Sylvain_ is offline   Reply With Quote
Old 07-01-2012, 12:04 PM   PM User | #11
Richter
New Coder

 
Join Date: Jun 2012
Posts: 63
Thanks: 0
Thanked 11 Times in 11 Posts
Richter is an unknown quantity at this point
Yes, you need more then that if you want to master of OOP.
Try to question when you coding like "is it necessary to do this ?" or "what is this object really need to ?" and your code will better. As long as you don't understand root concept of OOP, you can't manipulate them as you will, all you can do is just follow other people suggestion.

I recoding some of your code to be an example how OOP should be.
1. Inner value like an array of receipt shouldn't touch by outside, think about someone put other object into your CashRegister.items, I'm sure it will be really ugly.

2. Name of class, method or variant should tell user about what's it do.
Code:
//you also can add other method or variant into this class if you see it's fit to do.
function CashRegister() {
    var _Items = [];
    this.total = function(){ return _Items.length };
    this.items = function(Index){ return _Items[Index]; };
    this.add = function(item){ if (item instanceof Receipt) _Items.push(item); };
}

function Receipt(name, unityPrice, category) {
    this.name = name;
    this.unityPrice = unityPrice;
    this.category = category;
}
Ps. sorry for short explanation, I'm write a long version first but power's blackout, so I lose my will to write it again.
Richter is offline   Reply With Quote
Reply

Bookmarks

Tags
array, javascript, objects, prototype

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 11:45 AM.


Advertisement
Log in to turn off these ads.