12/08/2018, 13:15

Vài thủ thuật nhỏ khi dùng javascript

Dưới đây là 1 vài cách vui vẻ thu gọn code, debugg mà mình học lỏm và đọc được, chia sẻ với các bạn: 1 Gọi phuơng thức Đôi khi chúng ta phải if thì thế này mà else thì thế kia: if ( success ) { obj . start ( ) ; } else { obj . stop ( ) ; } Có thể viết thành thế ...

Dưới đây là 1 vài cách vui vẻ thu gọn code, debugg mà mình học lỏm và đọc được, chia sẻ với các bạn:

1 Gọi phuơng thức

Đôi khi chúng ta phải if thì thế này mà else thì thế kia:

if (success) {
  obj.start();
} else {
  obj.stop();
}

Có thể viết thành thế này

var method = (success ? 'start' : 'stop');
obj[method]();

2 Nối chuỗi

Chắc chắn là chúng ta sẽ phải nối chuỗi rất nhiều, thay vì dùng + thì có thể dùng join()

['đã', 'nối'].join(' '); // đã nối;
['nối', 'lại', 'với', 'nhau'].join(', '); // nối lại với nhau;

3 Trả về giá trị default

Một ví dụ bình thường

function setAge(age) {
    if (age) {
       this.age = age;
    } else {
       this.age = 10;
    }
}

Có thể viết thành

function setAge(age) {
  this.age = age || 10
}

Bây giờ gọi setAge() luôn thì sẽ có kết quả default cho age là 10.

4 Sử dụng &&

Có ví dụ:

if (isYes) {
  alert('yes');
}

Có thể dùng như thế này:

isYes && alert('yes');

5 Xem thời gian chạy

Đọc cái hiểu luôn

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

console.time('testing_forward');
for (var i = 0; i < a.length; i++);
console.timeEnd('testing_forward');

console.time('testing_backwards');
for (var i = a.length - 1; i >= 0; i--);
console.timeEnd('testing_backwards');

6 Debugging

var x = 1;
debugger; // Code execution stops here, happy debugging
x++;

var x = Math.random(2);
if (x > 0.5) {
  debugger; // Conditional breakpoint
}
x--;

7 Template

var firstName = 'NoOne';
var screenName = 'no1'

// Bình thường thì viết như thế này
'Hi, my name is ' + firstName + ' and my xxx name is @' + screenName;

// Sửa lại như thế này có vẻ ngầu hơn
var template = 'Hi, my name is {first-name} and my twitter screen name is @{screen-name}';
var txt = template.replace('{first-name}', firstName)
                  .replace('{screen-name}', screenName);
0