JavaScript Development
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me
Go Back   Dev Shed ForumsWeb DesignJavaScript Development

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old November 19th, 2005, 10:26 AM
Destruantes Destruantes is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Nov 2005
Posts: 79 Destruantes User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 1 Day 13 m 2 sec
Reputation Power: 5
Arrays

I can't seem to get the hang of arrays in javascript, but I feel like I need 'em, 'cause daaaang this is ugly and impractical(and just a portion of the entire code, something like 200 elements) can anyone tell me how to do? (Yes this is one of the few times that I actually do want some code examples)

Code:
a2mover.width=kcuf
a2mover.height=ykcuf
b2mover.width=kcuf
b2mover.height=ykcuf
c2mover.width=kcuf
c2mover.height=ykcuf
d2mover.width=kcuf
d2mover.height=ykcuf
a3mover.width=kcuf
a3mover.height=ykcuf
b3mover.width=kcuf
b3mover.height=ykcuf
c3mover.width=kcuf
c3mover.height=ykcuf
d3mover.width=kcuf
d3mover.height=ykcuf
a4mover.width=kcuf
a4mover.height=ykcuf
b4mover.width=kcuf
b4mover.height=ykcuf
c4mover.width=kcuf
c4mover.height=ykcuf
d4mover.width=kcuf
d4mover.height=ykcuf

Reply With Quote
  #2  
Old November 19th, 2005, 10:46 AM
aconway aconway is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: May 2003
Posts: 342 aconway User rank is Corporal (100 - 500 Reputation Level)aconway User rank is Corporal (100 - 500 Reputation Level)aconway User rank is Corporal (100 - 500 Reputation Level)aconway User rank is Corporal (100 - 500 Reputation Level) 
Time spent in forums: 3 Days 13 h 4 m 24 sec
Reputation Power: 10
mover[letter][number][height]
mover[letter][number][width]

this is a multidimensional array (aka arrays within arrays)

the main array with every thing in it is mover and it is divided by [letter] then [letter] is divided by [number] and number has two values [height] and [width]

so...

mover[a][1][25px] = (the mover a1's height is 25px)
mover[a][1][50px] = (the mover a1's width is 50px)
mover[a][2][25px] = (the mover a2's height is 25px)
mover[a][2][50px] = (the mover a2's width is 50px)
mover[b][1][25px] = (the mover b1's height is 25px)
mover[b][1][50px] = (the mover b1's width is 50px)

i'm a visual learner so I think of this as...
Code:
Array mover (
    -> Array a (
         -> Array 1 (
             -> 25px
             -> 50px
             )
         -> Array 2 (
             -> 25px
             -> 50ps
             )
     )
     -> Array b (
         -> Array 1 (
             -> 25px
             -> 50px
             )
     )
)

Last edited by aconway : November 19th, 2005 at 10:57 AM.

Reply With Quote
  #3  
Old November 19th, 2005, 11:02 AM
jsKid's Avatar
jsKid jsKid is offline
Application is what Divides Us
Dev Shed Regular (2000 - 2499 posts)
 
Join Date: Dec 2002
Location: Titusville, FL
Posts: 2,169 jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 2 Weeks 2 Days 13 h 31 m 44 sec
Reputation Power: 54
Send a message via AIM to jsKid Send a message via MSN to jsKid
MySpace
Something like this maybe?

Assuming that you're wanting to assign the values...

Code:

var W3= document.getElementById;
var IE= document.all; // Opera7 as well
var NN= document.layers;

function getObj(ref){
  return((W3) ? document.getElementById(ref) :
	 (IE) ? document.all[ref]            :
	 (NN) ? document.layers[ref]         : null);
}

function assign_Val(n,arr,attr){
  var kcuf='100px', ykcuf='100px';
  for (var i= arr.length; i >= 0; i--){
    for (var j= attr.length; j >= 0; j--){
      for (var zero=0; n > zero; n--){
        getObj(arr[i]+n+'mover').style[ attr[j] ]= ((attr[j] == 'width') ? kcuf : ykcuf);
      }
    }
  }
}


Code:
window.onload= function(){
  assign_Val(  4, ['a','b','c','d'], ['width','height']  );
};


[EDIT]

If you don't like the above array with the function call separate it off like
Code:
var arrObj= ['a','b','c','d'];

window.onload= function(){
  assign_Val(  4, arrObj, ['width','height']  );
};
Comments on this post
Destruantes agrees: Damn great advice - a real pro
__________________
Download [ Fx | Op ] Validate [ Markup | Css ]

Last edited by jsKid : November 19th, 2005 at 12:17 PM.

Reply With Quote
  #4  
Old November 22nd, 2005, 07:29 AM
Destruantes Destruantes is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Nov 2005
Posts: 79 Destruantes User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 1 Day 13 m 2 sec
Reputation Power: 5
Quote:
Originally Posted by aconway
mover[letter][number][height]
mover[letter][number][width]

this is a multidimensional array (aka arrays within arrays)

the main array with every thing in it is mover and it is divided by [letter] then [letter] is divided by [number] and number has two values [height] and [width]

so...

mover[a][1][25px] = (the mover a1's height is 25px)
mover[a][1][50px] = (the mover a1's width is 50px)
mover[a][2][25px] = (the mover a2's height is 25px)
mover[a][2][50px] = (the mover a2's width is 50px)
mover[b][1][25px] = (the mover b1's height is 25px)
mover[b][1][50px] = (the mover b1's width is 50px)

i'm a visual learner so I think of this as...
Code:
Array mover (
    -> Array a (
         -> Array 1 (
             -> 25px
             -> 50px
             )
         -> Array 2 (
             -> 25px
             -> 50ps
             )
     )
     -> Array b (
         -> Array 1 (
             -> 25px
             -> 50px
             )
     )
)


sorry it took me so long to answer to the post, been away for a few days...just wanted to say thanx...big time! You have no idea how greatful I am, I really apreciate your help!

Reply With Quote
  #5  
Old November 22nd, 2005, 09:40 AM
Destruantes Destruantes is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Nov 2005
Posts: 79 Destruantes User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 1 Day 13 m 2 sec
Reputation Power: 5
Quote:
Originally Posted by jsKid
Something like this maybe?

Assuming that you're wanting to assign the values...

Code:

var W3= document.getElementById;
var IE= document.all; // Opera7 as well
var NN= document.layers;

function getObj(ref){
  return((W3) ? document.getElementById(ref) :
	 (IE) ? document.all[ref]            :
	 (NN) ? document.layers[ref]         : null);
}

function assign_Val(n,arr,attr){
  var kcuf='100px', ykcuf='100px';
  for (var i= arr.length; i >= 0; i--){
    for (var j= attr.length; j >= 0; j--){
      for (var zero=0; n > zero; n--){
        getObj(arr[i]+n+'mover').style[ attr[j] ]= ((attr[j] == 'width') ? kcuf : ykcuf);
      }
    }
  }
}


Code:
window.onload= function(){
  assign_Val(  4, ['a','b','c','d'], ['width','height']  );
};


[EDIT]

If you don't like the above array with the function call separate it off like
Code:
var arrObj= ['a','b','c','d'];

window.onload= function(){
  assign_Val(  4, arrObj, ['width','height']  );
};


Man this made me realise that I have such a long way to go...can some kind soul please load this code with remarks? The parts that I don't get are particularly the

Code:
var W3= document.getElementById;
var IE= document.all; // Opera7 as well
var NN= document.layers;


Code:
getObj(arr[i]+n+'mover').style[ attr[j] ]= ((attr[j] == 'width') ? kcuf :


bits...oh...and I thought you had to declare it as an array first? (the myarray=new Array; part)

I guess I need to know more about the basics of arrays...like how do I asign a html id to an array so I can manipulate it later on?


imarr=new Array;
for (i=1; i<=5; i=i+1)
{ imarr[i]= 'imvar' + i };

imgindex = 2
imarr[imgindex].width= 200



<IMG ID=imvar1 SRC="katt.jpg">
<IMG ID=imvar2 SRC="katt.jpg">
<IMG ID=imvar3 SRC="katt.jpg">

[/code]

Obviously this code won't work, but maybe you can see where I'm going with it? how do I do it?

Reply With Quote
  #6  
Old November 22nd, 2005, 05:02 PM
jsKid's Avatar
jsKid jsKid is offline
Application is what Divides Us
Dev Shed Regular (2000 - 2499 posts)
 
Join Date: Dec 2002
Location: Titusville, FL
Posts: 2,169 jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 2 Weeks 2 Days 13 h 31 m 44 sec
Reputation Power: 54
Send a message via AIM to jsKid Send a message via MSN to jsKid
MySpace
Seeing that I am the one who provided the code, maybe I should
also be the one to describe it's usess.. though I'm sure others
are capable as well.

Code:
//------------------------------------------------------------------------
// Object Detection:
//------------------------------------------------------------------------
// Object detection is the testing of an object, property, or method to
// detect that a certain object, property, or method exists before using
// to releave a particular browser's user from countless errors.

var W3= document.getElementById;
var IE= document.all; // Opera7 as well
var NN= document.layers;

//------------------------------------------------------------------------
// function getObj()...
//------------------------------------------------------------------------
// Here is a function that returns a reference to an object depending on
// which browser they are using:
// For Example:
// W3 -- IE6, NN6, MozFF, Konqueror, Safari, ...
// IE -- IE, Opera7, ...
// NN -- NN, ...

function getObj(ref){
  return((W3) ? document.getElementById(ref) :
	 (IE) ? document.all[ref]            :
	 (NN) ? document.layers[ref]         : null);
}

//------------------------------------------------------------------------
// function assign_Val()...
//------------------------------------------------------------------------
//  This function takes the values assigned to each parameter and assigns
// them to each object specified in the array (assigned to the arr parameter).
//

function assign_Val(n,arr,attr){

  // kcuf -- assumedly the width
  // ykcuf -- assumedly the height
  var kcuf='100px', ykcuf='100px';

  // loops through the paramter arr (an array) and counts down backwards from
  // the arrays length to zero (as KorRed Devil suggested is faster)
  for (var i= arr.length; i >= 0; i--){

    // loops through the parameter attr backwards, prepping the assignment
    // of the 'width' or 'height'
    for (var j= attr.length; j >= 0; j--){

      // the paramter n is the number of objects that are in each group of
      // the arr paramter.
      // For Example:
      // a1mover, a2mover, a3mover, a4mover, b1mover, b2mover, ...
      for (var zero=0; n > zero; n--){

        // Refer to the getObj function description above
        //----------------------------------------------------------------
        // .style[]
        //----------------------------------------------------------------
        // All objects have multiple methods to access them, or notations
        // to visually format the access.
        // - attr[j] could be either 'width' or 'height'
        // the equivalent to the below notation is:   ...style.width= ... but
        // because we are not directly accessing the width or height, we must
        // use this particular notation.

        getObj(arr[i]+n+'mover').style[ attr[j] ]= ((attr[j] == 'width') ? kcuf : ykcuf);
      }
    }
  }
}



This part, I felt, deserved another section to itself so..
Basically this code is an if/else statement, though formatted
in a different notation.
Code:
((attr[j] == 'width') ? kcuf : ykcuf);

If you wanted it in if/else format it would be more redundant.
Code:
        if (att[j] == 'width'){
          getObj(arr[i]+n+'mover').style[ attr[j] ]= kcuf;
        }else{
          getObj(arr[i]+n+'mover').style.[ att[j] ]= ykcuf;
        }
 

The amount of space, coding it takes up really isn't all that
different though it is better practice to have concision and readability.

Reply With Quote
  #7  
Old November 22nd, 2005, 05:37 PM
jsKid's Avatar
jsKid jsKid is offline
Application is what Divides Us
Dev Shed Regular (2000 - 2499 posts)
 
Join Date: Dec 2002
Location: Titusville, FL
Posts: 2,169 jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 2 Weeks 2 Days 13 h 31 m 44 sec
Reputation Power: 54
Send a message via AIM to jsKid Send a message via MSN to jsKid
MySpace
Most objects, properties, and methods in javascript especially have
multiple ways to be accessed due to browser incompatibilities over
the years... so many browsers have gone and taken the extra steps
to include backwards compatibility and cross browser solutions...

though in this case, it is merely for ease of using arrays.

These are exactly the same thing... though the second can be
used with more ease, as far as I am concerned...
Code:
var arr= new Array();
var arr= [];

Reply With Quote
  #8  
Old November 22nd, 2005, 06:02 PM
ProggerPete ProggerPete is offline
Contributing User
Dev Shed Beginner (1000 - 1499 posts)
 
Join Date: May 2003
Location: Brisbane, Australia
Posts: 1,441 ProggerPete User rank is Sergeant (500 - 2000 Reputation Level)ProggerPete User rank is Sergeant (500 - 2000 Reputation Level)ProggerPete User rank is Sergeant (500 - 2000 Reputation Level)ProggerPete User rank is Sergeant (500 - 2000 Reputation Level)ProggerPete User rank is Sergeant (500 - 2000 Reputation Level) 
Time spent in forums: 1 Week 1 Day 1 h 35 m 23 sec
Reputation Power: 24
Quote:
var W3= document.getElementById;
var IE= document.all; // Opera7 as well
var NN= document.layers;

function getObj(ref){
return((W3) ? document.getElementById(ref) :
(IE) ? document.all[ref] :
(NN) ? document.layers[ref] : null);
}


My 2 cents on browser detection. I think setting up vars that indicate what sort of browser is running is bad. In this particular instance you won't run into any problems but if you rely on that detection to branch other scripts you could hit issues.

The danger is that you might hit a browser that supports document.all but isn't IE. Having decided that the browser is IE your script then tries to use IE only methods which could then fail.

If I was going to write a getObj script it I'd skip the browser detection and just use object detection within the function.

Code:
function getObj(ref)
{
	return document.getElementById ? document.getElementById(ref) : document.all ? document.all[ref] : document.layers ? document.layers[ref] : null;
}
Comments on this post
vbrtrmn agrees: nice!
__________________
Like the answers I give? Why not ask me directly at my forum. I'm always glad to help.

Javascript scripts and tips can be found at Dynamic Tools.
Check out DynamicTable, the best javascript table sorter around.
Get reliable and affordable hosting at www.thinksmarthosting.com

Reply With Quote
  #9  
Old November 22nd, 2005, 09:08 PM
jsKid's Avatar
jsKid jsKid is offline
Application is what Divides Us
Dev Shed Regular (2000 - 2499 posts)
 
Join Date: Dec 2002
Location: Titusville, FL
Posts: 2,169 jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level)jsKid User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 2 Weeks 2 Days 13 h 31 m 44 sec
Reputation Power: 54
Send a message via AIM to jsKid Send a message via MSN to jsKid
MySpace
Well--you're right. It could be misleading and lead me/others into
unexpected erros with the way that I was using my getObj function
except that is where experience comes into play.

I only use that setup cause I know what I am using works with
certain browsers for sure... every now and again I have to ask,
but even so... you're "ways" in general seem to be better.

Reply With Quote
Reply

Viewing: Dev Shed ForumsWeb DesignJavaScript Development > Arrays


Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  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

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump




 Free IT White Papers!
 
How to Present Effectively Online
This white paper offers practical and actionable advice on the key steps that any presenter should consider as they plan and execute a Webinar or online meeting.

 
Open Source Security Myths
Open Source Software (OSS) is computer software whose source code is available to the general public with relaxed or non-existent intellectual property restrictions (or arrangement such as the public domain), and is usually developed with the input of many contributors.

 
Power and Cooling Capacity Management for Data Centers
This paper describes the principles for achieving power and cooling capacity management.

 
Scalable, Fault-Tolerant NAS for Oracle - The Next Generation
For several years NAS has been evolving as a storage alternative for Oracle databases, and for good reason: NAS is quite often the simplest, most cost-effective storage approach for Oracle. Learn about the benefits that HP's approach to scalable NAS brings to Oracle environments in this comprehensive white paper.

 
Understanding Web Application Security Challenges
This white paper discusses many common threats and preventive measures for Web application security, and explains what you can do to help protect your organization.

 

Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 




© 2003-2010 by Developer Shed. All rights reserved. DS Cluster 3 Hosted by Hostway
For more Enterprise Application Development news, visit eWeek