Javascript - 基础内容2

目录

一、函数

二、对象类型

三、数组类型

四、Js里的其他内置对象

五、Js代码的执行方式

---

一、函数

 1. 在js里函数也被认作是一种数据类型，一个函数也可以被理解为“一个函数类型的值”，

     函数名就是保存这个值的变量

 2. 定义函数

   1）使用关键字function定义

     Java --- 修饰符  返回值类型  函数名(形参类型 形参名, .......) {  }

            public  int   add(int a,int b){   return  a+b;  }

     Js ----  function  函数名( a, b ){ ..... }

            

    注意：使用与java一致   函数名(实参);

 2）隐式声明函数 --- 将函数看做是一个值

        语法：  var  函数名 =  function(形参){  函数体 } ；

        使用：  函数名(实参);

        案例：

 3) 保存函数类型数据的变量之间可以互相赋值

         var  fun1 = function(){   return “hello”;  }

         Var  fun2 = fun1 ;  // 将fun1里保存的“函数类型值”赋值给fun2，赋值成功后，fun2里存也是“函数类型值”。

         Var  fun3 = fun1(); //调用fun1函数，将fun1函数的返回值赋值给fun3变量，赋值成功后，fun3里存放的是String类型值

3. 注意：

1）js代码中没有“方法重载”的概念，调用函数时可以传入多于或者少于形参数量的实参。所有实参被默认保存在“arguments”数组里

2）函数里可以定义其他函数（函数的参数可以是另一个函数），称为“内联函数”。

二、对象类型

 1. Js里只有对象，没有类，任意两个对象都不相同。

 2. 创建对象

        语法： var 对象 = {属性名：属性值 ，属性名：属性值，..........} ;

               对象创建成功后，可以随时添加新的属性

               对象.新属性 = 值 ；

 3. 访问对象

     1）访问具体某一个属性值 --- 对象.属性名   或者   对象[“属性名”]

     2) 遍历对象属性 ： for...in语法

           for( 变量 in  对象 ){

               // 循环每执行一次，会提取对象的一个“属性名”赋值给变量

               对象[变量]

           }

4. 理论上js里的对象只有属性，没有方法。可以通过语法模拟java中的对象

三、数组类型

 1. Js里的数组不定长，存放任意数据类型

2. 创建数组

     Var  数组名 = [ 元素1，元素2，元素3，........... ];

     数组名[ 下标 ] = 值；

     数组长度 -----  数组.length

 3. 访问

1）访问一个元素 ---- 数组[下标]

2) 遍历 ---- 普通for循环遍历

 4. 常见函数

     Sort() --- 对数组元素进行排序（按照自然顺序升序排列）

     Sort( fun ) --- 根据传入的函数指定的规则排序

四、Js里的其他内置对象

 1. String类型

1）创建：  var  str = “HelloWorld”

           var  str = new String(“HelloWorld”);

2）函数：

        求字符串长度使用的是length属性，不是函数

  2. Math类型 ： 相当于java里的工具类，里面的函数相当于java里的静态方法，可以用Math直接调用

      Var  num = Math.random();

 3. Date类型：

创建 ----   var  date = new Date();  // 获取当前浏览器上的系统时间

               Var  date = new Date(“1992-03-14”); // 创建一个指定时间的日期对象

五、Js代码的执行方式

1. Js代码由事件触发运行，当网页里的html标签产生特定的能够被浏览器捕获的事件时，

触发jsp代码运行。

监听事件模型： 事件源(html标签)     事件对象(被浏览器捕获的事件)     监听器

Js代码开发步骤：

  1）确定事件源，确定需要监听的事件对象

  2）根据事件对象，选择与之对应的监听器，添加到标签上

为标签添加监听器的代码：

  1）<标签 监听器=”js代码”>     ---- 适用于少量js代码的添加

  2）<标签 监听器=”调用js里定义好的函数”>  --- 适用于大量js代码的添加

 2.常见事件监听器

 鼠标相关

        onclick 单击事件*

        ondblclick 双击事件

        onmouseover 鼠标移入*

        onmouseout 鼠标移出*

        onmousemove 鼠标移动

        onmousedown 鼠标按下

        onmouseup 鼠标松开

键盘相关,网页上任意标签 body

        onKeyDown 按键按下*

        onKeyUp 按键抬起

body相关事件

        onload =  fun //页面body加载完毕后触发 *****

        onunload 窗口离开时触发（刷新，返回，前进，主页...）

        onscroll 页面滚动

        onresize 缩放页面

form表单控件相关事件****

        onblur 当前元素失去焦点 <input>

        onchange 当前元素失去焦点，并且值改变时

                       <input>(监听value属性值得修改)  <select>

        onfocus 当前元素获得焦点时 <input>

        onsubmit 表单提交时 (验证表单数据是否格式正确) <form>

 3. 注意事项

1）内部元素产生的事件，会默认扩散到外部的容器中

   取消事件冒泡 ---  event.cancelBubble = true ;

   Event --- 事件对象， event.clientX   event.clientY (获取事件产生点的纵坐标)

2）通过为标签添加事件监听还可以修改标签的默认行为

---