ホームページ  >  記事  >  ウェブフロントエンド  >  初心者向け Javascript 文字列の連結と変数の適用

初心者向け Javascript 文字列の連結と変数の適用

coldplay.xixi
coldplay.xixi転載
2020-12-07 17:47:584155ブラウズ

javascript 文字列のスプライシングと変数の適用の学習に関するコラムの紹介

初心者向け Javascript 文字列の連結と変数の適用

##関連する無料学習の推奨事項:

javascript (ビデオ)

1. コースの概要

文字列のスプライシング ( ) 学習とapplication

飛行機戦争ゲームにおける座標変換の応用

2.1 文字列の結合

    JS で " " 記号を使用する、文字列、変数を連結する、価値観など

2.2 警告ボックスに友達の数を表示します。

警告ボックスに友達の数を表示します。表示効果は次のとおりです。

友達の数を表す変数 friends を宣言します。警告ボックスに「友達の数は 7 です」と表示します。文字列の結合文字「 」を使用します。コードは次のとおりです。'

var friends = 7;
alert("我的朋友数量为:" +friends);

2.3 警告ボックスに年齢を表示します。

変数 age を宣言し、それをあなたの年齢に割り当てます。コードは次のとおりです。

var age = 23;

警告ボックスに「I」を表示します。年齢は 23 インチです。文字列結合文字「 」を使用します。コードは次のとおりです。

alert("我的年龄" + age);

表示効果は次のとおりです

#2.4 航空機戦闘をキャンバス上に表示するゲームのスコア

##変数スコアを宣言し、ゲームのスコアに代入するコードは次のとおりです。

var score = 95;

変数 x を宣言し、テキストの X 座標に代入します。コードは次のとおりです:

var x = 50;

変数 y を宣言し、テキストの Y 座標に代入します。コードは次のとおりです。

var y = 50;

ctx の font 属性を使用して、テキストのサイズとフォントを設定します。コードは次のとおりです。

ctx.font = "30px 微软雅黑";

キャンバスに表示します。スコア: 98"、fillText メソッドと文字列結合文字 " " を使用したコードは次のとおりです:

var score = 95;
var x = 50;
var y = 50;
ctx.font = "30px 微软雅黑";
ctx.fillText("分数:" + score,x,y);

コードの実行結果は次のとおりです

3.1 座標の変化

下の図を見てください。悪役は点 A から点 B に移動します。座標はどのように変化しますか?

#画像からわかるように、悪役が点 A から点 B に移動すると、座標 X の値は 4 増加しますが、Y の値は変わりません。

下の図を見てください。悪役が点 A から点 B に移動すると、座標はどのように変化しますか?

#画像からわかるように、悪役が点 A から点 B に移動すると、座標の Han 値が 3 増加し、y 値が 2 増加します。

背景と機体の動き

背景と機体の同時に座標変更のルールは、背景と機体のX座標値はそのままです。変更されず、Y 座標値は増加し続けます。

航空機を背景よりも速く移動させたい場合、同じ時間内で航空機の Y 座標の増加値は より大きくなります。背景のY座標の増加値。

背景と航空機の動きのコードは次のとおりです (x1 と y1 は背景の座標を表し、x と y は航空機の座標を表します):

var x1 = 0;
var y1 = 0;
var x = 200;
var y = 0;
setInterval(function(){
	ctx.drawImage(background, x1, y1);
	y1=y1+1;
	ctx.drawlmage(enemy, x, y);
	y=y+3;
},10);

これで終わりです。 Javascript初心者のための文字に関する記事 以上で文字列の連結と変数の適用についての記事を終わります。

関連する無料学習の推奨事項:

php プログラミング

(ビデオ)

以上が初心者向け Javascript 文字列の連結と変数の適用の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はjb51.netで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。