1. Concise representation of properties
ES6 allows variables and functions to be written directly as object properties and methods, making code simpler to write.
Const f = 'a' const b = {f} b // {f: 'a'} = {f: f}Copy the code
In ES6, it is possible to write variables directly inside objects, where the property name is the variable name and the property value is the variable value
function u(x, y){ return {x, y} } // ==== function u(x, y){ return {x: x, y: y } } u(1, 2) // {x:1, y: Function o() {const x = 1; const x = 2; return {x, y} } o() // {x:1, y:2}Copy the code
2. Attribute name expression
There are two ways to use an expression for a property name in JavaScript. One is to use an identifier directly as the property name, and the other is to use an expression as the property name. The second way is to put the expression inside square brackets
/ / a obj. Foo = true / / 2 obj [' a '+' BC '] three let t = = 123 / / 'm' let obj = {[t] : true, [' a '+' BC '] : 123}Copy the code
Expressions can also be used to define method names (note: attribute name expressions cannot be used with concise representations)
let obj = {
['h' + 'ello']() {
return 'hi'
}
}
obj.hello() // hi
Copy the code
If the attribute name expression is an object, the object is automatically converted to a string by default. [Object object]
const ka = {a: 1}
const kb = {b: 2}
const myObj = {
[ka]: 'va',
[kb]: 'vc'
}
myObj // Object {[object Object]: 'vc'}
Copy the code
3. The name attribute of the method
The name property of the function, which returns the name of the function, and the object method is also a function and therefore also has the name property
const p = {
n() {
console.log('h')
}
}
p.n.name // n
Copy the code
The special case getter and setter properties are above get and set
const obj = {
get foo() {},
set fod() {}
}
obj.foo.name // undefined
const d = Object.getOwnPropertyDescriptor(obj, 'foo')
d.get.name // get foo
d.set.name // set fod
Copy the code
The function name attribute created in the special case bind returns bound plus the name of the original function
var do = function(){
}
do.bind().name // bound do
Copy the code
The special case is that the Function constructor creates a Function whose name returns anonymous
(new Function()).name // anonymous
Copy the code
If the object’s method is a Symbol, name returns the Symbol’s description
Const k = Symbol(' Symbol ') k.ameCopy the code
4. Enumerability and traversal of properties
The enumeration of
Each attribute has a description of the Object, used to control the attribute the behavior of the Object. The getOwnPropertyDescriptor method can obtain the attribute description Object
let obj = {f: 234}
Object.getOwnPropertyDescriptor(obj, 'foo')
// {
// value: 234,
// writable: true,
// enumerable: true,
// configurable: true
// }
Copy the code
An enumerable property that describes an object, called enumerable, which if true means that some operations ignore the current one
Four operations ignore enumerate to false - for... Keys (): Returns the keys of all the enumerable properties of the Object itself. -json.stringify (): serializes only the enumerable properties of the Object itself. -object.assign (): Ignore enumerable as false and copy only the enumerable properties of the object itselfCopy the code
All classes in ES6 have methods that are not enumerable
Property traversal
ES6 has five methods for traversing an object’s properties.
(1) for... in for... The in loop iterates over the object's own and inherited enumerable properties (excluding the Symbol property). Keys returns an array containing all the key names of the Object's own (not inherited) enumerable properties (not including Symbol properties). . (3) the Object getOwnPropertyNames (obj) Object. GetOwnPropertyNames returns an array that contains all attributes of the Object itself (excluding Symbol attribute, but cannot be enumerated attribute) of keys. . (4) the Object getOwnPropertySymbols (obj) Object. GetOwnPropertySymbols returns an array that contains the Object itself all the attributes of the Symbol key name. OwnKeys (obj) Reflect.ownkeys returns an array containing all the keys of the object itself, regardless of whether the keys are symbols or strings or enumerable. 1) for.. In traverses the key names of objects, all following the same attribute sequence. In traverses all numeric keys first, in ascending order. Next, all the string keys are iterated in ascending order by the time they were added. Finally, all Symbol keys are iterated in ascending order of time they were added.Copy the code
5. Super keyword
The this keyword always refers to the current object of the function. ES6 adds another similar keyword, super, to refer to the prototype object of the current object
Note: when the super keyword represents a prototype object, it can only be used in the object’s methods.
Const obj = {foo: super.foo} const obj = {foo: super.foo} const obj = {foo: () => super.foo} function () { return super.foo } }Copy the code
All three of the above uses of super give an error because, to the JavaScript engine, it doesn’t use super in object methods. The first way is that super is used in properties, and the second and third ways are that super is used in a function and then assigned to foo. Currently, only the shorthand for object methods allows the JavaScript engine to validate that it defines object methods.
Welcome to pay attention to the public account [Xiaoyao students]
ES6 Introduction series
ES6 Introduction to let and cont
ES6 introduction to variable deconstruction assignment
ES6 starter string extension
ES6 – An extension to get started with re
ES6 introduction to numerical extension
Extension of ES6 introductory functions
ES6 introduction to the array extension
Git tutorial
Front-end Git basics tutorial