twitter@js_bankfacebook@jsbankrss@jsbank






10 thủ thuật JavaScript đơn giản dành cho người mới học Vâng, đúng như tiêu đề của bài viết đã nói, 10 thủ thuật lập trình này vô cùng nhỏ gọn và đơn giản để sử dụng nhưng hiếm khi chúng ta nhớ. Vì vậy tác giả liệt kê giúp bạn các thủ thuật để tối ưu và đơn giản hóa các công việc cần phải thực hiện khi lập trình với ngôn ngữ JavaScript.


Nhãn: 10, thủ thuật JavaScript, người mới học, thủ thuật lập trình, nhỏ gọn, đơn giản, tối ưu

Tạo video bằng AI chỉ với giọng nói hoặc văn bản



Ứng dụng video AI MIỄN PHÍ hàng đầu của bạn! Tự động hóa video AI đầu tiên của bạn. Tạo Video Chuyên Nghiệp Của Bạn Trong 5 Phút Bằng AI Không Cần Thiết Bị Hoặc Kỹ Năng Chỉnh Sửa Video. Sản xuất video dễ dàng dành cho nhà tiếp thị nội dung.
Ứng dụng video AI KHÔNG GIỚI HẠN miễn phí trong tay bạn

Organize and Improve Functions with Objects as Parameters

A very common use of objects in modern web development is to use them as parameters of a function. It is always difficult to remember the order of the parameters of a function; however, using an object is very useful because then we do not have to be concerned about the order of the parameters. Moreover, it is more organized in order to understand what we are doing. This method allows for you to organize and improve the functions with objects as parameters. For example:

function insertData(name,lastName,phone,address){
  code here;
}

Could be remade like this:
function insertData(parameters){
  var name = parameters.name;
  var lastName = parameters.lastName;
  var phone = parameters.phone;
  var address = parameters.address;
}

It also is very useful at the time to have defaults values. Example:

function insertData(parameters){
  var name = parameters.name;
  var lastName = parameters.lastName;
  var phone = parameters.phone;
  var address = parameters.address;
  var status = parameters.status || 'single' //If status is not defined as a property in the object the variable status take single as value
}

To use the function now is pretty simple; we could send the data in two ways:

//Example 1
insertData({name:'Mike', lastName:'Rogers', phone:'555-555-5555',address:'the address', status:'married'});

//Example 2
var myData = {       name:'Mike', 
                         lastName:'Rogers', 
                               phone:'555-555-5555',
                             address:'the address', 
                                status:'married'
                       };

insertData(myData);

Functions are Data

Functions are data just like strings or numbers and we can pass them as functions parameters to create very amazing and commanding web applications. This method is very useful and is utilized by most all major frameworks. For example:

function byId(element, event, f){
  Document.getElementById(element).['on'+event] = f; //f is the function that we pass as parameter
}

byId('myBtn','click',function(){alert('Hello World')});

Another example of functions as data:

//Example 1
function msg(m){
  Alert(m);
}

//Example 2
var msg = function(m){ alert(m);}

Those functions are exactly the same. The only difference is how to use them for example: the first function you can use before it is declared; however, the second one should be declared in order to work:

//Example 1
msg('Hello world'); //This will work

function msg(m){
  alert(m);
}

//Example 2
msg('Hello world'); //Does not work because JavaScript cannot find the function msg because is used before is been declared.

var msg = function(m){ alert(m)}

Extend Native Objects

Even though some JavaScript gurus do not recommend this technique, it has been used by some frameworks. It allows you to create some helper methods, to the JavaScript API.

//We create the method prototype for our arrays
//It only sums numeric elements

Array.prototype.sum = function(){
    var len = this.length;
    total = 0;
    for(var i=0;i<len;i++){
        if(typeof this[i]!= 'number') continue;
         total += this[i];
    }
    return total;
}

var myArray = [1,2,3,'hola'];
myArray.sum();

Array.prototype.max = function(){
    return Math.max.apply('',this);
}

Boolean

Be aware of checking these comparisons, because it will save you time from debugging the script.

'' == '0'          // false
0 == ''            // true
0 == '0'           // true
false == 'false'   // false
false == '0'       // true
false == undefined // false
false == null      // false
null == undefined  // true
true == 1          // true
'' == null         // false
false == ''        // true

Google Safe Browsing McAfee SiteAdvisor Norton SafeWeb Dr.Web