JavaScript学习笔记（2）

最新推荐文章于 2024-08-14 15:20:01 发布

c.a.

最新推荐文章于 2024-08-14 15:20:01 发布

阅读量106

点赞数

文章标签：学习 javascript

本文链接：https://blog.csdn.net/weixin_43788771/article/details/124499420

版权

数组

JavaScript里的数组定义比较随意，可以随意扩展，并且不同类型的数据可以放在同一个数组中

定义空数组：var a = [];

给数组赋值：a[0] = 12 ; a[2] = "sas", 这样，数组的长度会自动扩展为3。

函数

定义方式

第一种定义方式

function 函数名(形参列表){函数体};

注意，形参列表里直接写变量名称即可。

第二种定义方式

var 函数名 = function(形参列表){函数体}

注意两点：JavaScript里，函数若带返回值，无需在定义时特殊标识，只用在函数体中直接写return ** 即可；并且JavaScript里函数不允许重载，后定义的函数会覆盖先定义的哪个。

隐形参数argument

在JavaScript的函数定义里，形参列表其实没有也可以，因为有隐形参数自动会获取传入的参数。他比较像java里的可变长参数:public void fun(Object...args)。隐形参数和可变长参数一样，操作都类似数组。并且和本身形参列表里的形参并不矛盾。

function fun(a){
    alert(argument[0]);
    alert(argument.length);
    alert(a);
}

注意，JavaScript里数字和字符串相加结果会自动变为字符串。

对象

第一种定义方式

同样，对象也是一种数据类型，所以声明也用var，并且可以直接创建对象的属性和方法，不用先定义后使用

var obj = new object();
obj.属性名 = 值;
obj.方法名 = function(){};

第二种定义方式

也可以用{}进行定义：

var obj = {
    属性名：值,
    方法名：function(){}
}//注意，是用json一样的格式

事件

事件也就是用户所作的一系列操作，而JavaScript需要对这些操作做出相应的反应，这也是JavaScript最大的特性之一：信息交互。

事件包含以下几个：

onload 加载完成事件：页面加载完成之后，常用于作页面js代码的初始化（后面几个可以都放在这里面）

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

onblur失去焦点事件：常用于焦点移出输入框后判断内容是否合法

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

onsubmit表单提交事件：常用于表单提交前，验证所有表单内容是否合法

事件的注册

事件注册就是告诉浏览器发生上述事件后，应该做什么操作

静态注册

通过html标签的事件属性直接赋予事件发生后相应的代码

动态注册

先在js代码中获得标签的dom对象，然后通过dom对象.时间名 = function (){}赋予事件相应后的代码

常用事件

onload

...静态注册。onload是在浏览器解析完页面代码后进行的操作，因此需要写body标签的事件属性

<head>
    <script>
    function onload(){
    ...
    }
    </script>
</head>
<body onload = "onloadfun();">
</body>

...动态注册：是固定写法
<head>
    <script>
    window.onload = fun(){
    ...
    }
    </script>
</head>
<body>
</body>

onclick

静态注册略去，注意动态注册的话，要写在onload的方法里面！

window.onload = function(){
    var btnObj = document.getElementById("id");//"id"是想引入onclick事件的标签的id,很多是按钮
    btnObj.onclick = function(){
    } 
}

因为JavaScript中代码是从上到下执行的，若动态注册这两行代码放到外面，在执行这句js代码时，还没有id为“id”的标签，因此会报错。而放到函数里面的话应该是不被影响的。涉及到代码执行顺序？

onblur

动态注册同样要放到onload事件里

window.onload = function(){
    var passwordObj = document.getElementById("password");//常用于密码失去焦点后验证是否正确
    passwordObj.onblur = function(){
        console.log("动态注册失去焦点事件")；
    }
}

onchange

可用于下拉选项框选择发生改变后进行相应操作

onsubmit

可用于表单提交后的数据验证。验证不合格后返回false，onsubmit属性接受到false后可以阻止表单提交。

静态注册
function onsubmitFun(){
    /**验证部分,这里假设验证不合法
    */
    return false;
}

body里表单标签写：
<form action = "http://localhost:8080" method ="get" onsubmit = "return onsubmitFun();">
    <input type="submit" value="静态注册">
</form>

动态注册
window.onload = function(){
    var formObj = document.getElementById("form01");
    formObj.onsubmit = function(){
        /**验证部分,这里假设验证不合法
        */
        return false;
       }
}
body里表单标签写：
<form action = "http://localhost:8080" method ="get" id="form01">
    <input type="submit" value="动态注册">
</form>