使用JavaScript的基本Web应用程序开发

最新推荐文章于 2024-06-17 20:13:06 发布

cumubi7453

最新推荐文章于 2024-06-17 20:13:06 发布

阅读量358

点赞数

文章标签：游戏 java javascript python 编程语言 ViewUI

原文链接：https://www.includehelp.com/code-snippets/basic-web-application-development-using-javascript.aspx

版权

There are many programming languages out there in the market each one having its own significance. Out of many, in this article, I will be using JavaScript for developing a web-based gaming portal.

市场上有许多编程语言，每种都有自己的意义。在本文中，我将使用很多JavaScript来开发基于Web的游戏门户。

Now you all must be wondering what is JavaScript? Like C++, Java etc. - "JavaScript is an object-oriented programming language. It is an interpreter based coding language, which was highly underrated. All the dynamic and responsive WebPages you see across the browsers are build-using JavaScript".

现在你们都必须在想什么是JavaScript？ 像C ++ ， Java等。- “ JavaScript是一种面向对象的编程语言。它是一种基于解释器的编码语言，被低估了。您在浏览器中看到的所有动态和响应式WebPage都是使用JavaScript构建的。”

是什么使JavaScript如此特别？ (What Makes JavaScript so Special?)

Easy syntax and semantics.
简单的语法和语义。
Simple language, easy to grasp.
语言简单，易于掌握。
Object-oriented language.
面向对象的语言。
Can handle both front and back end of websites alone.
可以单独处理网站的前端和后端。

I hope it is quite clear why JavaScript is getting more and more popular these days.

我希望很清楚，为什么JavaScript在这些天变得越来越流行。

For all the newbie’s in the programming world, Elaborating last point: Every website/webapp we see on different browsers has two parts namely, Frontend & Backend. Front-end refers to how the website appears to users, designing, layout, color scheme etc. and on the other hand, back-end refers to the processing of data like payment gateways, dynamic and responsive behavior, authorization, security concerns. Earlier developers needed more than one language for development an maintenance of websites but then came JavaScript in the race, it could handle it all alone.

对于编程世界中的所有新手，最后一点要加以说明：我们在不同浏览器上看到的每个网站/ webapp都有两个部分，即前端和后端。前端是指网站对用户的外观，设计，布局，配色方案等；另一方面，后端是指对数据的处理，如支付网关，动态和响应行为，授权，安全问题。早期的开发人员需要一种以上的语言来开发网站维护，但后来出现了JavaScript，它可以单独处理所有内容。

Now in this article, I am going to design and develop a hit n trial based gaming interface using JavaScript.

现在，在本文中， 我将使用JavaScript设计和开发一个基于hitn试用版的游戏界面 。

Here we go...

开始了...

JavaScript Code:

JavaScript代码：

var location1 = 3;
var location2 = 4;
var location3 = 5;
var guess;
var hits = 0;
var guesses = 0;
var isSunk = false;
var tocontinue= true;

while (isSunk == false && tocontinue==true) {
	guess = prompt("Ready, aim, fire! (enter a number from 0-6): OR Enter q to quit the game");
	if (guess < 0 || guess > 6) {
		alert("Please enter a valid cell number!");
	}
	else if(guess==""){
		alert("game over");
	}
	else if(guess=="q"){ 
		var quit=prompt(" are you sure you want to quit ?");
		if(quit=="yes"){
			tocontinue=false;
		}
	}
	else{
		guesses = guesses + 1;
		if (guess == location1 || guess == location2 || guess == location3) {
			alert("HIT!");
			hits = hits + 1;
			if (hits == 3) {
				isSunk = true;
				alert("You sank my battleship!");
			}
		} 
		else{
			alert("MISS");
		}
	}
}
if( tocontinue==true){
	var stats = "You took " + guesses + " guesses to sink the battleship, " +
	"which means your shooting accuracy was " + (3/guesses);
	alert(stats);
}

HTML Code:

HTML代码：

<html lang="en">
	<head>
		<style>
			h1{
				border:5px double black;
			}		
		</style>
		<meta charset="utf-8">
	</head>
	
	<body>
		<h1 >PLAY BATTLESHIP</h1>
		<script src="battleship.js"></script>
	</body>
</html>

Here, we need two files one of HTML extension and other a JavaScript file of JS extension because browsers cannot render a JS file they only understand HTML format. (I expect readers to have basic knowledge of HTML).

在这里，我们需要两个文件，一个是HTML扩展名，另一个是JS扩展名JavaScript文件，因为浏览器无法呈现他们只了解HTML格式的JS文件。 (我希望读者具有HTML的基本知识)。

In HTML, I have given a path for JS file (<script src="battleship.js"></script>) which is in the same folder as the HTML file.

在HTML中，我给了JS文件( <script src =“ battleship.js”> </ script> )的路径，该路径与HTML文件在同一文件夹中 。

As you can see JavaScript code is quite simple and self-explanatory.

如您所见，JavaScript代码非常简单且易于解释。

In JS instead of int, char, float, we have var (let and const also) which is kinda all in one and can be assigned to any datatype. After that, we have a basic while loop and if else statements. Things that must be bothering you would be alert & prompt. Alert and prompt are methods of window object which is inbuilt in JS but they do not need a dot operator or period to be invoked.

在JS中，我们使用了var(也包括let和const)代替int，char，float，它们全部合而为一，并且可以分配给任何数据类型。之后，我们有了一个基本的while循环和if else语句。必须困扰您的事情将变得机敏并Swift。警报和提示是JS内置的窗口对象的方法，但是它们不需要点运算符或句点来调用。

Alert is for displaying any sort of information to the user via a dialogue box. It has only one argument.

Alert用于通过对话框向用户显示任何类型的信息。它只有一个论点。

Similarly prompt is for taking input from the user which is saved into another variable and then this variable is further used for decision making to have dynamic behavior on websites.

同样，提示是要从用户那里获取输入，并保存到另一个变量中，然后将此变量进一步用于决策，以使网站具有动态行为。

I hope the rest of the code is easy to grasp.

我希望其余代码易于掌握。

Thank you for reading my article. For any queries, feel free to write in the comment section. I will be soon back with another interesting article.

感谢您阅读我的文章。对于任何查询，请随时在评论部分中编写。我很快会回来的另一篇有趣的文章。