Javascript学习之路

207 阅读2分钟

这是我参与11月更文挑战的第3天,活动详情查看:2021最后一次更文挑战

js入门

JavaScript是一种web编程语言,我们看到的html页面都是用此语言设计的。

我们知道网页可以有各种控件,能和后端对接,并且有各种各样的样式,都是依赖于html、css和JavaScript这三大元素。

一直都很想学一点前端知识,那么就从JavaScript开始吧。

首先是JavaScript的用法,如果要在html网页中插入JavaScript(后面简称js),需要使用标签<script> </script>,他们之间的代码行就包含js内容。

<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落</p>");
</script>

在java里面我们有执行的方法块,可被调用,那么在js中也有这样作用的函数。

js函数

函数就是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试函数</title>
<script>
function oneFunction()
{
    alert("Hello World!");
}
</script>
</head>
 
<body>
<button onclick="oneFunction()">请点击</button>
</body>
</html>

这段代码的意思就是,点击这个button,就会触发oneFunction函数,即这里定义了button的点击事件。函数里面做了什么事情呢?弹出一个框显示“Hello,world!”,如此便是这边代码的逻辑,是不是挺简单。

那么调用一个带参数的函数是怎么实现呢?

<p>点击这个按钮,来调用带参数的函数。</p>
<button onclick="oneFunction(2,3)">点击这里</button>
<script>
function oneFunction(a,b){
    c=a+b;
    alert("a+b="+c);
}
</script>

和java里面定义方法非常像,就是把传参写在函数的括号里面。

那么带有返回值的函数是怎么样呢?

语法也非常简单

function testFunction()
{
  String x="测试一下";
  return x;
}

有没有不返回内容直接退出函数的呢?当然有。

function secondFunction(a,b)
{
    if (a>b)
    {
        return;
    }
    else{
    return b;
    }
}

这里有两种返回结果,对应的就是a和b的大小比较。

下期继续讲js的语法和语句。