JavaScript入门学习笔记（1）—— 基本概念-CSDN博客

本文链接：https://blog.csdn.net/joy_fun/article/details/52078584

概念

JavaScript是一种专为与网页交互而设计的脚本语言，由三个部分组成：
1. ECMAScript（核心）：由ECMA-262定义，提供核心语言功能；
2. DOM（文档对象模型）：提供访问和操作网页内容的方法和接口；
3. BOM（浏览器对象模型）：提供与浏览器交互的方法和接口。

html && JavaScript

使用<script> 元素向html页面中插入JavaScript。其方式两种：

直接在页面中嵌入JavaScript代码

<script type = "text/javascript">
    function sayHi(){
        alter("Hello world!");
}
</script>

包含外部JavaScript文件

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

备注：
1. 包含在<script> 元素内部的JavaScript代码将被从上至下依次解析执行。
2. 带有src属性的<script>元素不应该在其<script>和</script>之间再包含额外嵌入的JavaScript代码。如果包含嵌入代码，则只会下载并执行外部脚本文件，嵌入代码会被忽略。
3. 如果在文档的<head>元素中包含所有 JavaScript文件，意味着必须等到全部JavaScript代码都被下载，解析和执行完成后，才开始呈现页面的内容，这会导致浏览器在呈现页面时会出现明显的延迟，期间浏览器窗口为空白。所以web应用程序一般都把全部JavaScript代码放在</body>元素内容后面。

属性

HTML 4.01 为<script>定义了6个属性：

async : 立即下载脚本，但不妨碍页面其他操作（下载其他资源或等待加载其他脚本），只对外部脚本文件有效。
charset : 表示通过src属性制定代码的字符集。（大多数浏览器会忽略它的值，很少有人用）
defer : 表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
language : 原来用于表示编写代码使用的脚本语言。已弃用
src : 表示包含要执行代码的外部文件。
type : 表示编写代码使用脚本语言的内容类型（也称MIME类型）。

延迟脚本defer：脚本被延迟到整个页面都解析完毕后再运行，按照其在页面中指定的顺序执行。

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

异步脚本async：不让页面等待脚本的下载和执行，异步加载页面其他内容，不能保证异步脚本按照其在页面中指定的顺序执行。

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

使用JavaScript外部文件优于嵌入JavaScript代码：

可维护性。集中JavaScript文件于一个文件夹中，方便编辑维护代码。
可缓存。如果有两个页面都使用同一个文件，此文件只需下载一次，能够加快页面加载速度。

数据类型

ECMAScript包括6种数据类型，且不支持任何创建自定义类型，所有值都为6种数据类型之一：
基本数据类型： Undefined, Null, Boolean, Number, String;
复杂数据类型：Object

Undefined

－在使用var声明变量但未对其加以初始化，这个变量的值就是undefined(Undefined类型只有一个值)。
－注意包含undefined值的变量与尚未定义变量区别：

var message; // 这个变量声明默认取得了undefined值

alert(message);  //"undefined"
alert(age);     //未声明"age"变量，产生错误

/*用typeof操作符检测其数据类型*/
alert(typeof message);  //"undefined"
alert(typeof message);  //"undefined"

var message = null;
alert(typeof message);  //"object"

Boolean

－Boolean类型只有两个字面值： true 和 false：

这两个字面值与数字值不能等价，ture/false不一定等于1/0；
这两个字面值区分大小写（True & False 都不是Boolean值，只是标识符）。
要将一个值转换为其对应的Boolean值可以调用转型函数Boolean( )：

var message = "Hello world!";
var messageAsBoolean = Boolean(message);

确定返回的Boolean值为false还是true，取决于要转换值的数据类型及实际值，如下：

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

Null

－空对象指针，用typeof操作符检测null会返回”object”。

var message = null;
alert(typeof message);  //"object"

如果定义的变量准备在将来用于保存对象，将其初始化为null，直接检查null值判断相应变量是否已经保存了一个对象引用。

Number

－ NaN: 即非负数值（Not a Number）表示一个本来要返回数值操作数未返回数值的情况,避免抛出错误。例：任何数值除以0在ECMAScript中返回NaN,不会影响代码执行。

任何涉及NaN操作，都会返回NaN（在多部计算中有可能会导致问题）；
NaN与任何值都不相等，包括NaN本身。

－ isNaN( )函数：确定传入函数参数是否“不是数值“。例：

alert(isNaN(NaN));      //true
alert(isNaN(10));       //false(10为一个数值)
alert(isNaN("10"));     //false(可以被转换成数值10）
alert(isNaN("blue"));   //true(不能转换成数值)
alert(isNaN("true"));   //false(可以被转换成数值1）

－数值转换函数（将非数值转换为数值）：
number( ): 用于任何数据类型的转型函数，转型规则如下:

传入Boolean: (true/false)，返回1/0;
传入null ，返回 0;
传入undefined, 返回NaN;
传入字符串，返回 1）将字符串中数字转换为十进制数，2）空字符串转换为0， 3）包含非数字字符，转换为NaN 。
传入对象，调用valueof( )方法后转换返回值，如果转换结果为NaN,则调用toString( )方法后再转换返回字符串。

var num1 = Number("Hello world!");  //NaN
var num2 = Number("");              //0
var num3 = Number("000011");        //11
var num4 = Number(true);            //1

parseInt( ): 专门用于把字符串转换为数值，规则如下：

忽略字符串前面空格，直到找到第一个非空格字符；
如果第一个字符不是数字字符或者负号，函数返回NaN(转换空字符串，返回NaN);
如果第一个字符是数字字符，函数会继续解析第二个字符，直到解析完所有后续字符或者遇到了一个非数字字符；
函数能够识别各种整数格式（十进制，八进制，十六进制）

var num1 = parseInt("1234blue");    //1234
var num2 = parseInt(" ");           //NaN
var num3 = parseInt("0XA");         //10(十六进制转十进制)
var num4 = parseInt("22.5");        //22

利用函数提供第二个参数（转换前的进制数）来转换成十进制数：

var num1 = parseInt("AF", 16);  //175(解析十六进制数成十进制数)
var num1 = parseInt("AF");      //NaN

String

－ String用于表示由16位Unicode字符组成的字符序列，可以由双引号或单引号表示。
－ ECMAScript中的字符串不可改变，要改变某个变量保存的字符串，首先要销毁原来的字符串，然后再用一个包含新值的字符串填充该变量，例：

var lang = "Java";
lang = lang + "Script";

－将一个值转换为字符串有两种方式：
1）toString( )方法(数值，布尔值，对象和字符串值都有toString( )方法，但null 和 undefined值没有这个方法)

var age = 11;
var ageToString = age.toString( );      //字符串"11"
var found = ture;
var foundToString = found.toString( );  //字符串"ture"

toString( )方法可以传递参数表示输出以传递参数的数值为进制数的字符串：

var num = 10;
alert(num.toString());      //"10"
alert(num.toString(2));     //"1010"
alert(num.toString(8));     //"12"
alert(num.toString(10));    //"10"
alert(num.toString(16));    //"a"

2） String( ):能将任何类型的值转换为字符串。例：

var value1 = 10;
var value2 = ture;
var value3 = null;
var value4;

alert(String(value1));  //"10"
alert(String(value2));  //"ture"
alert(String(value3));  //"null"
alert(String(value4));  //"undefined"