js入门的心结

  学完了html和css的基础,现在开始接触js,刚开始有一种莫名的兴奋,直到接触了几天之后总感觉有点力不从心。

  JavaScript是一种脚本语言,它由LiveScript改名而来,可能是为了更好地推广这个脚本语言(利用Java语言的知名度),因此Netscape公司在最后一
  刻决定将它改名为JavaScript,但其实与Java没有什么关系。JavaScript是一种基于客户端浏览器的(现在也有服务器端,如NodeJS),基于对象、事
  件驱动式的脚本语言。JavaScript也具有跨平台的特点。如同所有的脚本语言,JavaScript是动态解释执行的。
   JavaScript是由Netscape公司发明的,最后交给欧洲计算机制造商协会(ECMA),之后ECMA将JavaScript标准化。在没有JavaScript之前,互联网页
  面都是静态内容,就像一张张写满内容的纸,Netscape公司为了丰富互联网功能,所以在浏览器中扩展了JavaScript支持,这样就大大扩展了互联网页
  面的功能,使得互联网可以拥有丰富多彩的动画和用户交互,所以其代码通常会嵌入在HTML页面中。

 

JavaScript的基本特点:
解释型脚本语言
程序不需要编译。
运行时才翻译成机器语言。
每执行一次就要翻译一次。所以,其效率低,并且依赖于解释器(如google的v8引擎),但是具有跨平台性(在各种浏览器下都支持,并且
在windows、linux等各个操作系统都能运行)。
弱类型语言,其变量在使用之前无须声明,由解释器在运行时检查其数据类型。
* 编译型语言:: 程序在执行之前 需要一个专门的编译过程 ,把程序编译成为机器语言 的文件,运行时不需要重新翻译,直接使用编译结果就行了。
程序执行效率高 ,依赖编译器,跨平台性差。如C、C++等等。
另外,编程语言分为两种,声明式编程和命令式编程。
我们可以像下面这样定义它们之间的不同:
命令式编程:命令“机器”如何去做事情(how),这样不管你想要的是什么(what),它都会按照你的命令实现。例如,常见的命令式编程语言有:
Java、C、C++、JavaScript、PHP等等。
声明式编程:告诉“机器”你想要的是什么(what),让机器想出如何去做(how)。例如,常见的声明式语言有:CSS、SQL。

2.2 JavaScript的运行
2.2.1 运行JavaScript
1.使用javascript:前缀构建执行JavaScript代码的URL。
<a href="javascript:alert('运行js!');"></a>
<form action="javascript:alert('运行js!');"></form>
2.绑定事件,在事件被触发的时候运行js代码。
<button onclick="alert('运行js!')"><button/>
3.在script元素中执行js代码。
<script type="text/javascript">
alert("运行js!");
</script>
4.引入外部js文件。
<script type="text/javascript" src="js文件所在的url路径"></script>
2.2.2 Hello world
1.输出hello world。
<!-- 在浏览器中弹出 -->
<script type="text/javascript">
alert("hello world!");
</script>
<!-- 在控制台中输出 -->
<script type="text/javascript">
console.info("hello world!");
</script>
<script type="text/javascript">
var data = prompt("请输入数据:");
console.info(data);
</script>2.3 JavaScript语法
2.3.1 注释
js支持两种格式的注释。在行尾“//”之后的文本都会被js当做注释忽略掉的。此外,“/* ”和“ */”之间的文本也会当做注释,这种注释可以跨行书写,单不
能有嵌套的注释。
以下注释都是合法的:
// 这里是单行注释
/* 这里也是单行注释 */
/*
这里是
多行注释
*/
2.3.2 关键字
js把一些标识符拿出来用作自己的关键字。因此,就不能再程序中把这些关键字用作标识符了。
break delete function return typeof
case do if switch var
catch else in this void
continue flase instanceof throw while
debugger finally new true with
default for null try
//在当前版本没有使用(也作为关键字),但是在未来版本可能会使用到的一些关键字
class const enum export import super
//此外,下面这些关键字在普通的JavaScript代码中是合法的,但是在【严格模式】下是保留字
implements let private public yield
interface package protected static
//【严格模式】同样对下面的标识符的使用做了严格限制,它们并不完全是保留字,但不能用做变量名、函数名和参数名
arguments eval
//【java】中的一些关键字
abstract double goto native static
boolean enum implements package super
byte export import private synchronized
char extends int protected throws
class final interface public transient
const float long short volatile
//js中预定义的一些【全局变量】和【函数】,应当避免把它们的名字用做变量名和函数名
arguments encodeURI Infinity Number RegExp
Array encodeURIComponent isFinite Object String
Boolean Error isNaN parseFloat SyntaxError
Date eval JSON parseInt TypeError
decodeURI EvalError Math RangeError undefined
decodeURIComponent Function NaN ReferenceError URIError

2.3.3 标识符
在js中,我们需要标识代码中的很多元素,包括函数名、变量名等。
我们选择的名称就称为标识符,并且必须遵循如下规则:标识符不能使用关键字
标识符可以包含字母、数字0-9、下划线(_)或美元符号($)。
标识符的第一个字符必须是一个字母、下划线或美元符号。
标识符是区分大小写的,并且没有规定最大长度。
如下标识符是合法的:
identifier userName1 User_name _sys_var1 $change Public
如下标识符不合法:
1_Name *system public
2.3.4 直接量和变量
1.直接量
12 //数字
1.2 //小数
"hello world" //字符串
true false //布尔值
/regex/ //正则表达式
2.变量
var x = 1;//变量x的值是数字直接量1
相当于数学里面的,设x=1。
2.3.5 语句
var num = 1;//声明语句
if (num === 1) {//if判断语句
alert(1);
}

 

    js有两种类型

1.基本类型:

number类型:包含整数和浮点数(即小数)。
boolean类型:只有true和false两个值。
string类型:字符串值必须用引号括起来,引号可以是单引号,也可以是双引号。
undefined类型:专门用来确定一个已经创建但是没有初始值的变量。
null类型:用于表明某个变量值为空。

引用类型:

原生对象:所谓原生对象是由JavaScript所提供的、独立于宿主环境(即浏览器)的对象,简单点说,就是在ECMA-262标准中定义的对象。它包
括:Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、EvalError、RangeError、ReferenceError、
SyntaxError、TypeError、URIError、Arguments、JSON。
内置对象:内置类对象JavaScript中提供的、独立于宿主环境对象,这些对象在JavaScript程序执行时就已经存在。内置对象实际上也是原生对象
的一种,但是与原生对象不同的是,内置对象不需要显式的初始化,因为它已经初始化了。ECMA-262中只定义了两个内置对象:Global和
Math。
宿主对象:宿主对象指与宿主环境即浏览器有关的对象。所有的BOM和DOM对象都是宿主对象。

数据类型转换:

 自动转换和强制转换

toString()函数
toString()方法是来自于原生对象Object,因所有对象都继承自Object,所以所有对象都有toString()方法。另外,由于boolean、number和string这三
个基本类型可看作伪对象,即可看成引用类型的Boolean、Number和String,所以也可使用toString()。
注:null和undefined没有toString()。

,Number类型的toString()方法比较特殊,它有两种模式,即默认模式和基模式。采用默认模式,toString()方法只是应用字符串输出数值。

2.转换成数字
parseInt和parseFloat是来源于内置对象Global的两个方法,而Number则是来源于原生对象Number。
parseInt()函数
parseInt() 方法首先查看位置 0 处的字符,判断它是否是个有效数字;如果不是,该方法将返回 NaN,不再继续执行其他操作。但如果该字符是有效数
字,该方法将查看位置 1 处的字符,进行同样的测试。这一过程将持续到发现非有效数字的字符为止,此时 parseInt() 将把该字符之前的字符串转换
成数字。
例如:
var num = parseInt("12345px");//返回12345
var num1 = parseInt("0xA"); //10
var num2 = parseInt("56.9"); //56
var num3 = parseInt("red"); //NaN
//基模式
var num4 = parseInt("10", 8); //8
parseFloat()函数
parseFloat() 方法与 parseInt() 方法的处理方式相似,从位置 0 开始查看每个字符,直到找到第一个非有效的字符为止,然后把该字符之前的字符串转
换成整数。 不过,对于这个方法来说,第一个出现的小数点是有效字符。如果有两个小数点,第二个小数点将被看作无效的。parseFloat() 会把这个
小数点之前的字符转换成数字。这意味着字符串 "11.22.33" 将被解析成 11.22。 使用 parseFloat() 方法的另一不同之处在于,字符串必须以十进制形
式表示浮点数,而不是用八进制或十六进制。该方法会忽略前导 0,所以八进制数 0102 将被解析为 102。对于十六进制数 0xA,该方法将返回 NaN,
因为在浮点数中,x 不是有效字符。(注释:经测试,具体的浏览器实现会返回 0,而不是 NaN。)
var fNum1 = parseFloat("12345red"); //返回 12345
var fNum2 = parseFloat("0xA"); //返回 NaN
var fNum3 = parseFloat("11.2"); //返回 11.2var fNum4 = parseFloat("11.22.33"); //返回 11.22
var fNum5 = parseFloat("0102"); //返回 102
var fNum1 = parseFloat("red"); //返回 NaN
Number()函数
Number() 函数的强制类型转换与 parseInt() 和 parseFloat() 方法的处理方式相似,只是它转换的是整个值,而不是部分值。 还记得吗,parseInt() 和
parseFloat() 方法只转换第一个无效字符之前的字符串,因此 "1.2.3" 将分别被转换为 "1" 和 "1.2"。 用 Number() 进行强制类型转换,"1.2.3" 将返回
NaN,因为整个字符串值不能转换成数字。如果字符串值能被完整地转换,Number() 将判断是调用 parseInt() 方法还是 parseFloat() 方法。
Number(false); //0
Number(true); //1
Number(undefined); //0
Number(null); //0
Number("1.2"); //1.2
Number("12"); //12
Number("1.2.3"); //NaN
Number(new object()); //NaN
Number(false); //0

1.条件运算符(三目运算)
三目运算符的语法格式如下:
(expression) ? if-true-statement : if-false-statement;
三目运算符的运算规则是:先对逻辑表达式expression求值,如果逻辑表达式返回true,则执行第二部分的语句;如果逻辑表达式返回false,则返回第
三部的语句。
例如:
5 > 3 ? alert("5大于3") : alert("5小于3");

posted @ 2015-12-27 15:45  会有那一天的  阅读(160)  评论(0编辑  收藏  举报