javascript基础语法-01

最新推荐文章于 2021-07-25 10:34:57 发布

a584898

最新推荐文章于 2021-07-25 10:34:57 发布

阅读量159

点赞数 1

分类专栏： JavaScript

本文链接：https://blog.csdn.net/a584898/article/details/83351491

版权

JavaScript 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

javascript基础语法
javascript中的事件处理
使用javascript实现表单验证（重点）

JavaScript简介
JavaScript主要是嵌入HTML语法之中，实现页面动态效果处理的编程语言。

javascript基础语法（重点）

首先JavaScript是嵌入在HTML语法之中，所以所有的代码都使用“<script>”进行标记，但是对于脚本有很多种
现在的使用的脚本类型都使用“type”属性标注：“type="text/javascript"”。但是最早的时候也会使用“langusge”
属性标注，例如：“language="javascript"”，这两者的本质是相同的，不管使用那一个都可以

范例：定义脚本程序
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
alert("hello");//警告框
alert("你好");//警告框
</script>
</body>
</html>

但是此处有一个小问题，如果在一个项目之中，JavaScript往往会编写许多行代码，那么如果全部编写在
html之中，会造成文件混乱，那么在很多情况下都会将JavaScript代码定义在一个*js（脚本文件）之中。而后
再需要的地方使用src属性导入

范例：在需要的地方导入文件
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" src="demo.js">
</script>
</body>
</html>

这样的编写程序就非常方便维护了。
那么除了使用alert()进行警告框弹出的输出之中，也可以利用document.write()进行页面输出

范例“页面输出”
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
document.write("<h1>hello</h1>")
document.write("<h1>你好</h1>")
</script>
</body>
</html>

通过程序可以发现，利用JavaScript可以输出HTML代码，而且输出的HTML代码也可以被浏览器进行解析。
清楚了基本的结构之外，那么下面就可以进入到程序的学习，主要还是以变量，函数，数组为主

1.定义变量

JavaScript语法并不是非常严格，不像Java一样，在定义变量的时候必须设置变量的类型，同时又准备了
许多的关键字（int,double,byte等），在JavaScript里面如果要想定义变量统一使用var关键字表示，而且
变量定义的时候是不知道里面的具体类型的，具体的类型需要又设置的数据来决定的

范例：定义变量
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
var x;//设置变量，变量的类型属于未知
x=10;//因为设置的是一个整数，所以x的类型是整型
alert(x+100);
</script>
</body>
</html>

范例：定义字符串
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
var x;//设置变量，变量的类型属于未知
x="hello";//因为字符串类型
alert(x+100);
</script>
</body>
</html>

而且随着浏览器版本的提高，即使变量的时候不使用var那么也可以直接声明
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
x="hello";
y=100;
alert(x+y);
</script>
</body>
</html>

虽然这种方式比较方便，但是也有可能造成如下一种情况

范例：观察问题
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
var name="zhangsan";//变量不声明也可以直接使用，所以语法没有错误
Name="lisi";//希望修改name的内容
alert(name);
</script>
</body>
</html>

这就要求大家在编写JavaScript变量的时候一定要注意命名标准，第一个单词字母小写，而后每个单词的
首字母大写。

2.程序逻辑

程序逻辑一共是三种：顺序，选择，循环结构，这些结构的操作形式与之前没有任何的区别

范例：编写循环操作，生成表格
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
var lines=9;//行数
var columns=5;//列数
document.write("<table border=\"1\">");
for(var x=0;x<lines;x++){//控制行
document.write("<tr>");
for(var y=0;y<columns;y++){//控制列
document.write("<td>hello</td>");
}
document.write("<tr>");
}
document.write("</table>");
</script>
</body>
</html>

范例：99乘法表
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
document.write("<table border=\"1\">");
for(var x=1;x<=9;x++){//控制行
document.write("<tr>");
for(var y=1;y<=x;y++){//控制列
document.write("<td>"+x+"+"+y+"="+x*y+"</td>");
}
for(var y=1;y<=9-x;y++){
document.write("<td>&nbsp</td>")
}
document.write("<tr>");
}
document.write("</table>");
</script>
</body>
</html>

3.定义函数

Java中定义方法
[public|protected|private][static][final][synchronized]方法名称返回值类型（参数类型变量,..|变量）
[throws 异常，异常]{
[return [返回值];]
}
但是在JavaScript之中定义函数非常简单，
function 函数名称(参数,...)
{[return [返回值];]
}
所有的函数都使用function进行定义，在函数声明处没有返回值类型的声明，如果需要返回数据，则直接编写
return语法即可返回

范例：定义函数
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
function add(x,y){
return x+y;}
alert(add(10,20));
alert(add("hello","world"));
</script>
</body>
</html>

函数的定义是那么没有原则，而且数据类型完全任意，最为重要的是，传递参数的时候还可以不按照要求传递。
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
function add(x,y){
return x+y;}
alert(add(10,20，30));
alert(add(10));
alert(add("hello","world"));
</script>
</body>
</html>

虽然传递的参数上是很灵活，但是为了程序的严谨性考虑，还是定义多少个参数，就转递多少个参数。

4.定义数组

范例：在JavaScript定义数组
<html>
<head>
<title>JavaScript应用</title>
</head>
<body>

<script type="text/javascript" >
var sum=0;
var data=new Array(1,2,3); //定义三个元素的数组
for(var x=0;x<data.length;x++){
sum+=data[x];
}
alert(sum);
</script>
</body>
</html