Java Script
//(函数体)
}
// 调用函数:函数名(实际参数);
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">
<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>
<button onclick="onclickFun();">静态注册</button>
<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 通过标签对象. 《一线大厂 Java 面试题解析+后端开发学习笔记+最新架构讲解视频+实战项目源码讲义》无偿开源 威信搜索公众号【编程进阶路】 事件名 = 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>
评论