add notes about object

Author: gambitier

session 2/chapters/3. Object to primitive.md

@@ -0,0 +1,99 @@
+# object-toprimitive
+
+[ref object to primitive](https://javascript.info/object-toprimitive)
+
+JavaScript doesn’t exactly allow to customize how operators work on objects. Unlike some other programming languages, such as Ruby or C++, we can’t implement a special object method to handle an addition (or other operators).
+
+In case of such operations, objects are auto-converted to primitives, and then the operation is carried out over these primitives and results in a primitive value.
+
+That’s an important limitation, as the result of obj1 + obj2 can’t be another object!
+
+## Conversion rules
+
+1. All objects are `true` in a boolean context. There are only numeric and string conversions.
+2. The numeric conversion happens when we apply mathematical functions on objects
+
+We can fine-tune string and numeric conversion, using special object methods. There are three variants of type conversion, that happen in various situations. They’re called “hints”.
+
+1. "string"
+2. "number"
+3. "default"
+
+There are three methods to convert object to primitive
+
+**The only mandatory thing: these methods must return a primitive, not an object.**
+
+1. `Symbol.toPrimitive`
+2. `toString`
+3. `valueOf`
+
+If the method `Symbol.toPrimitive` exists, it’s used for all hints, and no more methods are needed.
+
+```javascript
+let user = {
+	name: 'John',
+	money: 1000,
+
+	[Symbol.toPrimitive](hint) {
+		alert(`hint: ${hint}`);
+		return hint == 'string' ? `{name: "${this.name}"}` : this.money;
+	},
+};
+
+// conversions demo:
+alert(user); // hint: string -> {name: "John"}
+alert(+user); // hint: number -> 1000
+alert(user + 500); // hint: default -> 1500
+```
+
+If there’s no `Symbol.toPrimitive` then JavaScript tries to find methods `toString` and `valueOf`:
+
+1. For the “string” hint: `toString`, and if it doesn’t exist, then `valueOf` (so `toString` has the priority **for string conversions**).
+2. For other hints: `valueOf`, and if it doesn’t exist, then `toString` (so `valueOf` has the priority **for maths**).
+
+The valueOf method returns the object itself.
+
+```javascript
+let user = { name: 'John' };
+
+alert(user); // [object Object]
+alert(user.valueOf() === user); // true
+```
+
+If there’s no `Symbol.toPrimitive` then JavaScript tries to find methods `toString` and `valueOf`:
+
+```javascript
+let user = {
+	name: 'John',
+	money: 1000,
+
+	// for hint="string"
+	toString() {
+		return `{name: "${this.name}"}`;
+	},
+
+	// for hint="number" or "default"
+	valueOf() {
+		return this.money;
+	},
+};
+
+alert(user); // toString -> {name: "John"}
+alert(+user); // valueOf -> 1000
+alert(user + 500); // valueOf -> 1500
+```
+
+![conversion alog](../images/conversion%20algo.jpg)
+
+```javascript
+let user = {
+	name: 'John',
+
+	toString() {
+		return this.name;
+	},
+};
+
+alert(user); // toString -> John
+alert(user + 500); // toString -> John500
+```

session 2/chapters/4. Object references and copying.md

@@ -0,0 +1,153 @@
+# Object references and copying
+
+[ref](https://javascript.info/object-copy)
+
+One of the fundamental differences of objects versus primitives is that objects are stored and copied “by reference”, whereas primitive values: strings, numbers, booleans, etc – are always copied “as a whole value”.
+
+![primitive copy](../images/object%20copy.jpg)
+
+**But, copying an object variable creates one more reference to the same object.**
+
+![object copy](../images/object%20copy.jpg)
+
+# Comparison by reference
+
+Two objects are equal only if they are the same object.
+
+For instance, here a and b reference the same object, thus they are equal:
+
+```javascript
+let a = {};
+let b = a; // copy the reference
+
+alert(a == b); // true, both variables reference the same object
+alert(a === b); // true
+```
+
+And here two independent objects are not equal, even though they look alike (both are empty):
+
+```javascript
+let a = {};
+let b = {}; // two independent objects
+
+alert(a == b); // false
+```
+
+For comparisons like obj1 > obj2 or for a comparison against a primitive obj == 5, objects are converted to primitives.
+
+# Cloning and merging, Object.assign
+
+If we need to duplicate an object? Create an independent copy, a clone?
+
+we can use following methods for that.
+
+1. spread syntax
+2. Object.assign
+
+## 1. spread syntax
+
+```javascript
+let obj = { a: 1, b: 2, c: 3 };
+
+// spread the object into a list of parameters
+// then return the result in a new object
+
+let objCopy = { ...obj };
+```
+
+## 2. Object.assign
+
+The syntax is:
+
+```javascript
+Object.assign(dest, [src1, src2, src3...])
+```
+
+here's how we can use it to merge several objects into one
+
+```javascript
+let user = { name: 'John' };
+
+let permissions1 = { canView: true };
+let permissions2 = { canEdit: true };
+
+// copies all properties from permissions1 and permissions2 into user
+Object.assign(user, permissions1, permissions2);
+
+// now user = { name: "John", canView: true, canEdit: true }
+```
+
+If the copied property name already exists, it gets overwritten:
+
+```javascript
+let user = { name: 'John' };
+
+Object.assign(user, { name: 'Pete' });
+
+alert(user.name); // now user = { name: "Pete" }
+```
+
+following copies all properties of user into the empty object and returns it.
+
+```javascript
+let user = {
+	name: 'John',
+	age: 30,
+};
+
+let clone = Object.assign({}, user);
+```
+
+# Nested cloning
+
+Until now we assumed that all properties of user are primitive. But properties can be references to other objects. How they will be copied?
+
+**Answer: They will be copied by reference.**
+
+```javascript
+let user = {
+	name: 'John',
+	sizes: {
+		height: 182,
+		width: 50,
+	},
+};
+
+let clone = Object.assign({}, user);
+
+alert(user === clone); // FALSE, DIFFERENT OBJECT *****NOTE****
+
+alert(user.sizes === clone.sizes); // true, same object
+
+// user and clone share sizes
+user.sizes.width++; // change a property from one place
+alert(clone.sizes.width); // 51, see the result from the other one
+```
+
+**How to resolve?**
+
+To fix that, we should use a cloning loop that examines each value of `user[key]` and, if it’s an `object`, then replicate its structure as well. That is called a “deep cloning”.
+
+We can use recursion to implement it. Or, to not reinvent the wheel, take an existing implementation, for instance `_.cloneDeep(obj)` from the JavaScript library `lodash`.
+
+# Side effect of storing objects as references
+
+An important side effect of storing objects as references is that an object declared as `const` can be modified.
+
+```javascript
+const user = {
+	name: 'John',
+};
+
+user.name = 'Pete'; // (*)
+
+alert(user.name); // Pete
+```
+
+The value of `user` is constant, it must always reference the same object, but properties of that object are free to change.
+
+In other words, the const user gives an error only if we try to set `user=...` as a whole.
+
+// TODO [take notes from here - property-descriptors](https://javascript.info/property-descriptors)
+
+That said, if we really need to make constant object properties, it’s also possible, but using totally different methods. We’ll mention that in the chapter Property flags and descriptors.