您的位置:首页 > Web前端 > JavaScript

Python开发【前端】:JavaScript

2017-10-19 16:47 120 查看

一、JavaScript的基础

1、JS的引入方式

1 直接编写
<script>
alert('hello yuan')
</script>
2 导入文件
<script src="hello.js"></script>

二、JavaScript常用数据类型

 2.1  变量

JavaScript中变量的声明是一个非常容易出错的点,局部变量必须一个 var 开头,如果未使用var,则默认表示声明的是全局变量

<script type="text/javascript">

// 全局变量
name = 'James';

function func(){
// 局部变量
var age = 18;

// 全局变量
gender = "男"
}
</script

2.2 数字  

JavaScript中不区分整数值和浮点数值,JavaScript中所有数字均用浮点数值表示。

转换:

  • parseInt(..)    将某值转换成数字,不成功则NaN
  • parseFloat(..) 将某值转换成浮点数,不成功则NaN

特殊值:

  •  NaN,非数字。可使用 isNaN(num) 来判断。
  • Infinity,无穷大。可使用 isFinite(num) 来判断
<script>
//字符串转换为数字
age="18";
i = parseInt(age);
</script>  

更多数字计算

常量

Math.E
常量e,自然对数的底数。

Math.LN10
10的自然对数。

Math.LN2
2的自然对数。

Math.LOG10E
以10为底的e的对数。

Math.LOG2E
以2为底的e的对数。

Math.PI
常量figs/U03C0.gif。

Math.SQRT1_2
2的平方根除以1。

Math.SQRT2
2的平方根。

静态函数

Math.abs( )
计算绝对值。

Math.acos( )
计算反余弦值。

Math.asin( )
计算反正弦值。

Math.atan( )
计算反正切值。

Math.atan2( )
计算从X轴到一个点的角度。

Math.ceil( )
对一个数上舍入。

Math.cos( )
计算余弦值。

Math.exp( )
计算e的指数。

Math.floor( )
对一个数下舍人。

Math.log( )
计算自然对数。

Math.max( )
返回两个数中较大的一个。

Math.min( )
返回两个数中较小的一个。

Math.pow( )
计算xy。

Math.random( )
计算一个随机数。

Math.round( )
舍入为最接近的整数。

Math.sin( )
计算正弦值。

Math.sqrt( )
计算平方根。

Math.tan( )
计算正切值。

Math  

 三、 运算符

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

比较运算符:
>   >=   <    <=    !=    ==    ===   !==
逻辑运算符:
&&   ||   !

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

字符串运算符:
+  连接,两边操作数有一个或两个是字符串就做连接运算

3.1 算数运算符  

注意1: 自加自减

假如x=2,那么x++表达式执行后的值为3,x--表达式执行后的值为1;i++相当于i=i+1,i--相当于i=i-1;
递增和递减运算符可以放在变量前也可以放在变量后:--i

var i=10;
console.log(i++);
console.log(i);
console.log(++i);
console.log(i);
console.log(i--);
console.log(--i);

注意2: 单元运算符

- 除了可以表示减号还可以表示负号  例如:x=-y

+ 除了可以表示加法运算还可以用于字符串的连接  例如:"abc"+"def"="abcdef"

注意3: NaN

var d="yuan";
d=+d;
alert(d);//NaN:属于Number类型的一个特殊值,当遇到将字符串转成数字无效时,就会得到一个NaN数据
alert(typeof(d));//Number

//NaN特点:

var n=NaN;

alert(n>3);
alert(n<3);
alert(n==3);
alert(n==NaN);

alert(n!=NaN);//NaN参与的所有的运算都是false,除了!=

3.2 比较运算符

>   >=   <    <=    !=    ==    ===   !==

用于控制语句时:

if (2>1){       //  3  0  false null undefined []
console.log("条件成立!")
}

等号和非等号的同类运算符是全等号和非全等号。这两个运算符所做的与等号和非等号相同,只是它们在检查相等性前,不执行类型转换。  

console.log(2==2);
console.log(2=="2");
console.log(2==="2");
console.log(2!=="2");

注意1:  

var bResult = "Blue" < "alpha";
alert(bResult); //输出 true  
在上面的例子中,字符串 "Blue" 小于 "alpha",因为字母 B 的字符代码是 66,字母 a 的字符代码是 97。

比较数字和字符串

另一种棘手的状况发生在比较两个字符串形式的数字时,比如:

var bResult = "25" < "3";
alert(bResult); //输出 "true"
上面这段代码比较的是字符串 "25" 和 "3"。两个运算数都是字符串,所以比较的是它们的字符代码("2" 的字符代码是 50,"3" 的字符代码是 51)。

不过,如果把某个运算数该为数字,那么结果就有趣了:

var bResult = "25" < 3;
alert(bResult); //输出 "false"

这里,字符串 "25" 将被转换成数字 25,然后与数字 3 进行比较,结果不出所料。

总结:

比较运算符两侧如果一个是数字类型,一个是其他类型,会将其类型转换成数字类型.
比较运算符两侧如果都是字符串类型,比较的是最高位的asc码,如果最高位相等,继续取第二位比较.

注意2:

等性运算符:执行类型转换的规则如下:

如果一个运算数是 Boolean 值,在检查相等性之前,把它转换成数字值。false 转换成 0,true 为 1。
如果一个运算数是字符串,另一个是数字,在检查相等性之前,要尝试把字符串转换成数字。
如果一个运算数是对象,另一个是字符串,在检查相等性之前,要尝试把对象转换成字符串。
如果一个运算数是对象,另一个是数字,在检查相等性之前,要尝试把对象转换成数字。
在比较时,该运算符还遵守下列规则:

值 null 和 undefined 相等。
在检查相等性时,不能把 null 和 undefined 转换成其他值。
如果某个运算数是 NaN,等号将返回 false,非等号将返回 true。
如果两个运算数都是对象,那么比较的是它们的引用值。如果两个运算数指向同一对象,那么等号返回 true,否则两个运算数不等。

3.3 逻辑运算符

if (2>1 && [1,2]){
console.log("条件与")
}

// 思考返回内容?
console.log(1 && 3);
console.log(0 && 3);
console.log(0 || 3);
console.log(2 || 3);

4、流程控制  

  • 顺序结构(从上向下顺序执行)
  • 分支结构
  • 循环结构

4.1  顺序结构

<script>
console.log(“星期一”);
console.log(“星期二”);
console.log(“星期三”);
</script>

4.2 分支结构

if-else结构:

if (表达式){
语句1;
......
} else{
语句2;
.....
}

功能说明:如果表达式的值为true则执行语句1,否则执行语句2

示例:

var x= (new Date()).getDay();
//获取今天的星期值,0为星期天
var y;

if ( (x==6) || (x==0) ) {
y="周末";
}else{
y="工作日";
}

console.log(y);

/*等价于

y="工作日";
if ( (x==6) || (x==0) ) {
y="周末";
}
console.log(y);  */

if-elif-else结构:

if (表达式1) {
语句1;
}else if (表达式2){
语句2;
}else if (表达式3){
语句3;
} else{
语句4;
}  

示例:

var score=window.prompt("您的分数:");

if (score>90){
ret="优秀";
}else if (score>80){
ret="良";
}else if (score>60){
ret="及格";
}else {
ret = "不及格";

}
alert(ret);

switch-case结构

switch基本格式
switch (表达式) {
case 值1:语句1;break;
case 值2:语句2;break;
case 值3:语句3;break;
default:语句4;
}

示例:

switch(x){
case 1:y="星期一";    break;
case 2:y="星期二";    break;
case 3:y="星期三";    break;
case 4:y="星期四";    break;
case 5:y="星期五";    break;
case 6:y="星期六";    break;
case 7:y="星期日";    break;
default: y="未定义";
}

switch比else if结构更加简洁清晰,使程序可读性更强,效率更高。  

4.3 循环结构  

for循环:

语法规则:

for(初始表达式;条件表达式;自增或自减)
{
执行语句
……
}

功能说明:实现条件循环,当条件成立时,执行语句1,否则跳出循环体

for循环的另一种形式:

for( 变量 in 数组或对象)
{
执行语句
……
}

while循环:  

语法规则:

while (条件){
语句1;
...
}

功能说明:运行功能和for类似,当条件成立循环执行语句花括号{}内的语句,否则跳出循环;同样支持continue与break语句。
示例:

var i=1;
while (i<=7) {
document.write("<H"+i+">hello</H "+i+"> ");
document.write("<br>");
i++;
}
//循环输出H1到H7的字体大小

4.4 异常处理  

try {
//这段代码从上往下运行,其中任何一个语句抛出异常该代码块就结束运行
}
catch (e) {
// 如果try代码块中抛出了异常,catch代码块中的代码就会被执行。
//e是一个局部变量,用来指向Error对象或者其他抛出的对象
}
finally {
//无论try中代码是否有异常抛出(甚至是try代码块中有return语句),finally代码块中始终会被执行。
}

注:主动抛出异常 throw Error('xxxx')

  

五 JavaScript的对象

  

  

 

 

http://www.cnblogs.com/yuanchenqi/category/1050263.html  

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: