JavaScript

1 javascript基础语言

1) 宿主环境语言,依托与浏览器。

2) 解释型语言,

3) 脚本语言

特别:

1. 安全性高

2. 跨平台性

JAVA的不同:

1. NetScape公司,javaSun公司;

2. JS基于对象,Java面向对象;

3. JS需要有解释器的浏览器可以执行,JAVA需要先编译后执行;

4. JS是弱类型,JAVA是强类型;

javascript语法体系

1EMCA基础语法(统一)

2BOM编程(不统一)

3DOM编程(不统一)

1.1 javascript使用

//java     单行 //    多行 /* */    文档注释  /**  */  javadoc

//css      多行注释  /* */

//javascript    单行 //     多行  /* */

/*

常用的函数:

alert("提示框");

document.write("向浏览器输出内容");

*/

//alert("提示框");

//document.write("输出内容");

/*

javascript的使用方法:

1)内部javacript:

a)html页面中使用<script>标签,在<script>标签体中写js内容

b)弊端:和html代码混杂在一起,不好维护,不好重用

2)外部javascript(推荐使用)

*/

注意事项:

1. 页面可以有多个<script>

2. <script>标签按顺序执行;

3. 可以出现在页面的任何位置;

4. 必须以</script>结束,不然页面会报错。

1.2 变量和数据类型

/*

1)定义和赋值变量: var 变量名=;

注意:

1)使用var关键词定义变量,var可以省略的,但是不建议省略var

2) js中可以重复定义变量,后面定义的变量会覆盖前面的变量。

3) js是弱类型语言,使用var来定义任何数据类型

4js中变量的类型是由变量的值决定的,所以只定义不赋值的变量,就是一个未赋值变量(undefined),未赋值的变量不能使用

typeof(变量): 查看变量的数据类型

2)js的数据类型分类:

a)number: 无论整数还是小数,都是number类型

b) string:  无论字符还是字符串,都是string类型

c) boolean

d) object  对象类型

*/

1.3 类型转换函数

string->number(整数) :  parseInt(变量)

string->number(小数):  parseFloat(变量)

注意:

1)使用parseInt函数转换时,转换的内容中的第一个是数值类型,就可以继续转换,直到遇到非number类型为止。

1.4 运算符

1)算术运算符: + - * /  %

2)比较运算符: > <  >=  <= ==

3)逻辑运算符: &&  ||   !

4)三目运算符:  表达式 ? true的结果 : false的结果

1.5 流程控制语句

If

条件可以是:

布尔值:true:成立 ; false:不成立

number:非0:成立; 0: 不成立

string: 非空字符串: 成立 ; 空字符串: 不成立

object: null: 成立;  null:不成立

Swtich

 语法:switch(i){   case "a":  document.write("你选择了a");break;

for

while

do-while

for-in

With

练习

1,显示"*"为三角型,5行,第1行有1"*",第2行有2"*"……

  *

 ***

*****

2,显示乘法口诀。

1*1=1

1*2=2 2*2=4

....

1*9=9 2*9=18 ...

1.6 函数

函数定义:

function 函数名称(形式参数列表){

语句

}

调用函数:

函数名称(实际参数列表);

注意:

1js的函数使用function定义,但是形式参数列表不能使用var关键词

2js的函数可以有返回值,直接使用return关键词返回即可,不需要声明返回值类型

3) js没有方法重载的概念,后面定义的函数会覆盖前面的函数。

4js中的形式参数和实际参数的数量可以不一致,依然可以调用。

5js的每个函数中都隐藏了一个叫arguments的数组,这个数组用于接收函数调用时传递过来的实际参数值。

6)arguments数组接收完实际参数后,会逐一的依次从左到右赋值给形式参数,如果实际参数数量大于形式参数,则丢失剩下的实际参数

1.7 基于对象编程

内置对象

String对象

常用方法:

charAt(): 返回指定索引的内容

indexOf(): 返回首次出现指定字符的索引位置

lastIndexOf(): 返回最后出现指定字符的索引位置

fontcolor(): 直接给字符串添加颜色

replace(): 替换指定的字符串

split(): 使用指定字符串切割字符串,返回字符串数组

substring(start,end); 截取字符串,start:开始索引, end:结束索引

substr(strat,[length]) 截取字符串, start:开始索引 length: 截取的字符串长度

Number对象

Boolean对象

Math对象

常用的方法:

1ceil(): 向上取整。 如果有小数部分的话,直接+1

2floor(): 向下取整。如果有小数部分的话,直接丢失小数部分,保利整数位

3) round(): 四舍五入取整。满5进一

4random(): 生成一个随机的0-1的小数 .包含0,不包含1

5max(): 返回最大值

6min(): 返回最小值

Date对象

Array数组对象

注意:

1)数组的长度会随着元素的添加而变化,不用担心出现索引位置越界的异常。

2) js的数组可以存放任意类型的元素。

方式一:创建数组

1.1 指定数组长度

1.2 不指定数组长度、默认0个元素

1.3 指定具体内容

方式二: 不需要new,直接指定内容

var arr = [10,"java",false];

给数组赋值

遍历  length属性: 表示数组的长度

常用的方法:

join(字符串): 使用指定的字符串,把数组的所有元素连接在一起,最终组成一个新的字符串

reverse(): 反转数组中的元素

1.8 自定义对象

java:使用class来定义对象

javascript: 使用function来定义对象

定义对象方式一:有参数的构造函数 (推荐)

function 对象名称(形式参数){

定义属性

定义方法

}

创建对象:

var 变量 = new 对象名称(实际参数);

定义对象方式二: 无参数的构造函数

追加属性和方法

定义对象的方式三:使用Object对象。 Object对象可以作为任意对象的模板

定义对象方式四:使用字面量的形式创建对象。 json语言(了解)

练习:

设计一个数组工具对象,例如ArrayUtil对象,该对象提供以下两个方法:

         search(array,str): 传入指定的数组和指定的字符串,返回指定字符串所在的位置

            max(array): 传入指定的数组,返回该数组中的最大值

1.9 原型

给内置对象追加方法

问题: 不使用ArrayUtil工具,但也想实现searchmax方法的功能

预期解决方法: 想把searchmax方法设计到Array内置对象中

    

    问题:如何给Array对象扩展两个方法呢?

    

    方案一:拿到Array定义对象的代码,在代码上加

     function Array(){

         this.join = function(){}

            this.reverse = function(){}

            this.saarch = function(){}   追加方法

This.max = function(){}

        }

        拿不到Array对象的源码,行不通

        

        

     方案二:使用原型属性给Array对象添加方法

      什么是原型?

         1js的每个对象中都包含有了原型属性(prototype

            2)如果往某个对象的原型属性添加了方法,那么添加的这个方法就会自动地添加到当前对象的方法中。

            3) 原型的作用:给内置对象追加方法的

            

           function Array(){

            //属性

            this.prototype = new Prototype(); //原型对象

           

            this.search = function(){}

           }

           

           原型对象

           function Prototype(){

            this.search = function(){}

           

            }

JavaScript的API——链接:

https://pan.baidu.com/s/1TrhKlxpkCM3B1T4DKl3qIQ
提取码:1sl6

原文地址:https://www.cnblogs.com/lldsgj/p/10796453.html