Javaweb基础--JavaScript

JavaScript中的HelloWorld

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>HelloWorld</title>
  <script type="text/javascript">
    window.onload = function () {
      //通过id获取元素
      var btnEle = document.getElementById("bthId");
      //为bthId关联单击事件
      //匿名函数
      btnEle.onclick = function () {
        //提示框
        alert("Hello Js");
      }
    }
  </script>
</head>
<body>
<!--Sayhello 单击按钮-->
<button id="bthId">Sayhello</button>
</body>
</html>

JavaScript的基础语法

变量

  <script>
    /*
    使用var声明变量
    使用type()验证变量数据类型

    * 基本数据类型：
    *           1、number
    *           2、string
    *           3、boolean
    *           4、null
    *           5、undefined【未定义：只声明未赋值】

      对象数据类型：
                1、数组
                2、函数
                3、一般对象
    * */
    var i = 1;
    var name = "zs";
    alert(name);
  </script>

数组

 <title>数组</title>
  <script type="text/javascript">
    /*
    * js：1、定义数组var arr = [];
    *    2、var srr2 = new Array();
    * 注意：1、js数组中可以存储任意数据类型
    *      2、js数组是自动扩容的
    * 调用数组：arr[index]
    *
     */
    var arr = [1,"js",false];
    //alert(arr[1]);
    //遍历js数组
    for (var i = 0; i < arr.length; i++) {
      alert(arr[i]);
    }
  </script>

运算符

  <script type="text/javascript">
    /*
    * js：1、定义数组var arr = [];
    *    2、var srr2 = new Array();
    * 注意：1、js数组中可以存储任意数据类型
    *      2、js数组是自动扩容的
    * 调用数组：arr[index]
    *
     */
    var arr = [1,"js",false];
    //alert(arr[1]);
    //遍历js数组
    for (var i = 0; i < arr.length; i++) {
      alert(arr[i]);
    }
  </script>

JavaScript函数

函数的定义方式

  <script type="text/javascript">
    /*
    *Js定义：
    *1、定义普通函数：function 函数名([形参列表]){}
    *2、定义匿名函数：function([形参列表]){}
    *
    * 调用函数：1、js调用函数时，不检查形参与实参的匹配情况
    *         2、实参 > 形参：自动忽略多余实参
    *            形参 > 实参：实参的数据类型为number，返回结果NuN（计算的结果不是一个数值）
    *                            数据类型为string，结果进行拼接
    * */
    //定义普通函数
    function add(i, j) {
      return (i + j);
    }

    alert(add(1, 2));

    //定义匿名函数
    var fun = function () {
      alert("匿名函数")
    }
    fun();

  </script>

JavaScript不允许重载

<script type="text/javascript">
    //测试函数重载
    function fun() {
      alert("fun1")
    }
    function fun(i) {
      alert("fun2")
    }
    fun();
    /*
    * js函数不允许重载及重写问题，后面的同名函数会覆盖前面的同名函数
    * */
    </script>

隐形参数arguments

 <script type="text/javascript">
/*
*了解：arguments 类似于Java中的可变形参
* */
    function add(i, j) {
      alert(arguments[2]);
      return (i + j);
    }

    alert(add(1, 2,300));
  </script>