Because most browsers are compatible with it, you can use it in these browsers. JavaScript is accepted quite fast because it is so simple and has a fairly wide range of uses. Many programmers used to think that JavaScript was a "toy language", but AJAX showed a completely opposite side after entering the market, which made JavaScript show completely different capabilities and functions.
Thanks to this invention, programmers can now create web applications with desktop application effects, which is very beneficial because data can be changed faster. Here are some mini tips that can help beginners better use JavaScript. JavaScript is quite wide and has so many styles, so it can have many tricks. In addition, although it has many programming methods, I only selected 10 tips, which I think are a good starting point for beginners to understand JavaScript.
1. Add an element at the end of an array
This trick allows you to use the Length attribute to add an element at the end of an array, because the Length attribute has 1 more subscript than the last element of the array. This method is the same as the "push" method. For example:
var myArray = [];
myArray[] = 'New Element';
2. Adjust the length of an array
The Length attribute is not read-only, so you can set the value of the Length attribute. Also, you can use it to increase or decrease the length of the array. For example:
var myArray = [1,2,3];
// 3
= 2; //Delete the last element
= 20 // add 18 elements to the array; the elements have the undefined value.
3. Use "!!" to convert any data type into Boolean
This technique allows you to convert any data type (such as string, number or integer) into Boolean using "!!". For example:
var myString = '23255';
typeof myString; //String
myString = !!myString;
typeof myString //Boolean
4. Convert Number to String
This trick allows you to add an empty string at the end of the number to convert the number into a string, for example:
var mynumber = 234;
typeof mynumber; //Number
mynumber += '';
typeof mynumber; //String
5. Understand how many variables a function requires
This is a great trick to let you know exactly how many variables a function requires. For example:
function add_nums(num1, num2){
return num1 + num2;
}
add_nums.length // 2 is the amount of parameters expected by the function add_nums
6. Use the "arguments" object to understand how many parameters a function receives
This technique allows you to use the "arguments" object to understand how many parameters a function receives. For example:
function add_nums(){
return ;
}
add_nums(23,11,32,56,89,89,89,44,6); //this return the number 9
This technique is useful when you need to check the validity of the number of parameters, or when you need to create a function that is uncertain of the number of parameters.
function sum_three_nums( ){
if(!=3) throw new Error('received ' + + ' parameters and should work with 3');
}
sum_three_nums(23,43); //Return the error message
function sum_num(){
var total = 0;
for(var i=0;i<arguments .length;i++){
total+=arguments[i];
}
return total;
}
sum_num(2,34,45,56,56);
7. Use objects as parameters to organize and improve functions
In modern web development, one of the most common uses of objects is to treat them as parameters of functions. It is always difficult to remember this rule for function parameters; however, using an object is very beneficial because we don't have to worry about the rule for parameter. Moreover, it is more organized and allows users to better understand what we are going to do. This method allows you to organize and improve functions using objects as parameters. For example:
function insertData(name,lastName,phone,address){
code here;
}
The refactoring code looks like this:
function insertData(parameters){
var name = ;
var lastName = ;
var phone = ;
var address = ;
}
It is also very useful when you want to use the default value. For example:
function insertData(parameters){
var name = ;
var lastName = ;
var phone = ;
var address = ;
var status = || 'single' //If status is not defined as a property
//in the object the variable status take single as value
}
Now, it is very simple to use this function; we can send 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);
8. Functions are data
Functions are data like strings or numbers. We can pass them as function parameters, which can create surprising and "magnificent" web applications. This method is very useful, and almost all mainstream frameworks use this method. For example:
function byId(element, event, f){
(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);}
These functions are almost identical. The only difference is how they are used. For example: the first function, you can use it before you declare it; but the second function can only be used after it is declared:
//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)}
9. Extend local objects
Although some JavaScript leaders do not recommend this technology, it has been used by some frameworks. It allows you to create helper methods for JavaScript API.
//We create the method prototype for our arrays
//It only sums numeric elements
= function(){
var len = ;
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'];
();
= function(){
return ('',this);
}
10,Boolean
Pay attention to the difference between them, as this will save you time debugging your scripts.
'' == '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
If you've read these scripts elsewhere, these tips can help you get it right. These tips are not even as the tip of the iceberg as all JavaScript features, but this is the beginning! Please don't be polite, leave your comments, questions, extra tips or concerns, but remember, this is an article for beginners! ! I hope to receive letters from some developers! Enjoy!
Thanks to this invention, programmers can now create web applications with desktop application effects, which is very beneficial because data can be changed faster. Here are some mini tips that can help beginners better use JavaScript. JavaScript is quite wide and has so many styles, so it can have many tricks. In addition, although it has many programming methods, I only selected 10 tips, which I think are a good starting point for beginners to understand JavaScript.
1. Add an element at the end of an array
This trick allows you to use the Length attribute to add an element at the end of an array, because the Length attribute has 1 more subscript than the last element of the array. This method is the same as the "push" method. For example:
Copy the codeThe code is as follows:
var myArray = [];
myArray[] = 'New Element';
2. Adjust the length of an array
The Length attribute is not read-only, so you can set the value of the Length attribute. Also, you can use it to increase or decrease the length of the array. For example:
Copy the codeThe code is as follows:
var myArray = [1,2,3];
// 3
= 2; //Delete the last element
= 20 // add 18 elements to the array; the elements have the undefined value.
3. Use "!!" to convert any data type into Boolean
This technique allows you to convert any data type (such as string, number or integer) into Boolean using "!!". For example:
Copy the codeThe code is as follows:
var myString = '23255';
typeof myString; //String
myString = !!myString;
typeof myString //Boolean
4. Convert Number to String
This trick allows you to add an empty string at the end of the number to convert the number into a string, for example:
Copy the codeThe code is as follows:
var mynumber = 234;
typeof mynumber; //Number
mynumber += '';
typeof mynumber; //String
5. Understand how many variables a function requires
This is a great trick to let you know exactly how many variables a function requires. For example:
Copy the codeThe code is as follows:
function add_nums(num1, num2){
return num1 + num2;
}
add_nums.length // 2 is the amount of parameters expected by the function add_nums
6. Use the "arguments" object to understand how many parameters a function receives
This technique allows you to use the "arguments" object to understand how many parameters a function receives. For example:
Copy the codeThe code is as follows:
function add_nums(){
return ;
}
add_nums(23,11,32,56,89,89,89,44,6); //this return the number 9
This technique is useful when you need to check the validity of the number of parameters, or when you need to create a function that is uncertain of the number of parameters.
Copy the codeThe code is as follows:
function sum_three_nums( ){
if(!=3) throw new Error('received ' + + ' parameters and should work with 3');
}
sum_three_nums(23,43); //Return the error message
function sum_num(){
var total = 0;
for(var i=0;i<arguments .length;i++){
total+=arguments[i];
}
return total;
}
sum_num(2,34,45,56,56);
7. Use objects as parameters to organize and improve functions
In modern web development, one of the most common uses of objects is to treat them as parameters of functions. It is always difficult to remember this rule for function parameters; however, using an object is very beneficial because we don't have to worry about the rule for parameter. Moreover, it is more organized and allows users to better understand what we are going to do. This method allows you to organize and improve functions using objects as parameters. For example:
Copy the codeThe code is as follows:
function insertData(name,lastName,phone,address){
code here;
}
The refactoring code looks like this:
Copy the codeThe code is as follows:
function insertData(parameters){
var name = ;
var lastName = ;
var phone = ;
var address = ;
}
It is also very useful when you want to use the default value. For example:
Copy the codeThe code is as follows:
function insertData(parameters){
var name = ;
var lastName = ;
var phone = ;
var address = ;
var status = || 'single' //If status is not defined as a property
//in the object the variable status take single as value
}
Now, it is very simple to use this function; we can send data in two ways:
Copy the codeThe code is as follows:
//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);
8. Functions are data
Functions are data like strings or numbers. We can pass them as function parameters, which can create surprising and "magnificent" web applications. This method is very useful, and almost all mainstream frameworks use this method. For example:
Copy the codeThe code is as follows:
function byId(element, event, f){
(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);}
These functions are almost identical. The only difference is how they are used. For example: the first function, you can use it before you declare it; but the second function can only be used after it is declared:
//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)}
9. Extend local objects
Although some JavaScript leaders do not recommend this technology, it has been used by some frameworks. It allows you to create helper methods for JavaScript API.
Copy the codeThe code is as follows:
//We create the method prototype for our arrays
//It only sums numeric elements
= function(){
var len = ;
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'];
();
= function(){
return ('',this);
}
10,Boolean
Pay attention to the difference between them, as this will save you time debugging your scripts.
Copy the codeThe code is as follows:
'' == '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
If you've read these scripts elsewhere, these tips can help you get it right. These tips are not even as the tip of the iceberg as all JavaScript features, but this is the beginning! Please don't be polite, leave your comments, questions, extra tips or concerns, but remember, this is an article for beginners! ! I hope to receive letters from some developers! Enjoy!