Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Help me understand variable pointers in javascript

Posted on 2010-09-17
4
372 Views
Last Modified: 2012-05-10
So, I'm trying to write some code that pulls an object from an array. I was expecting this object to go into it's own variable where I could make changes to it, and then write it somewhere else, without affecting the original object.

However, as you'll see in the attached code, the changes I make to what I thought was a *copy* of the object, also occur to the original. What do I need to do differently to make this work?

I tried using splice, but got the same result. I have tested this in Firefox and Safari with the same results.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
	<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Test</title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
	<script type="text/javascript">/*<![CDATA[*/ 
		var dir_list = {address: '', name: 'root', filetype: 'Directory', size: '13.36 GB', date: '03/31/2010 15:03 pm', contains: [
			{address: 'Bunnie JamboreeTHANK YOU.pdf', name: 'Bunnie JamboreeTHANK YOU.pdf', filetype: 'pdf', size: '9036.64 GB', date: '03/31/2010 15:00 pm', contains: null},
			{address: 'coupons/', name: 'coupons', filetype: 'Directory', size: '10.93 GB', date: '01/10/2010 14:54 pm', contains: []},
			{address: 'ice_guidelines.pdf', name: 'ice_guidelines.pdf', filetype: 'pdf', size: '3363.79 GB', date: '09/01/2009 00:26 am', contains: null},
			{address: 'images/', name: 'images', filetype: 'Directory', size: '12.14 GB', date: '03/31/2010 15:19 pm', contains: []},
			{address: 'imports/', name: 'imports', filetype: 'Directory', size: '18.21 GB', date: '02/15/2010 14:35 pm', contains: []},
			{address: 'Roxy Reservation Form.doc', name: 'Roxy Reservation Form.doc', filetype: 'doc', size: '1426.29 GB', date: '10/04/2009 15:24 pm', contains: null},
			{address: 'stinger/', name: 'stinger', filetype: 'Directory', size: '6.07 GB', date: '01/10/2010 15:20 pm', contains: []},
			{address: 'Wpg Ringette.PDF', name: 'Wpg Ringette.PDF', filetype: 'PDF', size: '44989.93 GB', date: '11/19/2009 04:02 am', contains: null}
		]};
		
		$(document).ready(function(){
			var x = dir_list.contains[3];
			x.address = "test";
			
			console.log(x);
			console.log(dir_list);
		});
	/*]]>*/</script>
	<link rel="stylesheet" href="css/jquery.clickonce.editor.css" media="screen" type="text/css" />
	<link rel="stylesheet" href="css/jquery-ui-1.8.2.custom.css" media="screen" type="text/css" />
</head>
<body>
</body>
</html>

Open in new window

0
Comment
Question by:dirknibleck
  • 2
4 Comments
 
LVL 19

Accepted Solution

by:
daveamour earned 300 total points
ID: 33706554
Try the attached code with the credit going to:
http://my.opera.com/GreyWyvern/blog/show.dml/1725165 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
	<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Test</title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
	<script type="text/javascript">/*<![CDATA[*/ 
		var dir_list = {address: '', name: 'root', filetype: 'Directory', size: '13.36 GB', date: '03/31/2010 15:03 pm', contains: [
			{address: 'Bunnie JamboreeTHANK YOU.pdf', name: 'Bunnie JamboreeTHANK YOU.pdf', filetype: 'pdf', size: '9036.64 GB', date: '03/31/2010 15:00 pm', contains: null},
			{address: 'coupons/', name: 'coupons', filetype: 'Directory', size: '10.93 GB', date: '01/10/2010 14:54 pm', contains: []},
			{address: 'ice_guidelines.pdf', name: 'ice_guidelines.pdf', filetype: 'pdf', size: '3363.79 GB', date: '09/01/2009 00:26 am', contains: null},
			{address: 'images/', name: 'images', filetype: 'Directory', size: '12.14 GB', date: '03/31/2010 15:19 pm', contains: []},
			{address: 'imports/', name: 'imports', filetype: 'Directory', size: '18.21 GB', date: '02/15/2010 14:35 pm', contains: []},
			{address: 'Roxy Reservation Form.doc', name: 'Roxy Reservation Form.doc', filetype: 'doc', size: '1426.29 GB', date: '10/04/2009 15:24 pm', contains: null},
			{address: 'stinger/', name: 'stinger', filetype: 'Directory', size: '6.07 GB', date: '01/10/2010 15:20 pm', contains: []},
			{address: 'Wpg Ringette.PDF', name: 'Wpg Ringette.PDF', filetype: 'PDF', size: '44989.93 GB', date: '11/19/2009 04:02 am', contains: null}
		]};

        Object.prototype.clone = function() {
          var newObj = (this instanceof Array) ? [] : {};
          for (i in this) {
            if (i == 'clone') continue;
            if (this[i] && typeof this[i] == "object") {
              newObj[i] = this[i].clone();
            } else newObj[i] = this[i]
          } return newObj;
        };
		
		$(document).ready(function(){
			var temp = dir_list.clone();
            
            var x = temp.contains[3];
			
            alert(dir_list.contains[3].address);

            x.address = "test";

            alert(x.address);

            alert(dir_list.contains[3].address);
		});
	/*]]>*/</script>
	<link rel="stylesheet" href="css/jquery.clickonce.editor.css" media="screen" type="text/css" />
	<link rel="stylesheet" href="css/jquery-ui-1.8.2.custom.css" media="screen" type="text/css" />
</head>
<body>
</body>
</html>

Open in new window

0
 
LVL 14

Assisted Solution

by:sam2912
sam2912 earned 200 total points
ID: 33706856
You are using jQuery, so try this instead:
http://api.jquery.com/jQuery.extend/
var x= jQuery.extend(true, {}, dir_list.contains[3]);

Open in new window

0
 
LVL 15

Author Comment

by:dirknibleck
ID: 33708156
Is this a new feature for splitting points, or did I complete the form wrong?
0
 
LVL 14

Expert Comment

by:sam2912
ID: 33708319
This is the first time I'm seeing a close request for allocation of points
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article shows how to create and access 2-dimensional arrays in JavaScript.  It includes a tutorial in case you are just trying to "get your head wrapped around" the concept and we'll also look at some useful tips for more advanced programmers. …
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

856 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question