es6 + webpack study notes (+ bug)

WebPACK
1. Installation NodeJS
2. Installation npm install -g webpack

bugs:
NPM given installation package rollbackFailedOptiona
L

https://blog.csdn.net/qq_34351732/article/details/78705997
NPM config RM Proxy
NPM-config RM HTTPS Proxy
then npm install -g cnpm -registry = https use: //registry.npm.taobao.org installation Taobao the CNPM
Css-Loader:
JS form ofHere Insert Picture Description
command-line form Here Insert Picture Description
- watch real-time updates --progress progress --display-moudles display module displays --display-reason reasons
Webpack.config.js configuration:
Here Insert Picture Description
You can configure webpack command package.json
Here Insert Picture Description
then npm WebPACK RUN
Here Insert Picture Description
the entry inlet:
array
entry: [./ js / index1.js, / js / index2.js.]
Object
the entry: {
the Package1: './ JS / The index.js',}
the Output:
Here Insert Picture Description
Babel-Loader: installation
Npm Babel-dev---save the install Babel Loader Core-
NPM the install @ Babel / Core --save
NPM @ Babel the install / dev-PRESET---save the env
Use:
Here Insert Picture Description
Babel RESET - package.json
Here Insert Picture Description
Bug:

ES6
19/3/4
variables:
ES5: var (global scope)
ES6:
the let (equivalent var) to act only on block-level scope, not a pre-parsing.
const (constant defined) Object.freeze (object).
Config = {const
the Host:
Test
}

Destructuring assignment:
the let A =. 1, B = 2, C =. 3;
Let [A, B, C] = [l, 2,3];
console.log (A, B, C);

Left and right sides, the structure to be consistent,
Let [A, [B, C]] = [. 1, [2,3]];
Let = {JSON name: Test, Age: 13 is, Sex: MALE};
Let {A: a1, b: b1, c: c1} = json;
give default values:
Let {A, B, C = 'C'} = { 'A', 'B'};
exchange assignment :
the let A = 12 is;
Let 2 = B;
Let [A, B] = [B, A];

String template :
Let name = 'A';
Let Sex = 'b';
Let str = "This person is called n a m e , Sex do not Yes {Name}, gender {sex} ";

Srt.includes () Return value: to true / to false
Navigator.userAgent.includes ( 'Chrome') Analyzing browser

str.endwidth ()
Str.startwidth ()
Str.repeat (number);

Function default parameters
Function Show ({X = 0, Y = 0} = {}) {
}
the Show ();
function default parameters have been defined and can not be redefined
extended operator, reset operator
...
Let ARR = [A, B , c];
console.log (... arr); array expansion

Let a =Array.prototype.slice.call(arguments); 排序
a.sort();

Arrow function
() => things return
() => {
statement
the Return
}
the this problem, where the object definition function, is not where the runtime objects
arrow there is no function arguments

6. array lively circulation
Arr.foreach (
Function (Val, index, ARR) {}
)
Arr.map ((Val, index, ARR) => (
console.log (Val, index.arr);
));
very Useful, mapping, we need to meet return, return a new array
Arr.filter ();
Arr.some (); look for similar returns in line with an element to true
Arr.every ();

Array.of ( 'abc', 'bcd ', 'cde') to a set of values converted into an array
Array.from ()
Arr.find () Returns not found undefine
Arr.findindex () not found returns -1

Arr.fill ( 'filled stuff', start position, end position);

Object
Object.is ( 'NaN3', 'NaN3') determines whether the two objects are equal
Let JS = {A:}. 1;
Let JS2 = {B:. 1, A: 2};
Let JS3 = {C:. 1};

Object.assign ({}, JSON, json2, json3) 1. 2. copy an object to merge objects

For(let key of object.keys(js2)){
Console.log(key);
}
Let item of entries(json)

9.Promise
role: to solve the problem of asynchronous callback
Let Promise Promise new new = (function (Resolve, Reject) {
the If (A == 10) {
Resolve ( 'success');
} {the else
Reject ( 'failed');

}
});
Promise.then(res=>{
Console.log(res);
},error=>{
Console.log(err);
}).catch(){};

Promise.resolve ( "aaa"); the thing is converted into a state promise resolve objects
Promise.reject ( "BB");
. Promise.all ([P1, P2, P3]) the then (RES => {}) three a must for a successful state
Promise.race ([p1, p2, p3 ]) on the line as long as a success

Modular
the Export const = A. 1;
the Export const B = 2;
the Export const. 3 = C;

The Export {
A AS A, AS B BA,} Syntax two

Export default

{A Import, B, C} from './moudles/1.js';
. 1 written at any position, automatically elevating tip
2 to export content module, the timer if there are changes, modifications will be outside
3import only introduced once.
4. if statement is not written in the
Import * as modto from './moudles/1.js'
dynamic introduction, the object is similar to promise NodeJS:

Import ( 'JS files') .then (res => { })
Here Insert Picture Description
class and Inherited
Const Person = {class
the Constructor () {
}
AAA { method name can be a variable
}
}

Static method
Class Person {
the Static Show () {
}}
Person.show (); can be called directly

Inherited
Super (arug); properties inherited from the parent class
. Super method name (); inherited methods of the parent class

Generator & 12.symbol
Generator function
solve asynchronous, the async problem deeply nested ()
Syntax:
Function * Gen () {
Yield 'available for purchase';
Yield 'to';
the Return 'Test';
}
Let G1 = Gen ();
console.log ( g1.next () ); // {value: 'available for purchase', DONE: to false}
traverse
the For (Val of the let G1) {
console.log (Val);}
deconstruction:
Let [A, B] = Gen ();
... Gen ();
Here Insert Picture Description
file system write
Here Insert Picture Description
promise embodiment
Here Insert Picture Description
Generator mode
Here Insert Picture Description
async mode

1await promise can be followed by an object, or may be numbers, characters,
2Async promise is the function returns the object
3 as long as the state is a reject, the rear interrupt execution (try {} catch {} solution)
Here Insert Picture DescriptionHere Insert Picture Description
13.set data structure
Let setarr = new set ( ' 1 ',' 3 ',' 4 '); array-like, but can not repeat value
Set.add () Add
Set.delete remove
Set.has () has a value
Set.size ()
Set.clear ()

new weakset ({}) stores data json

Map
Map.set (Key, value) may be any type Key
Map.get (Key)
Map.delete ()
Map.has ()
Map.clear ()

Weakmap key can only be subject

16. A number of changes and new math something
binary:
the let A = 0b101010
octal
Let a = 0o666

Number.isfinite (a) is determined is not a number
Number.isnan ()
Number.isinteger () judgment is not an integer
safe Integer:
- (2 ^ 53) -1 ^ 53-1 to 2
Number.isSafeinteger ()

Math.trunc (4.55) retention integer
Math.sign () determines whether a positive number, n is 1, -1, 0, is negative 0
Math.cbrt () calculates the cube root of a number

Taking date
Here Insert Picture Description
named capture
/ (\ d?) - / ({2}?)

Guess you like

Origin blog.csdn.net/qq526928635/article/details/88885782