我的php学习第十天之javascript篇

昨日回顾

运算符

算术运算符(数学):+、-、*、/、%、 ++、--

赋值运算符:=、+=、-=、*=、/=、%=

举例:M *= 2  展开后  M=M*2

字符串连接符:+、 +=

比较运算符:>、<、>=、<=、==、!=、===、!==

比较的结果只有两个:true和false

=:赋值运算符,将右边的运算结果赋给左边的变量

==:是比较运算符,是比较两个操作数的值(不含类型)是否相等;

===:是比较去处符,同时比较两个操作数的类型和值,是否一致;

逻辑运算符:&&、|| 、!

&&:逻辑与,如果两个表达式的值同时为true,则结果为true;反之,为false

10 < X <20 程序中: a>10 && a<20

||:逻辑或,如果两个表达式的值,有一个为true,则结果为true;反之,为false

X>20 或 X<10   程序中:a>20 || a<10

三元运算符:条件表达式 ? 为true时执行 : 为false时执行

如果“条件表达式”的结果为true,将执行“为true时的代码”,否则,执行“为false时的代码”

实例:求a=10和b=20的最大值

 

写程序的步骤:

  • 声明变量
  • 变量初始化:也就是给变量赋一个初始值
    1. 字符串变量a=“”
    2. 数值型变量a=0
  • 业务逻辑
  • 输出结果

 

如果程序没有结果输出的原因:

(1)可能没有使用输出命令:document.write()、window.alert()

(2)JS程序有错误,可以使用Firebug进行查看

 

自动数据类型转换

(1)其它类型转成布尔型

A = 10;             // true

A = 0;              //false

A = “”;             //false

A = undefined;      //false

A = null;           //false

A= “abc”;          //true

(2)其它类型转成数值

A = true;     // 1

A = false;    // 0

A = “abc”;    // NaN

A = undefined;  // NaN

A = null;       // 0

(3)其它类型转成字符型

A = true;    //  “true”

A = undefined;   // “undefined”

A = null;     // “null”

强制数据类型转换

Number():将其它类型强制转成数值,如果转不成,则返回NaN

Boolean():将其它类型强制转成布尔型

String():将其它类型强制转成字符串

A = “120px”;   Number(A) = NaN

例如:对一个图片的宽度(width:300px)增加100px

       width = “300px”;

       width = parseInt(width);  //从字符串中提取整数

       width = width + 100 + “px”;   // 300 + 100 + “px” = 400 +”px” = “400px”

 

从字符串中提取数值:parseInt() parseFloat()

parseInt(str):从str字符串中,从左到右提取整数数值(0-9、.、-);如果遇到非数值型数据,则停止提取;

如果第一个字符为非数值型,则直接返回NaN

parseInt(“120px”) = 120

parseInt(“a120”) = NaN

parseFloat(str):从str字符串,从左到右提取浮点数,如果遇到非数值型数据,则停止提取;

如果第一个字符为非数值型,则直接返回NaN

parseFloat(“.34px”) = 0.34

parseFloat(“120.45px”) = 120.45   //提取浮点数

parseInt(“120.45px”)  = 120   //提取整数

 

流程控制:程序根据条件,来选择执行哪个代码

if语句结构一

if(条件表达式){

执行代码;

}

结构二:

if(条件表达式){

条件为true时执行;

}else

{

条件为false时执行;

}

 

结构三:多条件

if(条件1){

代码1;

}else if(条件2){

代码2;

}else if(条件3){

代码3

}else{

默认执行的代码;

如果上面条件都不满足时,执行该代码;

}

 

二、switch语句

switch(条件表达式){

case 值1:

代码1;

break;

case 值2:

代码2;

break;

case 值3:

代码3;

break;

default:

默认代码;

}

结构说明:

首先计算“条件表达式”,条件表达必须要有一个固定值,这个值不是true和false;

拿这个值去与每一个case的值进行比对,如果符合某一个,则执行该case中的代码;

每一个case后必须要有一个break语句,结束该switch的运行,转到结束大括号}之后运行其它程序;

如果没有指定break,则程序会把每一个case语句执行个遍;

Default是默认执行的代码,如果上面所有的case都不满足条件,则执行default语句。

 

三、while循环:如果条件满足,就反复的执行循环体中的代码

格式:

while(条件表达式){

执行的代码;

}

结构说明:

  • 在循环前要定义变量,并初始化;举例: var i = 1;
  • 在循环体{}中,要对变量进行更新;举例: i++或i—
  • 如果条件为true,则执行循环体;条件为false,退出循环体
  • 如果一开始条件就为false,循环体代码一次都不会执行

实例:九九乘法表

第一步:先输出九行一列的表格

image002

image004

第二步:输出九行九列的表格

image006

image008

第三步:输出梯形表格

image010

image012

第四步:输出内容

image014

image016

do while循环

do while循环是while的一种变体。

结构语法:

do{

循环体代码;

}while(条件表达式)

结构说明:

先执行一次循环体,再来判断条件是否满足;

do while循环体代码至少执行一次;

在do while前要对变量初始化;

在do while循环体中,要对变量进行递增或递减(变量要更新);

举例说明:输出1-10之间的数

var a = 1;  //变量初始化

do{

document.write( a + “ ”);

a++;  // 一定设定变量自增,否则会造成“死循环”

}while(a<=10)

 

 

for循环

语法结构:

for(变量初始化 ; 条件表达式 ; 变量更新)

{

循环执行的代码;

}

结构说明:

For循环的第一步,也就是对变量进行初始化,变量初始化只在程序开始时,执行一次;

For循环的第二步,执行条件表达式,如果为true,则执行循环体,否则,退出循环体;

For循环的第三步,条件表达式为true时,执行循环体代码;

For循环的第四步,执行“变量更新”;

举例说明:输出1-100间所有的数

for(var i=1;i<=100;i++)

{

document.write( i + “ ”);

}

for(var i=100;i>=1;i--)

{

document.write( i + “”);

}

 

 

数组

一、数组的概念

数组是一组数据有序排列的集合。数组是复合的数据类型。数组中至少有一个值,可以是多个值。

数组是存储多个值的容器。

举例:var arr = [10,20,30,40,50,true,“北京”]

数组元素: 数组中的每一个值就叫一个“数组元素”。

数组下标:数组中每个元素都对应一个“整数下标”,下标是“非负整数”;

数组下标0开始编号,第一个元素的下标是0,第二个数组元素的下标是1,第三个数组元素的下标是2……

比如:0、1、2、3、……

访问数组元素:用数组变量名称结合[],[]中是数组元素所在下标,这种方法来访问。

比如:

arr[0]=100   //给下标为0的数组元素赋一个新值

arr[6]=“广州”  //给下标为6的数组元素赋一个新值

document.write(arr[6]);  //输出下标为6的数组元素的值

 

数组的长度:就是数组中所有元素的总个数

获取数组的长度:通过数组对象的length属性来获取

var len = arr.length;  //将获取到的数组的总长度赋给一个变量

数组的最大下标:总长度(个数)-1

 

二、创建数组元素(定义数组变量)

(1)使用new关键字结合Array()数组构造函数来创建,不带参数

格式:var arr = new Array();

举例:

var arr = new Array();   //声明一个数组的变量

arr[0] = 10;   //给变量arr赋值

arr[1] = 20;   //给变量arr赋值

arr[2] = 30;   //给变量arr赋值

 

注意:使用document.write()和window.alert()输出数组时,会将数组元素连成一个字符串,打印出来

 

(2)使用new关键字结合Array()数组构造函数来创建,可以带整数参数

格式:var arr = new Array(3)

说明:创建一个具有3个元素的数组,换句话说,数组的长度为3

举例:

var arr = new Array(3);

arr[0] = 10;

arr[1] = 20;

arr[2] = 30;

arr[4] = 40;

arr[5] = 50;

arr[99] = 99;

//数组的长度,总是最大下标+1,不管中间的元素是不是存在

document.write(arr.length);

(3)使用new关键字结合Array()数组构造函数来创建,参数可以是数组元素列表

格式:var arr = new Array(10,20,30,40,50);

举例:

Var arr = new Array(10,20,30,40);

Arr[4] = 50;  //增加了一个新元素

(4)使用[ ]方法直接创建

格式:var arr = [10,20,30,40,true];

举例:

var arr = [10,20,30];

arr[3] = 40;  //增加一个元素

 

三、数组对象

一个数组对应一个数组对象。数组对象的一个重要属性是length,统计数组的长度。

语法格式:arr.length  

说明:arr.length相当于arr的最大下标加1

 

四、删除数组元素

使用delete运算符来删除数组元素或对象的一个属性。

格式:delete arr[0]

注意:只是删除这个元素的值,而所占的空间或下标并没有删除,换句话说:也就是最大下标没有改变,数组的长度也没有改变。

 

五、数组嵌套

JS中没有多维数组,只有一维数组,但可以实现数组嵌套数组,也就是说:数组元素还是一个数组

(1)使用new和Array()来创建二维数组

var arr = new Array();

arr[0] = 0;

arr[1] = new Array(100,200,300);

arr[2] = 20;

arr[1][0] = “广州”;   //将第二层数组中下标为0的元素的值改为“广州”

delete arr[1][2];   //删除第二层数组中下标为2的元素

document.write( arr[1][1] );  //输出第二层数组中下标为1的元素的值

访问多维数组元素:arr[0][0],先访问第一层数组元素(下标为0),再访问第二层数组元素(下标为0)

 

(2)使用[ ]来创建二维数组

Var arr = [

[1,“张三”,“男”,3000],

[2,“李四”,“女”,4000],

[3,“王五”,“男”,5000]

];

 

//将第二层数组中的“张三”修改成“张三丰”

arr[0][1] = “张三丰”

//求三个人的工资总和

Var sum = arr[0][3]+arr[1][3]+arr[2][3]

//给“王五”增加一个“奖金”的数据

arr[2][arr[2].length] = 500;

arr[2].length是指第二层数组中“王五”所在的数组的长度

 

注意:length只能统计每一层数组的长度,而不能同时统计多维数组的总度。

image018

<script type="text/javascript">

var arr = [

["周更生","男",30,true,"大专",5000,500,,"山东省"],

["刘晓庆","女",26,false,"研究生",8000,1500,"北京科技大学","山西省"],

["习近平","男",38,true,"大专",1000,250,"清华大学","陕西省"],

["李克强","女",34,true,"高中",11000,30,"河北大学","江苏省"]

];

var str = "<table width=500 border=1 align=center>";

//循环表格行

for(var i=0;i<arr.length;i++)

{

str += "<tr>";

//循环单元格

for(var j=0;j<arr[i].length;j++)

{

str += "<td>"+ arr[i][j] +"</td>";

}

str += "</tr>";

}

str += "</table>";

document.write(str);

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处:https://www.cwhello.com/434.html

(0)
上一篇 2015年11月27日 13:39
下一篇 2015年11月30日 11:33

相关推荐

  • javascript案例——用户输入数据验证(附代码)

    知识点 1、JS支持事件处理业务逻辑模型,常用事件 Click  单击 Dblclick 双击 Focus 聚焦 Blur 失去焦点 Mouseover 鼠标悬停 Mousemove 鼠标移动 Mouseout 鼠标移开 Change 改变 Load 页面加载 Keydown 键按下 调用 ...

    2017年10月26日
    0208
  • 我的php学习第十三天之javascript篇

    昨日回顾 对象:对象是一组属性和方法的集合。 属性就是特征,比如一个人有:身高、体重、年龄、姓名等。 方法:就是为了完成一项功能,而定义的函数。 方法就是函数,但方法是用在对象中的,用在对象中的函数,就叫...

    2015年11月30日
    0180
  • 通过js实现移位下拉框功能(附代码)

    移位下拉框实现效果如下: 完整源码: 无标题文档 红色 蓝色 绿色 黄色 橙色 以上就是通过js实现移位下拉框功能。希望能帮助到更多的新手学习。...

    2018年4月2日
    0147
  • 我的php学习第十二天之javascript篇

    昨日回顾 函数 函数的概念:将一段常用代码进行命名,这个名称就叫“函数”。 函数的步骤:(1)先定义函数,函数定义后不能直接执行,必须调用函数,函数才会执行 (2)调用函数:直接写函数名称,后面直接跟一个小括...

    2015年11月30日
    0554
  • 为什么要学习JS及输出方法

    网站解析原理 无论任何高级编程语言,比如PHP,最终都会调用环境解析成HTML+CSS+JS。换个意思来说:浏览器只能识别HTML+CSS+JS!!   JS的简介及作用 JavaScript,Java小脚本,简称JS,是微软公司开发的轻量级...

    2017年10月25日
    0102
  • 我的php学习第十一天之javascript篇

    昨日回顾 If和switch if和switch的主要区别:if的条件是一个范围,switch是一个固定值。 If(条件表达式) { 条件为true执行的代码; }else { 条件为false执行的代码; } switch(条件表达式) { Case 值1: 代码1; break...

    2015年11月30日
    0145
  • javascript实现下拉框与复选框操作教程

    下拉框操作 实现效果如下: 完整源码如下:   无标题文档 ==请选择== ==红色== ==绿色== ==蓝色== 以上就是通过js实现下拉框与复选框的操作方法...

    2018年4月2日
    0158
  • Javascript的定义和出现背景

    1. 定义 基于事件和对象驱动,并具有安全性能的脚本语言。 2. 出现背景 上世纪90年代,在美国有出现,当时有上网的环境,并且有网站服务在运行。 注册服务 上图涉及的问题: ① 带宽非常浪费,往往由于一个项目部正确...

    2017年11月22日
    0176