Preliminary learning ecmaScript6

<!DOCTYPE HTML>
<html>
	<head>
		<title>Test es6</title>
	</head>
	<body>
		<h2>Welcome to es6</h2>
	</body>
	<script type="text/javascript">
		//1. Variable let const
		var a = 1;
		{
			let a = 3;
			console.info('let a',a); //3
		}
		console.info('var a',a); //1

		let b = 3;
		//let b = 4; //Identifier 'b' has already been declared (in the block-level scope defined by let, the same variable name cannot be defined repeatedly)

		const A = 3;//Variables are generally capitalized, indicating constants
		//A = 4; //Assignment to constant variable.(Const defined constants are not allowed to be modified)
		//const A = 4;//Identifier 'A' has already been declared (same as let, duplicate definitions are not allowed in the scope)

		//2.for of forEach loop
		{
			let b = 'welcome use EcmaScript6';
			b = b.split(' ');
			for(var i of b){
				console.log(i);//welcome use EcmaScript6
			}

			b.forEach(function(r){
				console.log('forEach',r);
			});

			b.forEach(r => console.log('forEach => ',r));
		}
		
		//3. About arrow functions
		//The short form of the function (parameters) => the function body
		var arrowFunction1 = function(){ //es5 writing
			return 'I`m a arrow function';
		}

		var arrowFunction2 = () => 'I`m a arrow function';//es6写法

		console.info('arrowFunction：',arrowFunction1());
		console.info('arrowFunction：',arrowFunction2());

		let arr =  ['a','b','c'];
		arr.map((vari) => console.info('arrow return ',vari));

		let getFinalPrice = (price, tax=0.7) => console.info(price + price * tax);
		getFinalPrice(500); // 850

		//destruct
		var [arrA,arrB,arrC] = arr; //Assign the values of the array to the variables in [] in order
		console.log(arrA,arrB,arrC); //a,b,c
		var [arrC, arrA] = arr;
		console.log (arrA, arrC); // b, a

		var a = 1,bb = 4;
		[a,bb] = [bb,a];
		console.log([a,bb])//4,1 can be used to exchange arrays without defining intermediate temporary parameters

		//...operator
		//Spread operation extension
		console.info (... [1,2,3,4]) // 1 2 3 4

		function foo(x,y,z){
			console.log(x,y,z);
		}
		foo(...[1,2,3,4]);// 1 2 3
		foo(...[{1:4},{2:3}]);//{1:4} {2:3}
		//Rest operation remaining
		function boo(...args){
			console.info(args);
		}
		boo(1,2,3,4,5,6)//[1, 2, 3, 4, 5, 6]

		//` to assemble a bunch of variables and string ${} to replace variables
		var str1 = 'XiaoMing';
		console.info(`my name is ${str1}`);

		//Class constructor inheritance (based on prototype chain)
		class Car {
			constructor() {
				console.info('this is car');
			}
			move(){
				console.info('moving');
			}
		}
		var car1 = new Car();
		car1.move();
		class AutoCar extends Car{
			constructor() {
				super();
				console.info('this is auto Car');
			}
		}
		var autoCar = new AutoCar ();
		autoCar.move();
	</script>
</html>
Preliminary learning ecmaScript6

Guess you like
