Từ coder đến developer – Tôi đi code dạo

2016-07-25T16:48:21+07:00

Chào anh,
anh cho em hỏi ES6 này chỉ sử dụng được trên node.js thôi hả. Em thấy bài viết hay thì tìm hiểu thì thấy set up toàn dùng lệnh npm không. Không thấy dùng để include vào html

LikeLiked by 1 person

Reply

2016-07-25T17:56:41+07:00

Hiện tại ES6 dùng đc trên chrome rồi em 😉

LikeLike

Reply

2023-02-02T22:26:00+07:00

Bài viết hay có đưa cách cũ và mới dễ so sánh và dễ hiểu ạ. cảm ơn anh nhiều

LikeLike

Reply

	var numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

	// Giả sử ta muốn tìm các số chẵn
	// Cách viết cũ
	var odd = numbers.filter(function(n) { return n % 2 == 1 });
	console.log(odd);
	// Với arrow
	odd = numbers.filter(n => n % 2 == 1);
	console.log(odd);

	var person = {
	firstName: 'Hoang',
	friends : ['Minh', 'Sang', 'Khoa', 'Hoang'],
	showFriend: function() {
	this.friends.forEach(function(fr) {
	// Với cách viết cũ, this ở đây sẽ là object window, không phải person
	console.log(this.firstName + ' have a friend named ' + fr);
	});

	// Ta sử dụng arrow, this vẫn là object person
	this.friends.forEach(fr => console.log(this.firstName + ' have a friend named ' + fr));
	}
	};

	// Cách cũ, phải check tham số truyền vào rồi xác định giá trị
	function multiply(a, b) {
	var b = typeof b !== 'undefined' ? b : 1;
	return a*b;
	}
	// Với ES6, chỉ cần sử dụng dấu =
	function multiply(a, b = 1) {
	return a*b;
	}

	multiply(5); // 5

	// Với array
	var foo = ["one", "two", "three"];
	// Cách cũ
	var one = foo[0];
	var two = foo[1];
	var three = foo[2];
	// Dùng destructuring
	var [one, two, three] = foo;

	// Với object
	var obj = {firstName:'Hoang', lastName:'Pham'};
	// Cách cũ
	var firstName = obj.firstName;
	var lastName = obj.lastName;
	// Dùng destructuring
	var {firstName, lastName} = obj;
	// Nếu muốn lấy tên biến khác tên field của object
	var {firstName : fn, lastName : ln} = obj; //fn: Hoang, ln: Pham

	function f(x, …y) {
	// y ở đây là array, chứa ["hello", true, false]
	return x * y.length;
	}
	f(3, "hello", true, falser) == 9;
	// Cách gọi này tương tự với f(3, ["hello", true, false])

	function f(x, y, z) {
	return x + y + z;
	}
	f(…[1,2,3]) == 6;
	// Cách gọi này tương tự với f(1, 2, 3);

Từ coder đến developer – Tôi đi code dạo

Series JavaScript sida – Cùng làm quen và “chịch”, nhầm… nghịch ES6

1. Arrow (Lambda Expression)

2. Default parameter, destructuring, spread operator

3. Cải tiến syntax class và object

4. Iterator

5. Template String

6. Map và Set

7. Promise

3 thoughts on “Series JavaScript sida – Cùng làm quen và “chịch”, nhầm… nghịch ES6”

Leave a Reply Cancel reply

Lập trình viên giỏi không phải chỉ biết code

	class Animal {
	constructor(name) {
	this.name = name;
	}
	speak() {
	console.log(this.name + ' makes a noise.');
	}
	}

	class Dog extends Animal {
	speak() {
	console.log(this.name + ' barks.');
	}
	}

	var firstName = 'Hoang';
	var lastName = 'Pham';
	// Khai báo object kiểu cũ
	var obj = {
	firstName: firstName,
	lastName: lastName,
	showName: function() { console.log(this.firstName + ' ' + this.lastName) }
	};

	// Khai báo kiểu mới, ngắn gọn hơn
	// Không cần lặp lại tên biến hay function
	var obj = {
	firstName,
	lastName,
	showName() { console.log(this.firstName + ' ' + this.lastName) }
	};

	var numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
	// Cách cũ, duyệt từ đầu
	for(var i = 0; i< numbers.length; i ++)
	{
	console.log(number[i]);
	}
	// Dùng forEach
	numbers.forEach(function(number) {
	console.log(number);
	})

	// Dùng for…of, dễ viết dễ đọc
	for(var number of numbers) console.log(number);

	var name = "Bob", time = "today";
	// Cách cũ
	console.log("Hello " + name + " how are you " + time + " ?");
	// Dùng string interpolation, để ý dấu `
	console.log(`Hello ${name}, how are you ${time}?`);

	// Sets
	var s = new Set();
	s.add("hello").add("goodbye").add("hello");
	s.size === 2;
	s.has("hello") === true;

	// Maps
	var m = new Map();
	m.set("hello", 42);
	m.set(s, 34);
	m.get(s) == 34;

	// Code from: http://www.html5rocks.com/en/tutorials/es6/promises/

	var promise = new Promise(function(resolve, reject) {
	// do a thing, possibly async, then…
	if (true) {
	resolve("Stuff worked!");
	}
	else {
	reject(Error("It broke"));
	}
	});

	promise.then(function(result) {
	console.log(result); // "Stuff worked!"
	}, function(err) {
	console.log(err); // Error: "It broke"
	});

1. Arrow (Lambda Expression)

2. Default parameter, destructuring, spread operator

3. Cải tiến syntax class và object

4. Iterator

5. Template String

6. Map và Set

7. Promise

Rate this:

Like this:

Related

3 thoughts on “Series JavaScript sida – Cùng làm quen và “chịch”, nhầm… nghịch ES6”

Leave a Reply Cancel reply

Lập trình viên giỏi không phải chỉ biết code