www.webdeveloper.com
Results 1 to 7 of 7

Thread: Saving function results as Object Properties

  1. #1
    Join Date
    Oct 2013
    Posts
    8

    Saving function results as Object Properties

    Hi All!

    I am doing a small challenge to review my study of Javascript, and I am having trouble with number 5 below. I am not sure how to set the key-value pairs in an object. I know that I could use my 'num' constructor to individually create new objects. But, how am I to pass an array element, and the result of the doubling function, into an object? Thanks so much in advance, and please let me know if I can clarify this post-I wasn't sure how much info would be helpful.

    The challenge:
    1) Create an array of numbers, save it to a variable

    2) Use a loop to iterate through each element of the array

    3) Write a separate “doubling” function that returns any number it is given multiplied by two

    4) Pass each number from the array to the “doubling” function in turn

    5) Save the original numbers and the doubled results as key-value pairs in an object

    My Code:
    Code:
    var numArray = [ 1,2,3,4,5,6,7]
    
    for (var i= 0; i<numArray.length; i ++){
        //console.log("The number in cell number " + i + " is " + numArray[i]);
                   console.log(doubling(numArray[i]));
                    }
                    
                    function doubling(n){
            n=n*2;
            return n;
            
        }
    
     function num(original, doubled){
    
        this.original= original;
        this.doubled= doubled;
       
     }

  2. #2
    Join Date
    Dec 2012
    Posts
    100
    Well an object in JavaScript acts like an associative array, you create one using braces.

    Code:
    var object = {};
    And you add items to it using dot notation if the key is a string or using square brackets for integers.

    Code:
    object[1] = 2;
    object.key = "value";
    You get items out the same way

    Code:
    //returns 2
    console.log(object[1]);
    
    //returns value
    console.log(object.key);

  3. #3
    Join Date
    Oct 2012
    Location
    Croatia
    Posts
    255
    I believe you wanted to do something like this:

    Code:
    function doubling(n){
        n=n*2;
        return n;     
    };
                   
    function Num(){
        this.original= [];
        this.doubled= [];  
    };
    
    Num.prototype.addElements = function(index,original,doubled){
    	this.original[index] = original;
    	this.doubled[index] = doubled;
    };
    
    Num.prototype.getOriginal = function(index){
    	return this.original[index];
    };
    
    Num.prototype.getDoubled = function(index){
    	return this.doubled[index];	
    };
    
    var numArray = [1,2,3,4,5,6,7];
    var doubledArray = [];
    var myObject = new Num();
    
    for (var i = 0; i < numArray.length; i++)
    {
    	doubledArray[doubledArray.length] = doubling(numArray[i]);
    	myObject.addElements(i,numArray[i],doubledArray[i]);
    	document.write("Original element at position: " + i + " is: " + numArray[i] + "<br />");
    	document.write("Doubled element at position: " + i + " is: " + myObject.getDoubled(i) + "<br />");
    }

  4. #4
    Join Date
    Oct 2013
    Posts
    8
    Thanks so much for the help guys! Can't tell you how helpful it is to be able to see the code written, and then explore the concepts that way!

    tech_soul8: Can I ask you a few questions about your code? I am new and trying to piece these concepts together.

    For the num constructor, you leave the brackets blank because we will be passing info of myObject from the loop into the Num constructor?

    Are you using index as a way of 'counting' through the arrays? So the index corresponds to the i counter in the loop? So numArray[i] in
    Code:
    myObject.addElements(i,numArray[i],doubledArray[i]);
    is using
    Code:
    this.original[index] = original
    to add the original numArray element? I'm pretty sure that is the case, but I just haven't seen this [index] concept before.

  5. #5
    Join Date
    Oct 2012
    Location
    Croatia
    Posts
    255
    I have left the brackets empty (no parameters) because I don't want ta pass any argument to my constructor function during the creation of new object. For this I have created addElements method which accepts three arguments namely: index, original and doubled respectively.

    Regarding your second question this is how addElements method looks like:

    Code:
    Num.prototype.addElements = function(index,original,doubled){
    	this.original[index] = original;
    	this.doubled[index] = doubled;
    };
    You can see that as explained above addElements method accepts three arguments. While constructing your function you can name this parameters however you like. The best approach is to give them symbolic names to reflect their truly use. So index parameter is used to assign an index position for each new element which is added to an array.

    In a for loop we have:

    Code:
    myObject.addElements(i,numArray[i],doubledArray[i])
    Inside the for loop i is initialization value and it starts from 0 (to populate the first array's element at index 0). So the above code simply tells JS to do the following:

    - add new element to the array (because two properties of Num constructor are actually arrays)
    - add original value from array "numArray" at index position specified by i (with each new iteration this i variable will be incremented by one and that way will correspond to the subsequent array's element index position)
    - add doubled value from array "doubledArray" at index position specified by i

    The same principle is used to extract values from an array with getOriginal and getDoubled methods.
    Last edited by tech_soul8; 10-25-2013 at 02:19 AM.

  6. #6
    Join Date
    Oct 2013
    Posts
    8
    Great! Many thanks for the help. I really appreciate the time you took. In wrapping up, I have two more quick questions:

    1.) Is it necessary to create the addElements method using prototyping? Or, could we set the index,original,doubled parameters in the num object constructor? I tried doing that, but couldn't get it to work.

    2.) I'm a little confused about the concept of key-value's in this case. The final object has two arrays. Are these two arrays considered to be the key value pairs?

    Thank You!

  7. #7
    Join Date
    Oct 2012
    Location
    Croatia
    Posts
    255
    1)No, it's not necessary. You could define addElements property within your Num template and JavaScript would automatically create it for you. Yes we can! Remember there's always more than one way of doing things.

    2) Objects are unordered collection of name(property)/value pairs. So in Num's case origianl and doubled are considered to be the properties of the Num object and their value is an array initializer ([])

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles