码迷,mamicode.com
首页 > Web开发 > 详细

JS基础-变量及输入输出和运算符的使用

时间:2017-09-03 18:48:57      阅读:194      评论:0      收藏:0      [点我收藏+]

标签:obj   htm   链接   匈牙利   tar   blank   ack   pre   html标签   

一、什么是JavaScript?

再讲JS的基础之前,先让我们了解一下什么是JS吧。

JS,全称JavaScript。是t一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。


 

二、使用JS的三种方式

1、在HTML标签中直接内嵌JS():并不提倡使用。
  

<button onclick="alert(‘小婊砸!你真点啊!‘)">有本事点我啊!!</button>

  >>>不符合w3c内容与行为分离的要求!!!


2、在html页面中使用<script></script>包裹JS代码:

  < script type="text/javascript">
    //JS代码;
  </script>

  >>>Script标签可以放到页面中的任何位置。

3、引入外部的JS文件,使用<script></script>标签:

<script language="JavaScript" src="js/01.js"></script>

[注意事项]
①<script></script>可以嵌入到页面的任意位置。但是,位置的不同会导致JS代码的执行顺序不同
  比如<script></script>放到<body>前面,则JS代码会在页面加载之前就执行
②引入外部的JS代码,<script></script>必须是成堆的标签。而且,标签中不能再有任何的代码。


三、JS中的变量

1、JS中变量声明的写法;
  var num = 10; //使用var声明的变量,属于局部变量,只在当前作用域内有效。
  num = 10; //不用var声明的变量,默认为全局变量,在整个JS文件中都有效。
  var = x=8,y,z=10; //使用一行语句同时声明多个变量。上式中,y属于已声明,但未赋值状态,结果为undefined;

[声明变量的注意事项]
  ①JS中所有变量的声明,均使用var关键字。变量具体是什么数据类型,取决于给变量赋值的类型;
  ②JS中同一个变量,可以在多次不同赋值时,修改变量的数据类型;
  var a = 10; //从初始声明,是a属于整数型;
  a = "哈哈哈"; //重复赋值时,整数型的a被修改为字符串类型;
  ③变量可以使用var声明,也可以不实用var声明。

  [区别]使用var声明为局部变量,不实用var声明为全局变量;

  ④只用var声明,但是不赋值,结果为undefined;
  例如: var a; // a为undefined。但是,如果不声明也不赋值的a,直接使用会报错。
  ⑤同一变量名可以多次使用var声明。但是,后面的var并没有任何卵用。第二次再使用var声明时,只会被理解为普通的赋值操作。

 

2、变量名的命名要求:
  ①变量名,只能有字母、数字、下划线组成;
  ②开头 不能是数字;
  ③变量名区分大小写,大写字母与小写字母为不同变量;

 

3、变量名的命名规范:
  ①要符合小驼峰法则:
  首字母小写,之后每个单词的首字母大写;var myNameIsSong = 1; ?
  ②或者使用匈牙利命名法:
  所有字母小写,单次之间用_分隔;var my_name_is_song = 1; ?
  ③var mynameissong = 1; ?,能用,但是不规范。
  

4、JS中的数据类型

  ①Undefined:未定义。已经使用var声明的变量,但是没有赋值。如,var a;
  ②Null:表示空的引用。
  ③boolean:布尔类型。表示真假,只有两个值: true/false
  ④Number:数值类型。可以是整数,也可以是小数;
  ⑤String:字符串类型。用双引号或单引号包裹的内容,称为字符串;
  ⑥Object:对象类型。

 

5、常用的数值函数
  ①isNaN(): 判断一个变量或常量,是否是NaN(not a num 非数值);
    使用isNaN()判断时,会尝试 使用Number()函数进行转换,如果最终结果能够转为数字,则不是NaN,结果为false。
  ②Number()函数: 将其他类型的数据,尝试转为数值型;

  var num = 1;
  alert(Number(num));

[字符串类型]
  >>>字符串为纯数值字符串,会转为对应的数字;"111"->111
  >>>字符串为空字符串,会转为0; ""->0
  >>>字符串包含任何其他字符串时,都不能转; "1a"->NaN
  
[布尔类型]
  true -> 1; false -> 0

[Null/Undefined]
   Null -> 0; Undefined -> 1

[Object]

  ③ ParseInt(): 将字符串转为整数类型;
  >>>純数值字符串,能转。 "12" -> 12; "12.9" -> 12;(小数转化时,直接抹掉小数点,不进行四舍五入)
  >>>空字符串,不能转,"" -> NaN
  >>>包含其他字符的字符传,会截取第一个非数值字符串前的数字部分;"123a456" -> 123; "a123b456" -> NaN
  >>>PassInt()只能转字符串,转其他类型,全是NaN。

[Number函数与ParseInt函数的区别]
  1、Number函数能转各种数据类型,ParseInt函数只能转字符串。
  2、两者在转字符串时,结果不完全相同。(详见上面解释)
  
   ④ParseFloat:将字符串转为数值型;
  转换规则与ParseInt相同,值是如果有小数,则保留小数点:如果没有小数,则依然是正数
   "12.5" -> 12.5; "12" -> 12;
  
  ⑤typeof:检测变量的数据类型:
   字符串 -> String          未定义 -> Undefined        true/flase -> Boolean
   数值 -> Number          对象/Null -> Object           函数 -> function


四、JS中常用的输入输出语句

1、document.write(); 将()中的内容打印输出到浏览器屏幕上;
  使用时需注意:除变量/常量外的所有内容,必须放到""中。变量和常量必须放到""外面
  
  如果同时有变量和字符串,必须用+链接;

var num1 = prompt("请输入第一个数");
var num2 = prompt("请输入第二个数");
var sum  = parseFloat(num1) + parseFloat(num2)
alert("结果是"+sum);

  2、alert():使用弹窗输出;
  弹窗警告,()中的内容与上述要求相同。
  3、promt(); 弹窗输入;
    接受两部分参数:
    ①输入框上面的提示内容,可选;
      ②输入框里面的默认信息,可选;
    当只写一部分时,表示输入框上面的提示内容;
  可以定义变量,接收输入的内容。点击确定按钮,变量将被赋值为输入的内容,点击取消按钮,变量将被赋值为null。
  输入内容时,默认接收的数据类型都是字符串!!!


五、运算符的使用

1、算术运算(单目运算符)
+ 加、 -减、 *乘、 /除、 %取余、 ++ 自增、 --自减
  >>> +:有两种作用,链接字符串/加法运算。当+两边全为数字时,运行加法运算;
    当+两边有任意一边为字符串时,起链接字符串的作用,链接之后的结果为字符串。
    除+外,其余符号运算时,会先尝试将左右变量用Number函数转为数字。
  >>> /:结果将会保留小数点。
  >>> ++:自增运算符,将变量在原有基础上+1。
  >>> --:自减运算符,将变量在原有基础上-1。

【a++和++a的异同】
  ①相同点:无论是a++还是++a,运算完以后,a的值均会+1;
  ②不同点:a++,先用a的值去运算,再把a+1;
       ++a,先把a+1,在用a+1以后的值去运算;

<script type="text/javascript">
    var a= 3,b,c;
    b = a++ +2;   //先用a运算,b=3+2  再把a+1,a+4
    c = ++a +2;   //先把a+1,a=5,在用a+1以后的值去运算,c5+2
    alert(a)
    alert(b)
    alert(c)
</script>

2、 赋值运算
= 赋值、 += -= *= /= %=

  +=: a+=b;相当于 a=a+b;但是,前者的运算效率要比后者快,所以推荐使用+=的写法;

  其余的运算符类似。

3、关系运算
== 等于、===全等(严格等于)、 != 不等、 !== 不全等、 >、<、>=、<=

  >>>关系运算符,运算之后的结果,只能Boolean类型
  >>>判断一个数字是否处于某个区间,必须用&&链接;
  a<10 && a>0;? 10>a>0;?
  >>> ===:严格等于;要求不但要类型相同,值也必须相同;类型不同,结果直接为false;类型相同,在进行下一步判断;
    ==: 等于。类型相同,与===效果一样。类型不同时会先尝试用Number函数将两边转为数字,然后再进行判断。
      但是有个别特例,如: Null==false;? Null==Undefined;?

 

4、条件运算符(多目运算)
a>b?true:false

  有两个重要符号:
  当?前面部分运算结果为true时,执行:前面的代码
  当?前面部分运算结果为false时,执行:后面的代码
  冒号两边可以为数值,则整个式子可用于赋值。var a = 1<2?1:2;
  冒号两边可以为代码块,将直接执行代码。1<2?alert(1):alert(2);
  多目运算符可以多层嵌套。var a = 1<2?alert(1):(1>0?4:5);

 

5、位运算符、 逻辑运算符
&&与、 ||或 、!非

  &&: 两边都成立,结果为true
  ||: 两边有任意一边成立,结果为true

6、运算符的优先级:
()                       //小括号最高
! 、++ 、 --                //单目运算符
* 、 / 、 %
+ 、 -
> 、 < 、 >= 、 <=
== 、 !=
&&                     //与或同时存在时,&&比||高
||
= 、 += 、 -= 、 *= 、 /=      //最低的是各种赋值

 

JS基础-变量及输入输出和运算符的使用

标签:obj   htm   链接   匈牙利   tar   blank   ack   pre   html标签   

原文地址:http://www.cnblogs.com/realsdg/p/7470317.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!