Maison > interface Web > js tutoriel > le corps du texte

Concaténation de chaînes Javascript novice et application de variables

coldplay.xixi
Libérer: 2020-12-07 17:47:58
avant
4160 Les gens l'ont consulté

javascriptLa colonne présente l'apprentissage de l'épissage de chaînes et de l'application de variables

Concaténation de chaînes Javascript novice et application de variables

Recommandations d'apprentissage gratuites associées : javascript(vidéo)

1. Plan de cours

Épissage de chaînes (+ ) Apprentissage et application
Application de la transformation de coordonnées dans le jeu de combat aérien

2.1 Épissage de chaînes

  • Utilisez "+" dans le numéro JS, connectez les chaînes, variables, valeurs, etc.

2.2 Afficher le nombre d'amis sur la boîte d'avertissement

Afficher le nombre d'amis sur la boîte d'avertissement, l'effet d'affichage est le suivant

Déclarez la variable amis pour représenter le nombre d'amis, affichez "Le nombre de mes amis est : 7" sur la boîte d'avertissement, utilisez le caractère d'épissage de chaîne "+" , le code est le suivant '

var friends = 7;
alert("我的朋友数量为:" +friends);
Copier après la connexion

2.3 Afficher votre âge sur la case d'avertissement

Déclarez la variable age et attribuez-la à votre âge Le code est le suivant. :

var age = 23;
Copier après la connexion

Afficher " sur la boîte d'avertissement Mon âge est : 23", en utilisant le caractère d'épissage de chaîne "+", le code est le suivant :

alert("我的年龄" + age);
Copier après la connexion

L'effet d'affichage est le suivant

2.4 Affichage sur toile Le score du jeu de combat aérien

déclare le score variable, et attribue la valeur au score du jeu, le code est comme suit :

var score = 95;
Copier après la connexion

déclare la variable x, et affecte la valeur à la coordonnée X du texte, le code est le suivant :

var x = 50;
Copier après la connexion

déclare la variable y et l'affecte au Y coordonnée du texte. Le code est le suivant :

var y = 50;
Copier après la connexion

Utilisez l'attribut font de ctx pour définir la taille et la police du texte. Le code est le suivant :

ctx.font = "30px 微软雅黑";
Copier après la connexion

sur le canevas. "Score : 98" s'affiche à l'écran, en utilisant la méthode fillText et le caractère d'épissage de chaîne "+", le code est le suivant :

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

Le résultat de l'exécution du code est le suivant

3.1 Changements de coordonnées

Regardez l'image ci-dessous. Comment les coordonnées changent-elles lorsque le méchant se déplace d'un point A à un point B ?

Comme le montre l'image, lorsque le méchant se déplace du point A au point B, la valeur de la coordonnée X augmente de 4, mais la valeur Y ne change pas.

Regardez l'image ci-dessous. Lorsque le méchant se déplace du point A au point B, comment les coordonnées changent-elles ?

Comme le montre l'image, lorsque le méchant se déplace du point A au point B, la valeur des coordonnées Han augmente de 3 et la valeur y augmente de 2.

L'arrière-plan et l'avion bougent

Les règles de changement de coordonnées de l'arrière-plan et de l'avion en même temps sont : les valeurs de coordonnées X de l'arrière-plan et l'avion reste inchangé et les valeurs des coordonnées Y continuent d'augmenter

Si vous voulez que l'avion se déplace plus rapidement que l'arrière-plan, alors dans le même temps, augmentez la valeur de la coordonnée Y de l'avion ; est supérieure à la valeur d'augmentation de la coordonnée Y de l'arrière-plan.

Les codes pour l'arrière-plan et le mouvement de l'avion sont les suivants (où : x1 et y1 représentent les coordonnées de l'arrière-plan ; x et y représentent les coordonnées de l'avion) :

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);
Copier après la connexion

Cela termine ceci article sur les caractères pour les débutants en Javascript Ceci conclut l'article sur la concaténation de chaînes et l'application des variables.

Recommandations d'apprentissage gratuites associées : programmation php (vidéo)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:jb51.net
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal