We Keep Coding

Javascript wierd behaviour with ```Object```(s) [duplicate]

This question's answers are a community effort. Edit existing answers to improve this post. It is not currently accepting new answers or interactions.
What is the difference between a deep copy and a shallow copy?

Breadth vs Depth; think in terms of a tree of references with your object as the root node.
Shallow:
The variables A and B refer to different areas of memory, when B is assigned to A the two variables refer to the same area of memory. Later modifications to the contents of either are instantly reflected in the contents of other, as they share contents.
Deep:
The variables A and B refer to different areas of memory, when B is assigned to A the values in the memory area which A points to are copied into the memory area to which B points. Later modifications to the contents of either remain unique to A or B; the contents are not shared.

Shallow copies duplicate as little as possible. A shallow copy of a collection is a copy of the collection structure, not the elements. With a shallow copy, two collections now share the individual elements.
Deep copies duplicate everything. A deep copy of a collection is two collections with all of the elements in the original collection duplicated.

Try to consider following image
For example Object.MemberwiseClone creates a shallow copy link
and using ICloneable interface you can get deep copy as described here

In short, it depends on what points to what. In a shallow copy, object B points to object A's location in memory. In deep copy, all things in object A's memory location get copied to object B's memory location.
This wiki article has a great diagram.
http://en.wikipedia.org/wiki/Object_copy

Especially For iOS Developers:
If B is a shallow copy of A, then for primitive data it's like B = [A assign]; and for objects it's like B = [A retain];
B and A point to the same memory location
If B is a deep copy of A, then it is like B = [A copy];
B and A point to different memory locations
B memory address is same as A's
B has same contents as A's

Shallow copy: Copies the member values from one object into another.
Deep Copy: Copies the member values from one object into another.
Any pointer objects are duplicated and Deep Copied.
Example:
class String
{
int size;
char* data;
};
String s1("Ace"); // s1.size = 3 s1.data=0x0000F000
String s2 = shallowCopy(s1);
// s2.size =3 s2.data = 0X0000F000
String s3 = deepCopy(s1);
// s3.size =3 s3.data = 0x0000F00F
// (With Ace copied to this location.)

Just for the sake of easy understanding you could follow this article:
https://www.cs.utexas.edu/~scottm/cs307/handouts/deepCopying.htm
Shallow Copy:
Deep Copy:

I haven't seen a short, easy to understand answer here--so I'll give it a try.
With a shallow copy, any object pointed to by the source is also pointed to by the destination (so that no referenced objects are copied).
With a deep copy, any object pointed to by the source is copied and the copy is pointed to by the destination (so there will now be 2 of each referenced object). This recurses down the object tree.

char * Source = "Hello, world.";
char * ShallowCopy = Source;
char * DeepCopy = new char(strlen(Source)+1);
strcpy(DeepCopy,Source);
'ShallowCopy' points to the same location in memory as 'Source' does.
'DeepCopy' points to a different location in memory, but the contents are the same.

{Imagine two objects: A and B of same type _t(with respect to C++) and you are thinking about shallow/deep copying A to B}
Shallow Copy:
Simply makes a copy of the reference to A into B. Think about it as a copy of A's Address.
So, the addresses of A and B will be the same i.e. they will be pointing to the same memory location i.e. data contents.
Deep copy:
Simply makes a copy of all the members of A, allocates memory in a different location for B and then assigns the copied members to B to achieve deep copy. In this way, if A becomes non-existant B is still valid in the memory. The correct term to use would be cloning, where you know that they both are totally the same, but yet different (i.e. stored as two different entities in the memory space). You can also provide your clone wrapper where you can decide via inclusion/exclusion list which properties to select during deep copy. This is quite a common practice when you create APIs.
You can choose to do a Shallow Copy ONLY_IF you understand the stakes involved. When you have enormous number of pointers to deal with in C++ or C, doing a shallow copy of an object is REALLY a bad idea.
EXAMPLE_OF_DEEP COPY_ An example is, when you are trying to do image processing and object recognition you need to mask "Irrelevant and Repetitive Motion" out of your processing areas. If you are using image pointers, then you might have the specification to save those mask images. NOW... if you do a shallow copy of the image, when the pointer references are KILLED from the stack, you lost the reference and its copy i.e. there will be a runtime error of access violation at some point. In this case, what you need is a deep copy of your image by CLONING it. In this way you can retrieve the masks in case you need them in the future.
EXAMPLE_OF_SHALLOW_COPY I am not extremely knowledgeable compared to the users in StackOverflow so feel free to delete this part and put a good example if you can clarify. But I really think it is not a good idea to do shallow copy if you know that your program is gonna run for an infinite period of time i.e. continuous "push-pop" operation over the stack with function calls. If you are demonstrating something to an amateur or novice person (e.g. C/C++ tutorial stuff) then it is probably okay. But if you are running an application such as surveillance and detection system, or Sonar Tracking System, you are not supposed to keep shallow copying your objects around because it will kill your program sooner or later.

What is Shallow Copy?
Shallow copy is a bit-wise copy of an object. A new object is created that has an exact copy of the values in the original object. If any of the fields of the object are references to other objects, only the reference addresses are copied i.e., only the memory address is copied.
In this figure, the MainObject1 has fields field1 of type int, and ContainObject1 of type ContainObject. When you do a shallow copy of MainObject1, MainObject2 is created with field2 containing the copied value of field1 and still pointing to ContainObject1 itself. Note that since field1 is of primitive type, its value is copied to field2 but since ContainedObject1 is an object, MainObject2 still points to ContainObject1. So any changes made to ContainObject1 in MainObject1 will be reflected in MainObject2.
Now if this is shallow copy, lets see what's deep copy?
What is Deep Copy?
A deep copy copies all fields, and makes copies of dynamically allocated memory pointed to by the fields. A deep copy occurs when an object is copied along with the objects to which it refers.
In this figure, the MainObject1 have fields field1 of type int, and ContainObject1 of type ContainObject. When you do a deep copy of MainObject1, MainObject2 is created with field2 containing the copied value of field1 and ContainObject2 containing the copied value of ContainObject1. Note any changes made to ContainObject1 in MainObject1 will not reflect in MainObject2.
good article

Deep Copy
A deep copy copies all fields, and makes copies of dynamically allocated memory pointed to by the fields. A deep copy occurs when an object is copied along with the objects to which it refers.
Shallow Copy
Shallow copy is a bit-wise copy of an object. A new object is created that has an exact copy of the values in the original object. If any of the fields of the object are references to other objects, just the reference addresses are copied i.e., only the memory address is copied.

In object oriented programming, a type includes a collection of member fields. These fields may be stored either by value or by reference (i.e., a pointer to a value).
In a shallow copy, a new instance of the type is created and the values are copied into the new instance. The reference pointers are also copied just like the values. Therefore, the references are pointing to the original objects. Any changes to the members that are stored by reference appear in both the original and the copy, since no copy was made of the referenced object.
In a deep copy, the fields that are stored by value are copied as before, but the pointers to objects stored by reference are not copied. Instead, a deep copy is made of the referenced object, and a pointer to the new object is stored. Any changes that are made to those referenced objects will not affect other copies of the object.

I would like to give example rather than the formal definition.
var originalObject = {
a : 1,
b : 2,
c : 3,
};
This code shows a shallow copy:
var copyObject1 = originalObject;
console.log(copyObject1.a); // it will print 1
console.log(originalObject.a); // it will also print 1
copyObject1.a = 4;
console.log(copyObject1.a); //now it will print 4
console.log(originalObject.a); // now it will also print 4
var copyObject2 = Object.assign({}, originalObject);
console.log(copyObject2.a); // it will print 1
console.log(originalObject.a); // it will also print 1
copyObject2.a = 4;
console.log(copyObject2.a); // now it will print 4
console.log(originalObject.a); // now it will print 1
This code shows a deep copy:
var copyObject2 = Object.assign({}, originalObject);
console.log(copyObject2.a); // it will print 1
console.log(originalObject.a); // it will also print 1
copyObject2.a = 4;
console.log(copyObject2.a); // now it will print 4
console.log(originalObject.a); // !! now it will print 1 !!

'ShallowCopy' points to the same location in memory as 'Source' does. 'DeepCopy' points to a different location in memory, but the contents are the same.

Shallow Cloning:
Definition: "A shallow copy of an object copies the ‘main’ object, but doesn’t copy the inner objects."
When a custom object (eg. Employee) has just primitive, String type variables then you use Shallow Cloning.
Employee e = new Employee(2, "john cena");
Employee e2=e.clone();
You return super.clone(); in the overridden clone() method and your job is over.
Deep Cloning:
Definition: "Unlike the shallow copy, a deep copy is a fully independent copy of an object."
Means when an Employee object holds another custom object:
Employee e = new Employee(2, "john cena", new Address(12, "West Newbury", "Massachusetts");
Then you have to write the code to clone the 'Address' object as well in the overridden clone() method. Otherwise the Address object won't clone and it causes a bug when you change value of Address in cloned Employee object, which reflects the original one too.

var source = { firstName="Jane", lastname="Jones" };
var shallow = ShallowCopyOf(source);
var deep = DeepCopyOf(source);
source.lastName = "Smith";
WriteLine(source.lastName); // prints Smith
WriteLine(shallow.lastName); // prints Smith
WriteLine(deep.lastName); // prints Jones

Shallow Copy- Reference variable inside original and shallow-copied objects have reference to common object.
Deep Copy- Reference variable inside original and deep-copied objects have reference to different object.
clone always does shallow copy.
public class Language implements Cloneable{
String name;
public Language(String name){
this.name=name;
}
public String getName() {
return name;
}
#Override
protected Object clone() throws CloneNotSupportedException {
return super.clone();
}
}
main class is following-
public static void main(String args[]) throws ClassNotFoundException, CloneNotSupportedException{
ArrayList<Language> list=new ArrayList<Language>();
list.add(new Language("C"));
list.add(new Language("JAVA"));
ArrayList<Language> shallow=(ArrayList<Language>) list.clone();
//We used here clone since this always shallow copied.
System.out.println(list==shallow);
for(int i=0;i<list.size();i++)
System.out.println(list.get(i)==shallow.get(i));//true
ArrayList<Language> deep=new ArrayList<Language>();
for(Language language:list){
deep.add((Language) language.clone());
}
System.out.println(list==deep);
for(int i=0;i<list.size();i++)
System.out.println(list.get(i)==deep.get(i));//false
}
OutPut of above will be-
false true true
false false false
Any change made in origional object will reflect in shallow object not in deep object.
list.get(0).name="ViSuaLBaSiC";
System.out.println(shallow.get(0).getName()+" "+deep.get(0).getName());
OutPut- ViSuaLBaSiC C

Imagine there are two arrays called arr1 and arr2.
arr1 = arr2; //shallow copy
arr1 = arr2.clone(); //deep copy

In Simple Terms, a Shallow Copy is similar to Call By Reference and a Deep Copy is similar to Call By Value
In Call By Reference, Both formal and actual parameters of a function refers to same memory location and the value.
In Call By Value, Both formal and actual parameters of a functions refers to different memory location but having the same value.

A shallow copy constructs a new compound object and insert its references into it to the original object.
Unlike shallow copy, deepcopy constructs new compound object and also inserts copies of the original objects of original compound object.
Lets take an example.
import copy
x =[1,[2]]
y=copy.copy(x)
z= copy.deepcopy(x)
print(y is z)
Above code prints FALSE.
Let see how.
Original compound object x=[1,[2]] (called as compound because it has object inside object (Inception))
as you can see in the image, there is a list inside list.
Then we create a shallow copy of it using y = copy.copy(x). What python does here is, it will create a new compound object but objects inside them are pointing to the orignal objects.
In the image it has created a new copy for outer list. but the inner list remains same as the original one.
Now we create deepcopy of it using z = copy.deepcopy(x). what python does here is, it will create new object for outer list as well as inner list. as shown in the image below (red highlighted).
At the end code prints False, as y and z are not same objects.
HTH.

struct sample
{
char * ptr;
}
void shallowcpy(sample & dest, sample & src)
{
dest.ptr=src.ptr;
}
void deepcpy(sample & dest, sample & src)
{
dest.ptr=malloc(strlen(src.ptr)+1);
memcpy(dest.ptr,src.ptr);
}

To add more to other answers,
a Shallow Copy of an object performs copy by value for value types
based properties, and copy by reference for reference types based properties.
a Deep Copy of an object performs copy by value for value types based
properties, as well as copy by value for reference types based
properties deep in the hierarchy (of reference types)

Shallow copy will not create new reference but deep copy will create the new reference.
Here is the program to explain the deep and shallow copy.
public class DeepAndShollowCopy {
int id;
String name;
List<String> testlist = new ArrayList<>();
/*
// To performing Shallow Copy
// Note: Here we are not creating any references.
public DeepAndShollowCopy(int id, String name, List<String>testlist)
{
System.out.println("Shallow Copy for Object initialization");
this.id = id;
this.name = name;
this.testlist = testlist;
}
*/
// To performing Deep Copy
// Note: Here we are creating one references( Al arraylist object ).
public DeepAndShollowCopy(int id, String name, List<String> testlist) {
System.out.println("Deep Copy for Object initialization");
this.id = id;
this.name = name;
String item;
List<String> Al = new ArrayList<>();
Iterator<String> itr = testlist.iterator();
while (itr.hasNext()) {
item = itr.next();
Al.add(item);
}
this.testlist = Al;
}
public static void main(String[] args) {
List<String> list = new ArrayList<>();
list.add("Java");
list.add("Oracle");
list.add("C++");
DeepAndShollowCopy copy=new DeepAndShollowCopy(10,"Testing", list);
System.out.println(copy.toString());
}
#Override
public String toString() {
return "DeepAndShollowCopy [id=" + id + ", name=" + name + ", testlist=" + testlist + "]";
}
}

Taken from [blog]: http://sickprogrammersarea.blogspot.in/2014/03/technical-interview-questions-on-c_6.html
Deep copy involves using the contents of one object to create another instance of the same class. In a deep copy, the two objects may contain ht same information but the target object will have its own buffers and resources. the destruction of either object will not affect the remaining object. The overloaded assignment operator would create a deep copy of objects.
Shallow copy involves copying the contents of one object into another instance of the same class thus creating a mirror image. Owing to straight copying of references and pointers, the two objects will share the same externally contained contents of the other object to be unpredictable.
Explanation:
Using a copy constructor we simply copy the data values member by member. This method of copying is called shallow copy. If the object is a simple class, comprised of built in types and no pointers this would be acceptable. This function would use the values and the objects and its behavior would not be altered with a shallow copy, only the addresses of pointers that are members are copied and not the value the address is pointing to. The data values of the object would then be inadvertently altered by the function. When the function goes out of scope, the copy of the object with all its data is popped off the stack.
If the object has any pointers a deep copy needs to be executed. With the deep copy of an object, memory is allocated for the object in free store and the elements pointed to are copied. A deep copy is used for objects that are returned from a function.

I came to understand from the following lines.
Shallow copy copies an object value type(int, float, bool) fields in to target object and object's reference types(string, class etc) are copied as references in target object. In this target reference types will be pointing to the memory location of source object.
Deep copy copies an object's value and reference types into a complete new copy of the target objects. This means both the value types and reference types will be allocated a new memory locations.

Shallow copying is creating a new object and then copying the non-static fields of the current object to the new object. If a field is a value type --> a bit-by-bit copy of the field is performed; for a reference type --> the reference is copied but the referred object is not; therefore the original object and its clone refer to the same object.
Deep copy is creating a new object and then copying the nonstatic fields of the current object to the new object. If a field is a value type --> a bit-by-bit copy of the field is performed. If a field is a reference type --> a new copy of the referred object is performed. The classes to be cloned must be flagged as [Serializable].

Copying ararys :
Array is a class, which means it is reference type so array1 = array2 results
in two variables that reference the same array.
But look at this example:
static void Main()
{
int[] arr1 = new int[] { 1, 2, 3, 4, 5 };
int[] arr2 = new int[] { 6, 7, 8, 9, 0 };
Console.WriteLine(arr1[2] + " " + arr2[2]);
arr2 = arr1;
Console.WriteLine(arr1[2] + " " + arr2[2]);
arr2 = (int[])arr1.Clone();
arr1[2] = 12;
Console.WriteLine(arr1[2] + " " + arr2[2]);
}
shallow clone means that only the memory represented by the cloned array is copied.
If the array contains value type objects, the values are copied;
if the array contains reference type, only the references are copied - so as a result there are two arrays whose members reference the same objects.
To create a deep copy—where reference type are duplicated, you must loop through the array and clone each element manually.

The copy constructor is used to initialize the new object with the previously created object of the same class. By default compiler wrote a shallow copy. Shallow copy works fine when dynamic memory allocation is not involved because when dynamic memory allocation is involved then both objects will points towards the same memory location in a heap, Therefore to remove this problem we wrote deep copy so both objects have their own copy of attributes in a memory.
In order to read the details with complete examples and explanations you could see the article C++ constructors.

To add just a little more for confusion between shallow copy and simply assign a new variable name to list.
"Say we have:
x = [
[1,2,3],
[4,5,6],
]
This statement creates 3 lists: 2 inner lists and one outer list. A reference to the outer list is then made available under the name x. If we do
y = x
no data gets copied. We still have the same 3 lists in memory somewhere. All this did is make the outer list available under the name y, in addition to its previous name x. If we do
y = list(x)
or
y = x[:]
This creates a new list with the same contents as x. List x contained a reference to the 2 inner lists, so the new list will also contain a reference to those same 2 inner lists. Only one list is copied—the outer list.
Now there are 4 lists in memory, the two inner lists, the outer list, and the copy of the outer list. The original outer list is available under the name x, and the new outer list is made available under the name y.
The inner lists have not been copied! You can access and edit the inner lists from either x or y at this point!
If you have a two dimensional (or higher) list, or any kind of nested data structure, and you want to make a full copy of everything, then you want to use the deepcopy() function in the copy module. Your solution also works for 2-D lists, as iterates over the items in the outer list and makes a copy of each of them, then builds a new outer list for all the inner copies."
source: https://www.reddit.com/r/learnpython/comments/1afldr/why_is_copying_a_list_so_damn_difficult_in_python/

Push reference of string element in an array in to new array of string

Given the following code:
var old_Array =["One","Two","..."];
var len = old_Array .length;
var new_Array =[];
for(var i=0;i<len;++i)
{
new_Array.push(old_Array [i]); // ----- [1]
}
After line [1] new_Array is filled with strings.
Is Each element actually a reference to string elements in
old_Array, or just copy of each string elements?
Does javascript interpreter/compiler optimize line -[1] by
pushing references of each string elements in old_Array ?

The answer to the first question: Each element is just a copy of each string element of the old array.
If the array contains object references, the references are copied in the new array. (In this case, the primitive types like strings and numbers are copied by value.)
Answer to the second question: No, the javascript interpreter doesn't optimize line [1] by pushing references of each string elements in old_Array.
A faster and a better approach to copy an array is :
var new_Array = old_Array.slice();
It clones the old array and returns the reference to the new array.

Interesting question.The thing is strings are immutable which means once they are written in the memory they can not be changed. So when you do like
var s2 = s.substr(0, 3);
s2 is now a new string but it is not copied to a new memory location, instead represented just as a range in s. So as per your question, copying a string from an array of strings shouldn't allocate extra memory for the new string. But then when the array with the original string, is no more needed, the GC should be clever enough to decide what items to remove from and keep in the memory allocated by that array.
I guess the implementations change depending on the JS engine. Here some info on MDN on this topic.

Shallow copying - not understood

Recently i heard about something called shallow copying in javascript.
I learned that array.slice(0) will return a shallow copy of the original array (meaning changes made to the original array will be reflected in the duplicate array)..but it is not happening.
original = [1,2];
duplicate = original.slice(); //thinking it as a shallow copy
original.push(3);
now original array has [1,2,3] but duplicate array has [1,2].
As far as i have understood, i thought shallow copy will reflect the changes in both the arrays, hence both array should be same.
But if i do like this, it is happening:
original = [1,2];
duplicate = original; //thinking it as a deep copy
original.push(3);
Are there any great explainers out there???

The .slice() call creates a new array. It's a distinct array from the original, and there's no lasting relationship between the two. Thus after calling .slice() in your first sample of code, the "duplicate" array is on its own. Changes to the original are reflected only in the original array.

A shallow copy would only apply the elements in the array. After calling .slice() you get a new array. Changes to the elements would be reflected, changes to the array will not.

Change array variable inside Javascript object literals

An example of below is available here: http://jsfiddle.net/valgaze/se9bmx7t/
Big question: Why does clearing an array "break" the relationship between an array and that array's reference in an object literal in Javascript?
Imagine we have an array stored in a variable and we have object literal with a reference to that array as one of the properties of the object. When we use any of the typical array methods (push, pop, shift, etc) on the array, the object literal gets updated with the result. And similarly if we update the array by accessing it from the object literal then the array variable is updated.
Ex. Updating the object updates the array (and vice versa)
var myArray = ["item1", "item2", "item3"];
var myObject = {key1:"value1", key2:myArray}
//Array is updated, so object is updated
myArray.push("item4"); //Update the array
console.log(myObject.key2); //Object's array updated with new pushed value
//Object is updated, so array is updated
myObject.key2.push("item5"); //myArray is updated with the item5
console.log(myArray); //Array updated with item5
Question: Why does "clearing" the array break the binding/coupling on the array reference in the object?
//[...] continued from first block above
myArray = ["muahahah, everything is wiped out"];
console.log("myArray", myArray); //Returns ["muahahah, everything is wiped out"]
console.log("myObject.key2", myObject.key2); //Returns the original items 1-5
//If we clear out the array via the object, the array does get updated
myObject.key2 = ["cleared the array from object"];
console.log("myArray", myArray); //returns ["cleared array"]
console.log("myObject.key2", myObject.key2); //returns ["cleared array"]
There must be something going on with manipulating an array like this: myArray = ["wiped values"];

You're not "clearing" the array, you're assigning a new value to your variable. The original array still exists (as a reference inside the other object), but now myArray points to a different array reference.

Shifting the new variable also shifts the old original one

How come with this
var prodataTemp = [];
prodataTemp = prodata;
prodataTemp.shift();
both variable prodatTemp and prodata are shifted? I can see it in the console.

Assigning a JavaScript object to another variable, will not copy the contents, but it make the left hand side variable, a reference to the right hand side expression. So,
var prodataTemp = [];
made prodataTemp refer an empty array and then
prodataTemp = prodata;
makes prodataTemp refer the same array object prodata was pointing to. (So, the old empty array is no more referenced by prodataTemp).
To actually make a copy**, use Array.prototype.slice, like this
prodataTemp = prodata.slice();
Now, prodataTemp refers to the copy of the array prodata, so that shifting one will not affect the other.
** - The copy made is just a shallow copy. So, if you have an array of arrays, then a new array will be created with all the references to the elements of the old array. So, mutating one array element will have its impact in the other as well.