JavaScript – Reference vs Primitive Values/ Types




One of the most common error sources: Not understanding what the difference between reference and primitive values is. This video will clear up the confusion.

Need more JavaScript Training?
Consider my “Accelerated JavaScript Training” course, available for $15: https://www.udemy.com/javascript-bootcamp-2016/?couponCode=YOUTUBE_PROMO
Want to take the next step? Dive into ES6 for only $14: https://www.udemy.com/es6-bootcamp-next-generation-javascript/?couponCode=YOUTUBE_PROMOS

Stack vs Heap: https://www.quora.com/What-is-the-difference-between-the-stack-and-the-heap
Object.assign(): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
Slice(): https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/slice
Lodash Clone Deep: https://lodash.com/docs/#cloneDeep

Want to become a frontend developer? Consider diving into some of my courses on Udemy:
Ionic 2 – The Practical Guide for only $15: https://www.udemy.com/ionic-2-the-practical-guide-to-building-ios-android-apps/?couponCode=GETINTOIT
Angular – The Complete Guide for only $15, too: https://www.udemy.com/the-complete-guide-to-angular-2/?couponCode=YOUTUBE_2
Vue.js 2 – The Complete Guide for only $15: https://www.udemy.com/vuejs-2-the-complete-guide/?couponCode=YOUTUBE_VUE

Want to get some 1-on-1 coaching with experienced developers? Have a look at Savvy: https://www.savvy.is/?ref=9fee2b (Discount Code 9fee2b)

You can follow me on Twitter (@maxedapps), Facebook (https://www.facebook.com/academindchannel/) or visit our Website (https://www.academind.com).

See you in the videos!

Original source


48 responses to “JavaScript – Reference vs Primitive Values/ Types”

  1. if you put name = 'Chris' above var secondName = name; , console.log(secondName) would output Chris. I don't see how there are two names in memory. Also, instead of the last line being console.log(secondName), if he'd have written console.log(name) the output would have been 'Chris' not 'Max'. It seems to me that the variable was reassigned in memory, not stored twice. Am I wrong here? Maybe I'm not understanding him correctly.

  2. we can use the following method for deepCopy var secondPerson = JSON.parse(JSON.stringify(person)) instead of using Lodash library

    var refpers = {
    'name': 'YUVA',
    'age': 25,
    'hobbies': ['playing', 'coding']
    }

    console.log(refpers);

    var deepCopy = JSON.parse(JSON.stringify(refpers));

    var shallowCopy = refpers;

    refpers.name = "yuvakishore";
    refpers.hobbies.push('roaming');

    console.log(deepCopy, shallowCopy, refpers);

  3. You can learn c++ pointers to have better understanding of how it's linked in memory. c++ it's very good language to understand how memory work's.

    I used a lot this concept in 3d modeling for copying object or to make an instance(linked copy) of object.

  4. It was quite long but very good video. You explain everything clearly and slowly with good examples of what you talking about. I didn't know some of these things 🙂

  5. Just a silly question, but how do you record yourself  to show up on the right hand side of the screen? I've seen this technique a lot and I want to know how to do it too 🙂

  6. For having written a javascript compiler/interpreter, I think that talking about the stack in javascript is using a low level metaphor that does not have it's place. All the function parameter are evaluated and the results are put in a structure called the closure that will be use to evaluate the function. If function parameters were alway on the stack then when returning a function object, you would lose all the parameter values of the enclosing function. At best, the stack is used as an optimization for this closure if there is no reference of the closure captured in a function instantiation. The location of the content of a closure is implementation specific.

  7. That was a long, rambling way of saying that some types (containers) are effectively mutable, and others (nulls, bools, numbers and strings) are effectively not. Talking about primitive and reference types (especially with new programmers) just makes a simple concept more difficult to understand.

  8. sooo…. just one question. I was looking at how JS works, and got to an explanation how JSE (V8, spidermonkey and so on) have stack and heap. the points made about stack, were that it is what makes JS single threaded. there's only one stack, and that's it. secondly, stack needs to be empty, or should I stay emptied as fast as possible, or for example, page can't be refreshed as long as there's something on the stack. likewise, response from web api can't get onto stack, until stack is cleared.

    it said that heap stores values. I thought that that was all there is to it, cause I don't have a CS degree, so I had no idea how heap works. but now I started this course our government came up with, to help us transition to it, and we're learning C# (wasn't my first choice for backend, but I keep telling my self whatever, logic is same, just syntax is different, so I don't mind). however, she's been explaining how data is stored in C#, and when I realized that reference to the location in heap, has to be stored inside of a stack, I was baffled. either I'm misunderstanding something about JSE, or there are actually two stacks, and no one cared to point that out.

    any clarification on what is going on here?

  9. Great explanation. But why do objects have to be the reference types and why are the primitive types named primitive?What's the logic? I know the questions are a bit weird but they are just eating up my head 😛

Leave a Reply