JavaScript 初心者が知っておくべき 10 のヒント_JavaScript のヒント

ほとんどのブラウザに対応しているため、これらのブラウザでご利用いただけます。 JavaScript は非常にシンプルで広く使用されているため、急速に受け入れられています。多くのプログラマーは、JavaScript は「おもちゃの言語」であると考えていましたが、AJAX は市場に参入した後、JavaScript がまったく異なる機能と機能を発揮できるようになりました。
この発明のおかげで、プログラマーはデスクトップ アプリケーションの効果を持つ Web アプリケーションを作成できるようになりました。これは、データをより速く変更できるため有益です。ここでは、初心者が JavaScript をより上手に使用できるようにするための小さなヒントをいくつか紹介します。 JavaScript は幅広い用途で使用されており、スタイルも非常に多いため、さまざまなトリックを行うことができます。また、プログラミング手法は数多くありますが、初心者が JavaScript を理解するための出発点として適していると思われるテクニックを 10 個だけ厳選しました。
1、配列の末尾に要素を追加します
このトリックにより、Length プロパティを使用して配列の末尾に要素を追加できます。これは、Length プロパティが配列の最後の要素より 1 つ多い添字であるためです。配列。この方法は「プッシュ」方法と同じです。例:

コードをコピー コードは次のとおりです。

var myArray = [];
myArray [myArray.length] = '新しい要素';

2、配列の長さを調整します
Length プロパティは読み取り専用ではないため、値を設定できます長さプロパティの。さらに、これを使用して配列の長さを増減することもできます。例:

コードをコピー コードは次のとおりです:

var myArray = [1, 2,3] ;
myArray.length // 3
myArray.length = 2; // 最後の要素を削除します
myArray.length = 20 // 要素が含まれる配列に 18 個の要素を追加します。未定義の値。

3. 「!!」を使用して任意のデータ型を変換します。
このテクノロジーを使用すると、任意のデータ型を変換できます。 (文字列、数値、整数など) ブール値に変換されます。例:

コードをコピー コードは次のとおりです:

var myString = '23255' ;
typeof myString; //String
myString = !!myString
typeof myString //Boolean

4、数値を文字列に変換します。 use number 数値を文字列に変換するには、最後に空の文字列を追加します。例:

コードをコピー コードは次のとおりです。

var mynumber = 234;
typeof mynumber; //数値
mynumber = ''; //文字列


5 、関数に必要な変数の量を理解する

これは、関数に必要な変数の数を正確に知ることができる素晴らしいトリックです。例:

コードをコピー コードは次のとおりです。

function add_nums(num1, num2) ){

return num1 num2;
}
add_nums.length // 2 は関数 add_nums で予期されるパラメータの量です


6、「arguments」オブジェクトを使用して関数が受け取った引数の数を理解する

この手法を使用すると、「arguments」オブジェクトを使用して、関数が受け取った引数の数を確認できます。例:

コードをコピー コードは次のとおりです。

function add_nums(){

return argument .length;
}
add_nums(23,11,32,56,89,89,89,44,6); //これは数値 9 を返します


必要な場合 このテクニックは、引数の数の妥当性をチェックする場合、または引数の数が不確かな関数を作成する必要がある場合に役立ちます。

コードをコピー コードは次のとおりです:

function sum_three_nums( ){
if(arguments.length!=3) throw new Error('arguments.length ' パラメータを受け取りました。
}
sum_three_nums(23,43); //エラーメッセージを返します。
function sum_num(){
var total = 0;
for(var i=0;itotal =arguments[i];
合計を返す
}
sum_num(2,34,45,56,56);

7オブジェクトをパラメーターとして使用して関数を整理および改善する
現代の Web 開発では、オブジェクトの最も一般的な使用法の 1 つは、オブジェクトを関数のパラメーターとして使用することです。関数パラメータのこのルールを覚えるのは常に困難ですが、オブジェクトを使用すると、パラメータのルールを気にする必要がなくなるため、非常に有益です。さらに、より整理されており、ユーザーは私たちがやろうとしていることをよりよく理解できるようになります。このメソッドを使用すると、オブジェクトをパラメータとして取得することで機能を整理および改善できます。例:

コードをコピー コードは次のとおりです。

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

再構築後のコードは次のようになります:

コードをコピー コードは次のとおりです。

function insertData(parameters){
var name =parameters.name;
var lastName =parameters.lastName;
varphone =parameters.phone;
var address =parameters.address;


デフォルト値を使用したい場合にも便利です。例:

コードをコピー コードは次のとおりです。

function insertData(parameters){

var name = パラメータ.名前;
var アドレス = パラメータ.アドレス;
var ステータス = パラメータ.ステータス; | 'single' //ステータスがプロパティとして定義されていない場合
//オブジェクト内で変数ステータスは値として単一を取ります
}


これで、使い方は非常に簡単ですこの関数では、次の 2 つの方法でデータを送信できます:

コードをコピー

コードは次のとおりです: //例 1 insertData({名前:'マイク', 姓:'ロジャース', 電話:'555-555-5555',アドレス:'住所', ステータス:'結婚'});

/ /例 2
var myData = { name:'Mike',
lastName:'Rogers',
phone:'555-555-5555',
address: '住所',
status:'marriage'
};
insertData(myData);


8、関数は文字列または数値のようなデータですそれらを関数パラメータとして渡すと、非常に驚​​くべき「畏敬の念を抱かせる」Web アプリケーションを作成できます。この方法は非常に便利で、ほとんどすべての主流フレームワークで使用されています。例:

コードをコピー

コードは次のとおりです。 function byId(element,event) , f){ Document.getElementById(element).['on' イベント] = f; //f はパラメータとして渡す関数です }

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

データとしての関数の別の例:
//例 1
function msg(m){
Alert(m); 🎜>}
//例 2
var msg = function(m){alert(m);}
これらの関数はほぼ同じです。唯一の違いは使用方法です。例: 最初の関数は宣言する前に使用できますが、2 番目の関数は宣言した後にのみ使用できます。
//例 1
msg('Hello world');
function msg(m){
alert(m);
}
//例 2
msg('Hello world') //JavaScript が関数を見つけられないため機能しません。 msg は宣言される前に使用されるため、


9、ローカル オブジェクト
を拡張しますが、一部の JavaScript リーダーはこれを推奨していません。技術ですが、すでにいくつかのフレームワークで使用されています。これにより、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;iif(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);
}

10, Boolean
Note between them difference, as this will save you time debugging your script.

Copy code The 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 seen these scripts elsewhere, these tips may help you get the hang of it. These tips don’t even scratch the surface of what JavaScript can do, but it’s a start! Please feel free to leave your comments, questions, extra tips or concerns, but remember, this is an article for beginners! ! I'd love to hear from some fellow developers! Enjoy!