javascript高级编程笔记01(基本概念)

Posted 2020-08-04 核桃大号

1、在html中使用javascript

 1、  <script> 元素

     <script>定义了下列6个属性：

     async：可选，异步下载外部脚本文件。

     charset：可选，通过src属性指定代码的字符集，大多浏览器会忽略这个值，所以很少人使用

     language：已放弃

     src：可选，外部脚本的地址

     type：可选，现在不推荐用“text/javascript”，考虑到约定俗成和最大限度的浏览器兼容，目前type属性的值还是text/javascript，不过，这个属性并不是必需的，不设置值默认是text/javascript。

      在解析器对<script>元素内部的所有代码求值完毕以前，页面的其余内容都不会被浏览器加载或显示。

      按照惯例，所有的script元素都应该在页面的head元素中，但这种做法会导致要等全部JavaScript代码都被下载、解析和执行完成以后，才能开始呈现页面的内容，所以无疑会导致浏览器在呈现页面的时候出现明显的延迟，而延迟期间的浏览器窗口中将是一片空白，为了避免这个问题，现代web应用程序一般都把全部JavaScript引用放到body元素中页面的内容之后，

延迟加载：

Html4.0为script标签定义了defer属性，这个属性用途是表明脚步在执行时不会影响页面的构造，就是脚步会延迟到整个页面都解析完毕后再运行。

Html5规范要求脚本安装他们出现的先后顺序执行，单在现实中，延迟脚本不一定会安装顺序执行，因此最好只包含一个延迟脚本，ie4、firefox3.5、safari 5和Chorme是最早支持defer属性的浏览器，其他浏览器会忽略这个属性，像平常一样处理脚本，为此，把延迟脚本放到页面的底部仍然是最佳选择。

异步脚本：

Html5为script元素定义了async属性，就是异步加载，当然缺点也和ajax的异步请求一样，你无法确定脚本的执行顺序。异步脚本一定会再页面的load时间执行之前运行，单可能会再domconrentloaded（就是onload和jQuery ready的区别）事件触发之前或之后执行，支持异步脚本的浏览器有firefox3.6、safari5和chrome。

嵌入代码与外部文件：

在html中嵌入JavaScript代码虽然没有问题，但一般认为最好的做法还是尽可能使用外部文件来包含JavaScript代码，不过，并不存在必须使用外部文件的硬性规定（还是要看具体实际项目的具体情况，JavaScript的代码不是很多改成嵌入式对页面的影响也不是很大，加上现在电脑硬件设备越来越好，对于性能的消耗微乎其微，而且嵌入式同时也节省了请求，所以没必要一定要求就是引用外部文件，上次面试，面试官听到我一个项目用到的是嵌入式马上表现出鄙视是态度，我只想说用什么方式要看项目的侧重点，随便鄙视是你人品有问题），但支持使用外部文件的人多强调如下优点：

• 可维护性：遍及不同的html页面的JavaScript会造成维护问题，但把所有JavaScript文件都放在一个文件夹中，维护起来就轻松多了，
• 可缓存：浏览器能够根据具体的设置缓存链接的所有外部JavaScript文件。
• 适应未来：通过外部文件包含JavaScript无须使用前面提到xhtml或者注释back。

文档模式：

Ie5引入了文档模式的概念：而这个概念是通过使用文档类型切换实现的，最初的两种文档模式是：混杂模式（quirks mode）和标准模式（standards mode）。混杂模式会让ie的行为与（包含非标准特性的）ie5相同，而标准模式则让ie的行为更接近标准行为。虽然这两种模式主要影响css内容的呈现，单在某些情况下也会影响到JavaScript的解释执行。

在ie引入文档模式的概念后，其他浏览器也纷纷效仿，在此之后，ie又提出一种所谓的准标准模式（almost standards mode）。这种模式下的浏览器特性有很多都是符合标准的，单也不尽然，不标准的地方主要体现在处理图片间隙的时候（在表格中使用图片时问题最明显）。

如果在文档开始处没有发现文档类型声明，则所有浏览器都会默认开启混杂模式，单采用混杂模式不是什么值得推荐的做法，因为不同浏览器在这种模式下的行为差异飞车打，如果不使用hack（就是css的某些属性初始化赋值）技术，跨浏览器的行为根本就没有一致性可言。

代码。。。

<noscript>元素：这个很少有人用，就不记录了，有兴趣的可以去JavaScript高级编程设计第三版上看。

2、基本概念

（一些基本的简单语法我这里就不在记录下来了，只记录一些我觉得重要的一些知识点）

严格模式：

Es5(ECMAScript 5)引入了严格模式概念，严格模式是为JavaScript定义了一种不同的解析和执行模型，在严格模式下，es3中的一些不确定的行为将得到处理，而且对某些不安全的操作也会抛出错误，要在整个脚本中启用严格模式，可以再顶部添加如下代码：

“use strict”;

它是一个编译指示，用于高速支持的JavaScript引擎切换到严格模式。

严格模式下，JavaScript的执行结果会有很大不同，因此本书将会随时指出严格模式下的区别，支持严格模式的浏览器包括ie10+，firefox4+、safari5+、opera 12+和chrome。

 

数据类型：es中5种数据类型（也称为基本数据类型）：undefined、null、boolean、number、string和object，object本质上是由一组无序的名值对组成的，es不支持任何创建自定义类型的机制，而所有值最终将是上述6种数据类型之一。

 

Typeof操作符

使用typeof操作符可能返回下列某字符串：

“undefined”:undefined类型

“boolean”:布尔类型

“string”:字符串类型

“number”:数值类型

“function”:函数

“object”:对象或null

 

Undefined类型

Undefined类型只是一个值,在使用var声明变量但未对其加以初始化时,这个变量的值是undefined

注:对未初始化的变量执行fypeof操作符会返回undefined值,而对未声明的变量执行typeof操作符同样也会返回undefined值,如下代码:

Var message;

Alert(typeof message); //”undefined”

Alert(typeof age);//”undefined”

 

Null类型:

Null表示一个空对象指针,在使用typeof检测null时会返回”object”.

如果定义的变量准备在将来用于保存对象,那么最好将变量初始化为null而不是其他值,这样一来只要直接检查null值就可以知道相应的变量是否已经保存了一个对象的引用(但个人觉得其实也可以不初始化,因为在判断上null==undefined的,所以用于检查的null和undefined的基本是一样的).

 

Boolean类型

注意:boolean类型的字面值true和false是区分大小写的,也就是说,True和False都不是Boolean值,

虽然boolean类型的字面值只有两个,但es中所有类型的值都有与这两个boolean值等价的值,可以调用Boolean()函数转换.

数据类型	转换为true的值	转换为false值
Boolean	True	False
String	任何非空字符串	空字符串
Number	任何非零数字值	0和NaN
Object	任何对象	Null
Undefined		Undefined

 

Number类型

1. NaN

NaN,即非数值是一个特殊的数值,这个数值用于表示一个本来要返回数值的操作数未返回数值的情况,NaN本身有两个非同寻常的特点,第一:任何涉及NaN的操作都会返回NaN,第二:NaN与任何值都不相等.

针对NaN的两个特点,es定义了isNaN()函数,这个函数接受一个参数,该参数可以是任何类型,而函数会帮我们确定这个参数是否”不是数值”. isNaN()在接收一个值之后会尝试能不能把这个值转换成数值,在检测.

1. 数值转换

有3个函数可以吧非数值转换为数值:Number(),parseInt()和parseFloat()

Number()函数的转换规则:

• 可以接收任何类型参数
• 如果是Boolean值,true和false转换为1和0;
• 如果是数值,只是简单的传入和返回;
• 如果是null值,返回0;
• 如果是undefined,返回NaN;
• 如果是字符串,遵循下列规则:

1. 如果是字符串中只包含数字,则将其转换为十进制值;
2. 如果字符串中包含有效的浮点格式,则将其转换为对应的浮点值;
3. 如果字符串包含有效的十六进制格式,则将其转换为相同大小的十进制值;
4. 如果字符串是空的,则转换为0
5. 如果字符串包含除上述之外的字符,则转换为NaN;

• 如果是对象,则会调用对象的valueOf()方法,然后依照前面的规则转换返回的值,如果转换的结果是NaN,则调用对象的toString()方法,然后再次依照前面的规则转换返回的字符串值;