JavaScript学习小结(一)——JavaScript入门基础
JavaScript是一种用于Web开发的脚本语言,主要用于增强网页的交互性和动态性。本篇文章将为初学者介绍JavaScript的入门基础。
语法结构
JavaScript代码通常嵌入在HTML文件中,可以使用<script>
标签来定义JS代码块。JavaScript的语法结构包括变量与赋值操作、数据类型、运算符、条件语句、循环语句等。
变量与赋值操作
在JavaScript中定义变量使用var
关键字,例如:
var x=10;
alert(x);
以上代码定义一个名为x
的变量,并将其赋值为10
。alert(x)
语句用于在网页上显示x
的值。在JavaScript中,分号表示语句的结束。
数据类型
JavaScript支持的数据类型包括数字、字符串、布尔型、数组、对象等。例如:
var x=123.45; // 数字
var y="Hello World!"; // 字符串
var z=true; // 布尔型
var arr=[1,2,3,"four"]; // 数组
var obj={name:"Tom",age:18};// 对象
运算符
JavaScript支持的运算符包括算术运算符、比较运算符、逻辑运算符等。例如:
var a=10,b=5;
var result=a+b; // 算术运算符
if(a>b){ // 比较运算符
alert("a>b");
}
if(a>5&&b<=10){ // 逻辑运算符
alert("a>5且b<=10");
}
条件语句
JavaScript中的条件语句用于根据条件是否成立来执行不同的代码块,例如:
var num=10;
if(num>0){
alert("num是正数");
}
else if(num<0){
alert("num是负数");
}
else{
alert("num是零");
}
循环语句
JavaScript中的循环语句允许程序重复执行同一段代码。常见的有for
循环和while
循环,例如:
for(var i=0;i<5;i++){
alert(i);
}
var j=0;
while(j<5){
alert(j);
j++;
}
示例说明
以下是两个简单的JavaScript示例,供初学者参考:
示例1:计算器
以下代码实现了一个简单的加法计算器:
<!DOCTYPE html>
<html>
<head>
<script>
function calc(){
var num1=parseFloat(document.getElementById("num1").value);
var num2=parseFloat(document.getElementById("num2").value);
var result=num1+num2;
document.getElementById("result").value=result;
}
</script>
</head>
<body>
<label for="num1">数字1:</label>
<input type="text" id="num1"><br>
<label for="num2">数字2:</label>
<input type="text" id="num2"><br>
<input type="button" value="计算" onclick="calc()"><br>
<label for="result">结果:</label>
<input type="text" id="result">
</body>
</html>
该代码使用了HTML和JavaScript,实现了一个简单的加法计算器,并将结果显示在网页中。用户输入数字后,点击“计算”按钮即可得到结果。
示例2:猜数游戏
以下代码实现了一个简单的猜数游戏:
<!DOCTYPE html>
<html>
<head>
<script>
var num=parseInt(Math.random()*100+1);
function guess(){
var guessNum=parseInt(document.getElementById("guessNum").value);
if(guessNum>num){
alert("猜大了");
}
else if(guessNum<num){
alert("猜小了");
}
else{
alert("恭喜你猜对了!");
}
}
</script>
</head>
<body>
<label for="guessNum">请输入一个1~100之间的整数:</label>
<input type="text" id="guessNum"><br>
<input type="button" value="确定" onclick="guess()">
</body>
</html>
该代码使用了HTML和JavaScript,实现了一个简单的猜数游戏。程序会随机生成一个1~100之间的整数,用户输入自己猜的数字后,程序会判断这个数字是太大、太小还是恰好等于随机数,并给出相应的提示。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:JavaScript学习小结(一)——JavaScript入门基础 - Python技术站