JavaScript简介、函数

        函数:函数是指在一段在一起、可以做某一件事的程序。也叫做子程序、(OOP)方法。

    函数是实现某一个功能的方法


    创建函数:
        javascript
    function+函数名(有参、无参){代码块}


    执行函数:
        javascript
    函数名();----》》》把创建的函数执行,而且这个函数可以执行很多次。
    函数名()...;----》》》每一次执行都相当于把函数体中实现功能的JS代码重复执行了一遍。


    优势

    在真实项目中,我们一般都会把实现一个具体功能的代码封装在函数中:
        1、如果当前这个功能在页面中执行多次,不封装函数的话每一次实现这个功能,都需要重新把代码写一次,浪费时间;而封装在函数中,以后想实现多次这个功能,我们就没有必要再重新写代码了,只需要把    函数重新执行即可,提高了开发效率。

        2、封装在一个函数中,页面中就基本上很难出现重复一样的代码了,减少了页面中代码的臃肿度,调高    了代码的重复利用度:低耦合高内聚

    我们把以上的特点称为**函数封装**(OOP面向对象编程思想,需要我们掌握的就是类的继承、封装、多态)


    JS中函数的核心原理
    
        函数作为JS中引用数据类型中的一种,也是按照引用地址来操作

--

            课堂笔记

        java html  css
        javaScript:是一种基于对象和事件驱动的脚本语言
        特点:
            解释性语言,边解释边执行
            向HTML页面中添加交互行为
        语法:
            变量:java int i = 100;  String name = "";
                    js:var i = 100;  var name = "";
            数据类型
                number  boolean  string null  undefined
            运算符
                赋值 =
                算数 + - * / %  ++ --  +=  i+=1;
                比较     > < == >= <= !=    ===
                逻辑        && ||  !
                位        & | ^  ~ << >>  <<<
                三元        1?2 :3
            流程控制
                if-else  switch
                while do-whlie  for
            数组
                java:int[] s2 = {1,6,8,9};
                js:var s2 = new Array(1);
            输入输出
                prompt()
                alert()
            注释语法
        函数(方法)
            系统函数:parseInt():将字符串转换成int
                      isNaN():判断是不是数字,是数字返回false
            自定义函数
                语法:public void show(int i){}

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

诞生于1995年,当时的主要目的是验证表单的数据是否合法。

JavaScript本来应该叫Livescript,但是在发布前夕,想搭上当时超热的java顺风车,临时把名字改为了JavaScript。(也就是说js跟java没有关系,当时只是想借助java的名气)。

js组成部分:

(1)核心(ECMAScript):这一部分主要是js的基本语法。

(2)BOM:Brower Object Model(浏览器对象模型),主要是获取浏览器信息或操作浏览器的,例如:浏览器的前进与后退、浏览器弹出提示框、浏览器地址栏输入网址跳转等操作等。

(3)DOM:Document Object Model(文档对象模型),此处的文档暂且理解为html,html加载到浏览器的内存中,可以使用js的DOM技术对内存中的html节点进行修改,用户从浏览器看到的是js动态修改后的页面。(增删改查)

2、特点:
交互性(它可以做的就是信息的动态交互)
安全性(不允许直接访问本地硬盘)
跨平台性(只要是可以解析js的浏览器都可以执行,和平台无关)
3、和Java区别:


4、作用
avaScript 被用来改进设计、验证表单、检测浏览器、创建cookies,等等。JavaScript 是因特网上最流行的脚本语言,并且可在所有主要的浏览器中运行,比如: Internet Explorer、 Maxthon、Mozilla、Firefox、Netscape、Chrome和 Opera等。

在目前学习阶段只要记住最常用的二个:(1)运态修改html及css代码 (2)验证表单

5、书写位置
5.1、内嵌式:

理论上js可以书写在页面的任意位置。

5.2、外链式:

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


5.3、行内式:

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



6、注释:
单行注释:        //    注释语句        快捷键ctrl+/
多行注释:        /* 注释语句 */    快捷键ctrl+shift+/   
注意:多行注释相互不能嵌套使用,只能在多行注释里面使用单行注释!
7、数据类型:
Js中的数据类型:
 

数值型:number(凡是数字都是数值型,不区分整数和小数)
字符串:string(凡是引号包裹起来的内容全部都是字符串)
布尔:boolean(true、false)
对象类型:object(特殊取值null)
未定义型:undefined
对比java中的数据类型:

整数:byte short int long
小数:float double
字符:char 
布尔:boolean
字符串:String
8、变量:
8.1、定义:就是存放数据的、内疗可以存储任意数据

8.2、声明变量:
 

var 变量名称 = 存储的数据;       (variable 变量)
8.3、变量命名规范:

1.    只能由字母、数字、_(下划线)、$(美元符号)组成。
2.    不能以数字开头。
3.    命名中不能出现-(js会理解成减号进行减法的操作),不能和关键字冲突。
js是弱类型语言,不重视类型的定义,但js会根据为变量赋值的情况自定判断该变量是何种类型:

数值型:var i = 1;    var d = 2.35;
字符串:var str = "用心学习";
布尔型:var b = true;
对比Java:java是强类型的语言,注重类型的定义,Java定义类型如下:

整型:int i = 1;
浮点型:double d = 2.35;
字符串:String str = “用心学习”;
布尔型:boolean b = true;
总结:js中变量的定义。只要加一个var就行。java则使用什么类型的变量就要定义什么类型的。

9、检测数据类型:
typeof(value); 或者typeof value;     返回这个变量的类型. 
说明 : 同一个变量, 可以进行不同类型的数据赋值.

10、算术运算符
+    -    *    /    %    ++    --
注意:

1.    由于js中的小数和整数都是number类型,不存在类似整数除以整数还是整数的结论。
2.    字符串和其他的数据使用+号运算,会连接成一个新的字符串。
3.    字符串使用除了+以外的运算符:如果字符串本身是一个数字,那么会自动转成number进行运算
,否则就会返回一个NaN的结果,表示这不是一个数字。NaN:not a number

11、关系(比较)运算符
>        >=        <        <=      !=        
==    等于(只比较内容)    ===    恒等于(比较内容的同时还要比较数据类型)
注意:关系运算符返回的结果只有两个:true / false

12、逻辑运算符
&&         与        true&&false        ====>false
||         或        true||false            ====>true
!         非        !true                ====>false
false(理解):false,  0,  null,  undefined 
true(理解):true, 非0,  非null,  非undefined
 
针对 && 顺口溜: 找第一个出现的假值. (一假即假)
针对 || 顺口溜: 找第一个出现的真值. (一真即真)
演示一:


演示二:


13、三元运算符:
条件?表达式1:表达式2
如果条件为true,返回表达式1的结果
如果条件为false,返回表达式2的结果
演示:


14、if条件语句
这个和Java中if语句一样。

演示:


15、switch分支结构
这个和java中switch结构一样。只是Java中表达式为:常量 整型(去long)、字符、字符串

演示:


16、循环结构 while、do-while. for;
while(循环条件){循环体;}
do{循环体;}while(循环条件);
for(循环变量赋初值;循环条件;循环变量增值){循环语句;}
console.log(...); 以日志的形式在控制台输出结果!
演示:


 
18、自定义函数
函数是命名的独立的语句段,这个语句段可以被当作一个整体来引用和执行:

格式:

function 函数名(形式参数){函数体}
调用函数:函数名(实际参数);
18.1、函数只有被调用后才会执行

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


18.3、如果函数需要传递参数、不需要指定参数的类型、直接使用变量即可


18.4、js中出现二个重名的函数名、后者会把前面的覆盖掉

对比java、java有重载(同名不同参)、重写(同名同参同返回值类型、方法体不一样)

演示:


会显示二次下面的图片:

19、匿名函数
匿名函数是没有名字的函数

function(形式参数){函数体}
调用方式:将匿名函数赋值给一个变量,通过变量名调用函数
定义函数并赋值给变量:var fn = function(形式参数){函数体}
调用函数:fn(实际参数);
演示:


20、案例-轮播图
说明1 : script 标签需要放在 body 标签之后.
 
说明2 : window.setInterval(“字符串函数名称()”, 时间毫秒数);
 
说明3 : window.setInterval(函数名称, 时间毫秒数);
 
说明4 : window.setInterval(匿名函数, 时间毫秒数);            推荐使用

   
    轮播图
 
   
 


   


        图片
   


实现一:


实现二:


21、js事件
21.1、事件概述:

事件三要素:
1.    事件源:被监听的html元素(就是这个事件加给谁),就是某个(某些)html标签
2.    事件类型:某类动作,例如点击事件,移入移除事件,敲击键盘事件等
3.    执行指令:事件触发后需要执行的代码,一般使用函数进行封装
语法格式:事件源.事件类型=执行指令
21.2、常用的事件:

案例:




   
    事件
 
   
 


   

 

 

 

JavaScript于JAVA的区别是:不是一回事。具体个人理解!

                                                                                   

                                                                                                 注意:JAVA的for循环于JavaScript循环语句有区别哦!

          

你可能感兴趣的:(JavaScript简介、函数)