js基础知识（一）

2020-07-10  本文已影响0人  北风吹_yfy

一、JavaScript简介

JavaScript从一个简单的输入验证器发展成为一门功能全面的编程语言，能够处理复杂的计算和交互，拥有了闭包、匿名（lamda， 拉姆达）函数，甚至元编程等特性。作为 Web 的一个重要组成部分，JavaScript的重要性是不言而喻的， 就连手机浏览器，甚至那些专为残障人士设计的浏览器等非常规浏览器都支持它。
JavaScript由三个部分组成：ECMAScript（JS规范）、DOM（文档对象模型）、BOM（浏览器对象模型）
ECMAScript：提供核心语言功能，所有浏览器对ES3大体都支持，对ES5的支持程度越来越高；
DOM：：提供访问和操作网页内容的方法和接口，大部分浏览器几乎都支持DOM1级，2、3级的支持相差较大；
BOM：提供与浏览器交互的方法和接口，在HTML5之前没有统一的标准，每个浏览器有自己的实现标准；HTML5纳入BOM标准，有望朝着兼容性越来越高的方向发展；

二、在 HTML 中使用 JavaScript

1、<srcript>元素属性：
async ：异步加载（可选）
charset ：字符编码，但大部分浏览器会忽略它的值 （可选）
type：默认为 text/javascript （可选）
defer ：文档完全被解析和显示之后再加载 （可选）
language：使用的脚本语言，但大部分浏览器会忽略这个属性 （已废弃）
src：表示包含要执行代码的外部文件，该属性可以实现跨域。 （可选）

<script type="text/javascript" src="http://www.somewhere.com/afile.js"></script>

2、延迟脚本 defer="defer"的<script>脚本不一定会按照出现的先后顺序执行，也不一定会在DOMContentLoaded触发前执行，因此最好只包含一个延迟脚本。

3、异步脚本async="async"的异步脚本一定会在页面的load事件前执行，但可能会在DOMContentLoaded事件触发之前或之后执行，支持异步脚本的浏览器有：Firefox3.6、safari5和Chrome。

4、<script></script>的位置
按照传统的做法，所有外部文件（包括 CSS文件和 JavaScript文件）的引用元素都放在页面的<head>元素中，在文档的<head>元素中包含所有 JavaScript文件，意味着必须等到全部 JavaScript代码都被下载、 解析和执行完成以后，才能开始呈现页面的内容（浏览器在遇到<body>标签时才开始呈现内容）。
对于 那些需要很多 JavaScript 代码的页面来说，这无疑会导致浏览器在呈现页面时出现明显的延迟，而延迟 期间的浏览器窗口中将是一片空白。为了避免这个问题，现代 Web 应用程序一般都把全部 JavaScript引 用放在<body>元素中页面内容的后面。

5、文档模式（DOCTYPE），分混杂模式（quirks mode）和标准模式（standards mode），IE5.5引入文档模式概念
混杂模式：让IE的行为与IE5相同
标准模式：让IE的行为更接近标准行为

这两种模式主要影响 CSS 内容的呈现，但在某些情况下也会影响到 JavaScript 的解释执行。

// 对于标准模式，可以通过使用下面任何一种文档类型来开启： 
 
<!-- HTML 4.01 严格型 --> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
 
<!-- XHTML 1.0 严格型 --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
 
<!-- HTML 5 --> <!DOCTYPE html> 
// 如果在文档开始处没有发现文档类型声明，则所有浏览器都会默认开启混杂模式。

6、<noscript>：
浏览器不支持js脚本或者js脚本被禁用时，显示<noscript>中的内容，浏览器支持且没被禁用js脚本时则不显示里面的内容。

三、基本概念

1、语法
// 单行注释 
 块级注释以一个斜杠和一个星号（/*）开头，以一个星号和一个斜杠（*/）结尾，如下所示： 
 
/* *  这是一个多行 *  （块级）注释 */
2、变量

定义变量时要使用 var 操作符（注意 var 是一个关键 字），后跟变量名（即一个标识符），如下所示： var message;
未经过初始化的 变量，会保存一个特殊的值——undefined
注意：用 var 操作符定义的变量将成为定义该变量的作用域中的局部变量。也就是说， 如果在函数中使用 var 定义一个变量，那么这个变量在函数退出后就会被销毁。如果省略 var 操作符，就是创建一个全局变量。

3、数据类型

ECMAScript中有 5种简单数据类型（也称为基本数据类型）：Undefined、Null、Boolean、Number 和String。还有1种复杂数据类型——Object，Object 本质上是由一组无序的名值对组成的。

var message = "some string"; alert(typeof message);     // "string" alert(typeof(message));    // "string" 
alert(typeof 95);          // "number" 

Boolean                true                    false

string                非空字符串                 “”（空字符串）

Number                非0值                     0和NaN

Object                非null对象                null

Undefined                                      undefined

注意：浮点型的最高精度为17，故0.1+0.2不等于0.3，而是 0.30000000000000004，所以不要判断 0.1+0.2 == 0.3，使用 IEEE754 格式表示的数值会有舍入误差。

  1. 字符串是不可变的
    即字符串一旦创建，它们的值就不能改变。要改变 某个变量保存的字符串，首先要销毁原来的字符串，然后再用另一个包含新值的字符串填充该变量， 例如：
var lang = "Java"; lang = lang + "Script";

2.转换为字符串
要把一个值转换为一个字符串有两种方式。第一种是使用几乎每个值都有的 toString()方法。这个方法唯一要做的就是返回相应值的字符串表现。
数值、布尔值、对象和字符串值（没错，每个字符串也都有一个 toString()方法，该方法返回字 符串的一个副本）都有 toString()方法。但 null 和 undefined 值没有这个方法。
可以传递一个参数：输出数值的基数。默认情况下，toString()方法以十进制格式返回数值的字符串表 示。而通过传递基数，toString()可以输出以二进制、八进制、十六进制，乃至其他任意有效进制格 式表示的字符串值。下面给出几个例子：

var age = 11; var ageAsString = age.toString();         // 字符串"11" var found = true; var foundAsString = found.toString();     // 字符串"true" 
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"

在不知道要转换的值是不是 null 或 undefined 的情况下，还可以使用转型函数 String()，这个 函数能够将任何类型的值转换为字符串。
String()函数遵循下列转换规则：
 如果值有 toString()方法，则调用该方法（没有参数）并返回相应的结果；
 如果值是 null，则返回"null"；
 如果值是 undefined，则返回"undefined"。

var o = new Object()

Object 的每个实例都具有下列属性和方法。
 constructor：保存着用于创建当前对象的函数。对于前面的例子而言，构造函数（constructor） 就是 Object()。
 hasOwnProperty(propertyName)：用于检查给定的属性在当前对象实例中（而不是在实例 的原型中）是否存在。其中，作为参数的属性名（propertyName）必须以字符串形式指定（例 如：o.hasOwnProperty("name")）。
 isPrototypeOf(object)：用于检查传入的对象是否是传入对象的原型
 propertyIsEnumerable(propertyName)：用于检查给定的属性是否能够使用 for-in 语句来枚举。与 hasOwnProperty()方法一样，作为参数的属性名必须以字符 串形式指定。
 toLocaleString()：返回对象的字符串表示，该字符串与执行环境的地区对应。
 toString()：返回对象的字符串表示。
 valueOf()：返回对象的字符串、数值或布尔值表示。通常与 toString()方法的返回值 相同。

var a = 1
var b = ++a +3   // 5
var c = 1
var d = c-- +3   // 4
4、语法
  1. if语句
if (i > 25) {    
    alert("Greater than 25."); 
} else if (i < 0) {     
     alert("Less than 0."); 
} else {
     alert("Between 0 and 25, inclusive."); 
}
  1. do-while语句
    do-while 语句是一种后测试循环语句，即只有在循环体中的代码执行之后，才会测试出口条件。 换句话说，在对条件表达式求值之前，循环体内的代码至少会被执行一次。
var i = 0; 
do {
    i += 2;
 } while (i < 10); 
 
alert(i);
  1. while语句
    while 语句属于前测试循环语句，也就是说，在循环体内的代码被执行之前，就会对出口条件求值。 因此，循环体内的代码有可能永远不会被执行。
var i = 0; while (i < 10) { 
      i += 2; 
}
  1. for语句
    for 语句也是一种前测试循环语句，但它具有在执行循环之前初始化变量和定义循环后要执行的代 码的能力。
var count = 10; 
for (var i = 0; i < count; i++){ 
    alert(i); 
}

此外，for 语句中的初始化表达式、控制表达式和循环后表达式都是可选的。将这三个表达式全部 省略，就会创建一个无限循环，例如：

for (;;) {  
 // 无限循环     
doSomething(); 
} 
// 而只给出控制表达式实际上就把 for 循环转换成了 while 循环，
var count = 10; 
var i = 0;
for (; i < count; ){
     alert(i);
     i++;
 }
  1. for-in语句
    for-in 语句是一种精准的迭代语句，可以用来枚举对象的属性。
for (var propName in window) {
      document.write(propName); 
}

但是，如果表示要迭代的对象的变量值为 null 或 undefined，for-in 语句会抛出错误。 ECMAScript 5更正了这一行为；对这种情况不再抛出错误，而只是不执行循环体。为了保证大限度的兼容性，建议在使用 for-in 循环之前，先检测确认该对象的值不是 null 或 undefined。

  1. break和continue语句
    break 和 continue 语句用于在循环中精确地控制代码的执行。其中，break 语句会立即退出循环， 强制继续执行循环后面的语句。而 continue 语句虽然也是立即退出循环，但退出循环后会从循环的顶 部继续执行。

  2. switch语句
    switch 语句与 if 语句的关系为密切，而且也是在其他语言中普遍使用的一种流控制语句。 ECMAScript中 switch 语句的语法与其他基于 C的语言非常接近，如下所示：

switch (expression) {
   case value: statement
      break;   
   case value: statement 
      break;
   case value: statement
      break;
   case value: statement
      break; 
   default: statement 
}

5、函数

ECMAScript中的函数使用 function 关键字来声明，后跟一组参数以及函数体。

function functionName(arg0, arg1,...,argN) {
     statements
}

严格模式对函数有一些限制：
 不能把函数命名为 eval 或 arguments；
 不能把参数命名为 eval 或 arguments；
 不能出现两个命名参数同名的情况。
如果发生以上情况，就会导致语法错误，代码无法执行。

ECMAScript 函数不能像传统意义上那样实现重载。如果在 ECMAScript中定义了两个名字相同的函数，则该名字只属于后定义的函数。

上一篇 下一篇

猜你喜欢

热点阅读