我的ASP.NET学习笔记05Javascript基础知识01

2018-08-06 09:10:53来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

javascript

 

javascript概念

简称js,它可以针对网页上面的元素,让其动态的产生变化。

javascript的使用范围

javascript是由浏览器来执行的。包含在网页中被浏览器连同htmlcss一同解析并执行,它的运行必须依附于网页与浏览器,而不能够直接被执行。

 

javascript是由对象和事件驱动的

javascript的执行方式,是由html元素对象的事件触发的,简单的说,就是当某一html元素发生了某事件时,对应的js代码就会被执行。

 

在网页中加入并执行javascript的三种方式

直接写在html标签之中

比如:

<input type="button" value="hello" onclick="alert('hello javascript')" />

直接在html标签中onclickonchange等事件之中写入js代码

写在html网页内的<script>标签中

通常我们都是在网页的<head><body>范围内加入<script type=”text/javascript”></script>标签,在<script>的开始与结束标签中间写入javascript代码。

 

示例:

<script type="text/javascript">

alert('hello javascript');

</script>

 

javascript代码放在独立的js脚本文件之中

javascript的脚本文件,是扩展名为js的文本文件。然后在网页中添加<script></script>标签,在标签中添加src属性,这个属性的值就是js脚本文件的路径。

比如:

<script type="text/javascript" src="aaa.js">

</script>

 

注意:在引用了外部js脚本文件的<script>之中,不要加入js代码。

 

编程语言的基本概念

顺序流程

就是让程序按照从上到下的顺序依次执行。

javascript中,每一条语句的结尾处,都必须写一个分号 ; 以告诉计算机该语句已经完结。

 

变量

所谓变量,就是一个存放数据的容器,相当于数学方程式中的未知数xyz

一个变量之中只能放一个数据

声明变量语法:

在使用一个变量之前,我们必须首先声明这个变量,也就是告诉计算机我们要创建一个变量。

var 变量名 [ = 变量值 ]

我们可以在声明变量的同时赋值,也可以在声明之后再来赋值。

也可以同时声明多个变量

var a =1,b;

b=5;

alert(a+b);

 

注意:javascript中对字母的大小写是有严格的区分的,即使字母相同,但大小写不同也会被认为是两个变量。

赋值

赋值号也就是=等号,通常是将=右边的值赋值给=左边的变量。

var a =1;

a=a+2; //=代表赋值而不是相等

alert(a);

 

javascript中的注释

注释单行代码: //

注释多行代码: /*   被注释的内容    */

 

小练习:

1、在网页中调用一个外部的脚本文件,在脚本文件中实现,工资的计算功能,需要定义的变量如下:jbgz=4500(基本工资)cd=2(迟到次数)kg=3(旷工次数)gzr=22(本月工作日),求本月实际工资。迟到一次扣30,旷工一次扣3天工资。

提示:

首先算出每日的工资。

 

javascript中的数据类型

什么数据

在计算机编程的角度来看,数据的概念并不仅限于数字,它包含了数值、文本、日期、是与否、图片。就是能够被存储并处理的信息。

var a ="1" ,b="2";

alert(a+b);

 

计算机对不同类型的数据会有不同的处理方式。

数值类型Number

javascript中数值类型包含了整数、小数、负数

var a=1

不需要明确的说明一个变量的类型,系统会自动的根据它的值来判断其是什么类型。

字符串类型String

var a ="我是一个字符串";

注意:字符串类型的值必须要放在一对双/单引用号之中。

 

当数值与字符类型进行运算的时候,数值会自动被转换为字符类型。

比如:

var name ="张三";

var a = 2600;

alert(name+"本月工资是"+a+"元");

 

 

逻辑类型boolean

也叫布尔类型,它只有两种数值,truefalse,分别代表真和假,成立或者不成立,甚至代表10

var a = true;

var b = false;

alert(b);

 

用于表示一个条件是否成立。

typeof( )类型判断方法

用于判断一个变量或表达式之中存放的数据的类型。

示例:

var a = true;

var b = 4324;

var c = "hello";

alert(typeof(c)); //显示string

 

undefined

代表变量未定义,数值不明确。

 

比如:

alert(typeof(d));   //d从来没有定义过

 

NaN

是”Not a Number”,意思是指这不是一个数字。

比如:

var a = "ccc";

var b = 4324;

alert(a*b);

 

Null

代表空值,也就是一个变量的值已经被清空了。

a = null ; //代表清空一个变量。

 

 

转义字符

由于一此字符在javascript中已经有了特殊的用途,因此当我们需要使用这些字符的时候,就要对其进行转义,js才能将其作为一个普通的文本来处理了。

 

alert("我叫\"雷锋\"");

 

\” 双引号

\’ 单引号

\n 换行符

\r 回车

\\ 斜杠

单词总结

click 单击

alert 提示,警报,提示框

script 脚本,剧本

Number 数字

String 字符串

true 真,正确

false 假,错误

Boolean 布尔类型,逻辑类型

define 定义

 

javascript中的数据类型转换

将其他类型的数据转换为字符型

语法: String(数据);

示例:

var a=10,b=88553344;

alert("0"+String(a)+"-"+String(b));

 

将其他类型的数据转换为数值型

语法:Number(数据);

示例1

var a=Number("3.1415926");

alert(10+a);

 

示例2

var a=Number(false);

alert(a);

 

布尔类型在计算机中存储的时候,其真正的值就是一个二进制数,true=1false=0

其他一些将字符型转换为数值型的方法

parseInt() 将字符串转换为整数

parseFloat() 将字符串转换为包含小数的数值

这两个方法遇到字符串中的非数值字符时,会自动停止转换,返回已经转换完的部分。但是上一节中的Number()方法遇到非数值字符时会自动返回NaN

 

示例:

var a=parseFloat("3.94ccc111");

 

将其他数据类型转换为布尔类型

语法:Boolean(数据)

值为true的情况

非零的数字时(无论正负)、非空的字符串

值为false的情况

零、空字符串、未定义变量undefined、空值nullNaN

 

 

Javascript中的对话框

alert提示框

alert是最常用最简单的对话框,通常用于显示提示信息,单击上面的按钮就可以关闭对话框。

 

confirm确认框

语法:

confirm(“提示信息”);

 

 

 

弹出确认窗口,这个窗口有”确认”和”取消”两个按钮,点击”确认”返回true,点击”取消”返回false

 

示例:

var a= confirm("你确认登陆么?")

//变量a用于接收confirm的结果。

alert(a);

 

 

prompt输入框

接收用户输入的一段字符串。

语法:

prompt(“提示信息”,文本框的初值);

 

 

 

示例:

var a = prompt("请输入你的姓名:","默认用户");

alert("欢迎光临,"+a);

 

 

open方法

弹出一个新的浏览器窗口,在其中打开一个网页。

window.open("aa.html","aa",'height=300,width=500,

status=yes,toolbar=no');

 

 

这条语句打开了一个新的窗口,页面地址为aa.html,窗口IDaa,高是300,宽500,显示状态栏,不显示工具条、菜单。

 

小练习:

首先弹出确认框“您是否是男士”,点确定显示” 您是男士:true”您是男士:false”。

 

运算符与表达式

算术运算符

+ –  * /  求余%

求模

取余数:

比如:13%5=3 余数为3

逻辑运算符

真知表

两个布尔值,进行逻辑运算的时候。所谓逻辑运算就是将两个逻辑条件联合起来,一起进行判断。

布尔值1

布尔值2

逻辑与

逻辑或

true

true

true

true

false

false

false

false

true

false

false

true

 

 

两者为true则为true

两者为false则为false

两者为不同则为false

 

两者之间只要有一个成立则整句话成立。

两者都不成立,则整句话都为false

 

逻辑与 &&

&& 左右两边的两个条件进行判断,当两个条件都为true时,运算结果为true,当其中至少有一个为false时,运算结果为false

示例:

var a = false;

var b = false;

alert(a&&b);

 

逻辑或||

|| 左右两边的两个条件进行判断,当两个条件其中至少一个条件为true时,运算结果为true,当两个都为false时,运算结果为false

示例:

var a = false;

var b = false;

alert(a||b);

 

逻辑非 !

颠倒真假, ! false=true并且 !true = false

alert( ! false);

 

三元运算符

语法:

逻辑表达式 ? 表达式1 : 表达式2 ;

作用:

首先判断 ? 之前的逻辑表达式的值,如果是true则返回表达式1的值,如果是false则返回表达式2的值。

 

示例:

var a = confirm("请问您是否是男士");

var s = a?"你好先生":"你好女士"

alert(s);

 

小练习

1、 弹出一个确认框并提示,请问您是否是注册用户。如果点确定就显示“你好欢迎光临”,如果点消除则显示“不好意思,您无权登录”。

2、 有一个age年龄变量值是11,弹出确认框询问“今天是否是你生日”,如果点确认则age112,如果点取消,则age还是11

 

比较运算符

比较运算符的运算结果为布尔值

<小于 >大于 >=大于等于 <=小于等于

==相等 !=不等于

注意:(数值18与字符”18”是相等,javascript字符类型的数值与数值类型的值,只要数字相等,那么用==来判断的话就是相等的。)

 

如果要严格区分类别的话,可以使用:

=== 严格相等,就是值与类型都必须相同。

!== 严格不相等,就是值或类型必须不相同。

 

复合运算符

赋值

很多时候我们需要对一个变量进行加减乘除,然后将运算结果再赋值回这个变量本身,在这种情况下,我们可以通过复合运算符来简化这个过程。

 

a=a+1 可简化为  a+=1

a=a-1 可简化为  a-=1

a=a*1 可简化为  a*=1

a=a/1 可简化为  a/=1

 

累加

a++ 针对数值类型进行累加操作,每次加1,相当于a=a+1 ;

a-- 针对数值类型进行递减操作,每次减1,相当于a=a-1 ;

 

a++ 先返回值再相加

++a 先相加再返回值

 

示例:

alert((--age)*10)

 

 

运算符的优先级

()

括号

++--

递增递减

!

逻辑非

*   /

乘除

+   -

加减

%

求模,取余数

< <= > >=

大于  小于

? :

三元运算符

=   +=  -=  *=  /=

复合赋值

 

比如: 

var x = 5+4*2/4

var y = 4>=9%5&&(3==4*2/4)?x+=3:x++;

 

 

表达式

由多个运算符与数据组成的可以运算并能够得到一个单一结果的算式。

 

通常分为:

算术(数值)表达式,最终的结果是数值。

 

字符串表达式,最终的结果是字符串。

 

关系(比较)表达式,通常是由大于、等于这些比较运算符组成的返回布尔值的表达式。

 

逻辑表达式,通常是由&&||等等逻辑运算符组成的返回布尔值的表达式。

 

小练习

1、 计算一个长方形的面积,长宽值是由用户从键盘输入的,输入时要有提示信息,第一次输入长度,第二次输入宽度,最终显示一句话:“您计算的长为XX米宽为XX米的长方形的面积为XXX平方米”。

2、 依然是工资,提示用户输入:基本工资,本月工作天数,本月迟到次数(一次扣30元),旷工次数(一天扣三天工资)。最后,显示本月实际工资。附加:如果旷工超过三次,就不再显示工资数,而是显示“您本月考勤异常。”

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:理解运用JS的闭包、高阶函数、柯里化

下一篇:Vuex的使用