2024年java特别基础

java特别基础目录 概述 特点 和 Java 的区别 弱类型语言 强类型语言 书写位置 数组 函数 JS 中的自定义对象 扩展内容 Object 形式的自定义对象 JS 中的事件 常用的事件 动态注册基本步骤 DOM 模型 总结 概述 JavaScript 是目前 web 开发中不可缺少的脚本语言 js 不需要编译即可运行 运行在客户端 需要通过浏览器来解析执行 JavaScript 代码 JS 组成部分

大家好,我是讯享网,很高兴认识大家。



概述

JavaScript是目前web开发中不可缺少的脚本语言,js不需要编译即可运行,运行在客户端,需要通过浏览器来解析执行JavaScript代码。

JS组成部分:

组成部分 作用 ECMA Script 构成了JS核心的语法基础 BOM Browser Object Model 浏览器对象模型,用来操作浏览器上的对象 Dom Document Object 文档对象模型,用来操作网页中的元素

特点

1.交互性(它可以做的就是信息的动态交互)

2.安全性(不允许直接访问本地硬盘)

3。跨平台性(只要可以解析js的浏览器都可以执行,和平台无关)

和Java的区别

JavaScript Java Netscape公司的产品,最初叫Livescript Sun公司的产品,现在是Oracle公司的产品 直译式脚本语言 需要先编译成字节码文件,在执行 弱类型语言 强类型语言

弱类型语言

弱类型语言是一种弱类型定义的原,某一个变量被定义类型,该变量可以根据环境变化自动进行转换,不需要经过显性强制转换

强类型语言

强类型语言是一种强制类型定义的语言,一旦某一个变量被定义类型,如果不经过强制转换,则它永远就是该数据类型了

书写位置

1.内嵌式:

 <script type="text/javascript"> //alert是Javascript语言提供的一个警告框函数 //它可以接受任意类型的参数,这个参数就是警告框的提示信息 alert("内嵌式") <script> 
讯享网

2.外联式:

首先新建一个文件类型为.js的文件,然后再该文件中写js语句,通过script标签对引入到html页面中。

讯享网 <script src="https://www.jb51.net/article/js文件路径地址">这里不能写js语句</script> 

3.行内式:

直接写在标签身上,是一个简写的时间,所以又称之为事件属性。 onclick单机事件

 <input type="button" value="点我呀" onclick="alert(点我干啥!);"> <button onlick = "alert("test");>点我呀!<button> 

数据类型

变量是可以存放某些之的内存的命名。

定义:存放数据,内存可以存储任意数据

JavaScript的变量类型

未定义的类型:undefined

数值类型: number (凡是数字都是数值型,不区分和小数)

字符换类型:string(凡是引号包裹起来的内容全部都是字符串)

对象类型:object(特殊数值null)

布尔类型:boolean (true,false)

函数类型:function

JavaScript里特殊的值:

undefined 未定义,所有js变量未赋予初始值的时候,默认值都是unde空值

null 空值

关系(比较)运算

等于: == 等于是简单的做字面值的比较

全等于: === 除了做字面值的比较之外,还会比较两个变量的数据类型

逻辑运算

且运算:&&

第一种 :当表达式全为真的时候,返回最后一个表达式的值

第二种:当表达式中,有一个为假的时候。返回第一个为假的表达式的值

讯享网 var a = "abc"; var b = true; var d = false; var c = null; ​ alert(a && b); // true alert(b && a); // true alert(a && d); // false alert(a && c); // null 

或运算:| |

第一种:当表达式全为假时,返回最后一个表达式的值

第二种:只要有一个表达式为真,就会把返回第一个为真的表达式的值

 alert(a || c); // null alert(c || d); // false alert(a || c); // abc alert(b || c); //abc 

并且&&与预算和| |或运算有短路。

短路就是说当这个&&或| |运算有结果了之后。后面的表达式不在执行

在Javascript语言中,所有的变量,都可以作为一个boolean类型的变量去使用

数组

1,数组定义方式

js中数组的定义

格式:

 var 数组名 = []; //创建空数组 ​ var 数组名 = [1,'abc',true]; //定义数组同时赋值元素 ​ alert(arr.length); // 遍历数组 

注意:使用最大下标值就会自动的给数组做扩容操作

函数

可以使用function关键字来定义函数

 // 第一种 var function 函数名(函数体){ //(函数体) } // 调用函数:函数名(实际参数); //第二种 var 函数名 = function(函数体){ //(函数体) } // 调用函数:函数名(实际参数); 

1,函数只有被调用后才会执行

2,如果函数需要返回值,直接使用return返回,不会像Java一样要考虑返回值的类型

在JavaScript语言中,如何定义带有返回值的函数?

只需要在函数体内直接使用return语句返回值即可!

注:再Java中函数允许重载,但是再JS中函数的重载会直接覆盖掉上一次的定义

函数的 arguments 隐形参数(只放在function函数内)

就是再function函数中不需要定义,但却可以直接用来获取所有参数的变量。我们管它叫隐形参数。

隐形参数特别像Java基础的可变长参数一样。

可变长参数其他是一个数组。

那么js中的隐形参数也跟Java的可变长参数一样。操作类似数组。

在js中万物皆对象,甚至数组字符串函数都是对象。所以这个叫做arguments的东西也是个对象,而且是一个特殊的对象,它的属性名是按照传入参数的顺序来的,第一个参数的属性名是'0',第二个参数的属性名是'1',以此类推,并且它还有个length属性,存储的是当前传入函数参数的个数,很多时候我们把这种对象叫做类数组对象。

JS中的自定义对象(扩展内容)

Object形式的自定义对象

对象的定义:

 var 变量名 = new Object(); //对象实例(空对象) ​ 变量名.属性名 = 值; // 定义一个属性 ​ 变量名.函数名 = function(){} // 定义一个函数 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
      // 对象的定义
      // var 变量名 = new Object();    //对象实例(空对象)
      // 变量名.属性名 = 值;   // 定义一个属性
      // 变量名.函数名 = function(){} // 定义一个函数
      var obj = new Object();
      obj.name = "111";
      obj.age = 18;
      obj.fun = function (){
        alert("姓名:" + this.name + ",年龄:" + this.age);
      }
      // 对象的访问:
      // 变量名.属性 / 函数名();
      alert(obj.age)
    </script>
</head>
<body>
​
</body>
</html>

花括号形式的自定义对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
      // 花括号形式对象的定义:
      // var 变量名 = {   // 空对象
      //   属性名:值,  // 定义一个属性
      //   属性名:值,  // 定义一个属性
      //   函数名:function(){}  // 定义一个函数
      // };
      var obj = {
        name:"刘德华",
        age:19,
        fun : function(){
          alert("姓名:" + this.name + ",年龄:" + this.age);
        }
      };
      // 对象的访问:
      // 变量名.属性 / 函数名();
      alert(obj.name);  // 访问var内的局部变量
      obj.fun();  // 访问var内的fun方法
    </script>
</head>
<body>
​
</body>
</html>

JS中的事件

什么是事件?事件是电脑输入设备与网页进行交互的相应。我们称之为事件。

常用的事件:

onload:加载完成事件 页面加载完成之后,常用于做页面js代码初始化操作

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <script type="text/javascript">
    // onload事件的方法
    function onloadFun(){
      alert("静态注册onload事件,所有代码");
    }
    // onload 事件动态注册是固定写法
    window.onload = function (){
      alert("动态注册的onload事件")
    }
  </script>
</head>
<!--静态注册事件onload事件
<body onload="alert('静态注册onload事件')">
-->
<body>
</body>
</html>

onclick:单击事件 常用于按钮的点击相应操作

<!DOCTYPE html>
<html lang="en"java特别基础>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        function onclickFun(){
        alert("静态注册onclick事件");
        }
        // 动态注册onclick事件
        window.onload = function (){
            // 1 获取标签对象
            /*
             * document 是JavaScript语言提供的一个对象(文档)
             * get  获取
             * Element  元素(就是标签)
             *
             * getElementById通过ID属性获取标签对象
             */
        var btnObj = document.getElementById("btn01");
        // alert(btnObj);
        // 2 通过标签对象.事件名 = function(){}
        btnObj.onclick = function (){
            alert("动态注册的onClick事件")
            }
        }
    </script>
</head>
<body>
    <!--静态注册onClick事件-->
    <button onclick="onclickFun();">静态注册</button>
    <!--动态注册onClick事件-->
    <button id="btn01">动态注册</button>
</body>
</html>

onblur:失去焦点事件 常用于输入框失去焦点后验证其输入内容是否合法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
      // onblur事件会在对象失去焦点时发生
      // 静态注册失去焦点事件
      function onblurFun(){
        // console是控制台对象,是由JavaScript语言提供,专门用来向浏览器的控制器打印输出,用于测试使用
        // log()是打印的方法
        console.log("静态注册失去焦点事件");
​
      }
​
      // 动态注册 onblur事件
       window.onload = function (){
          // 1.获取标签对象
         var passwordObj = document.getElementById("password");
         // alert(passwordObj);
         // 2.通过标签对象.事件名 = funcion(){};
         passwordObj.onblur = function (){
           console.log("静态注册失去焦点事件");
         }
       }
    </script>
</head>
<body>
    用户名:<input type="text" onblur="onblurFun();"><br/>
    密码:  <input id="password" type="text"><br/>
</body>
</html>

onchange:内容发生改变事件 常用于下拉列表和输入框内容发生改变后操作

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <script type="text/javascript">
    function onchangeFun(){
      alert("您的男神改变了")
    }
  </script>
</head>
<body>
请选择你心目中的男神:
<select onchange="onchangeFun()">
  <option>你自己</option>
  <option>洋洋</option>
  <option>羊羊</option>
  <option>阳阳</option>
</select>
</body>
</html>

onsubmit:表单条件事件 常用于表单提交前,验证所有表单项是否合法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        // 静态注册表单提交事件
        function onsubmitFun(){
            // 要验证所有表单项是否合法,如果有一个不合法就阻止表单提交
            alert("静态注册表单提交时间-----发现不合法")
            return false;
        }
        window.onload = function (){
            // 1 获取标签对象
            var fromObj = document.getElementById("form01");
            // 2 通过标签对象.事件名 = function(){}
            fromObj.onsubmit = function (){
                // 要验证所有表单项是否合法,如果有一个不合法就阻止表单提交
                alert("动态注册表单提交事件-----发现不合法");
​
                return false;
            }
        }
    </script>
</head>
<body>
    <from action = "http://localhost:8080" method = "get" onsubmit="return false">
        <input type="submit" value="静态注册"/>
    </from>
    <from action = "http://localhost:8080" id="form01">
        <input type="submit" value="动态注册"/>
    </from>
​
​
</body>
</html>

事件的注册又分为静态注册和动态注册两种

事件的注册(绑定)?

其实就是告诉浏览器,当事件响应后要执行哪些操作代码,叫事件注册或事件绑定。

静态注册事件:通过html标签的事件属性直接赋值于事件响应后的代码,这种方式我们叫静态注册。

动态注册事件:是指先通过js代码得到的标签dom对象,然后再通过dom对象.事件名 = function(){}这种形式赋于事件响应后的代码,叫动态注册。

动态注册基本步骤:

1,获取标签对象

2,标签对象.事件名 = funcion(){}

DOM模型

DOM全程是Document Object Model 文档对象模型

就是把文档中的标签,属性,文本,转换成为对象来管理。

总结

小讯
上一篇 2024-12-27 17:32
下一篇 2025-01-02 18:41

相关推荐

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请联系我们,一经查实,本站将立刻删除。
如需转载请保留出处:https://51itzy.com/kjqy/3121.html