JavaScript(1)
2016-04-11 18:37
429 查看
JavaScript简介：
实现： 核心（ECMAScript）
文档对象模型（DOM）
浏览器对象模型（BOM）
在 HTML 中使用 JavaScript：
<script> 元素： 六个属性 async ：可选。表示应该立即下载脚本，但不应妨碍页面中的其他操作，只对外部脚本文件有效。
defer ：可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
src ：可选。表示包含要执行代码的外部文件。
type ：可选。 text/javascript
使用：直接写在页面<script type="text/javascript">
function sayHi(){
alert("Hi!");
}
</script>， 外部调用 <script type="text/javascript" src="http://www.somewhere.com/afile.js"></script>
位置：传统都在head里，但是先加载它，页面慢。可以加async（异步，加载期间不要修改DOM） defer属性。放在body页面最后。
<noscript> 元素：用以在不支持 JavaScript 的浏览器中显示替代的内容。这个元素可以包含能够出现在文档 <body> 中的任何 HTML 元素—— <script> 元素除外。包含
在 <noscript> 元素中的内容只有在下列情况下才会显示出来：
浏览器不支持脚本；
浏览器支持脚本，但脚本被禁用。
符合上述任何一个条件，浏览器都会显示 <noscript> 中的内容。而在除此之外的其他情况下，浏览器不会呈现 <noscript> 中的内容。
请看下面这个简单的例子：
<html>
<head>
<title>Example HTML Page</title>
<script type="text/javascript" defer="defer" src="example1.js"></script>
<script type="text/javascript" defer="defer" src="example2.js"></script>
</head>
<body>
<noscript>
<p> 本页面需要浏览器支持（启用）JavaScript 。
</noscript>
</body>
</html>
这个页面会在脚本无效的情况下向用户显示一条消息。而在启用了脚本的浏览器中，用户永远也不会看到它——尽管它是页面的一部分。
基本概念：
严格模式：严格模式是为 JavaScript 定义了一种不同的解析与执行模型。在严格模式下，ECMAScript 3 中的一些不确定的行为将得到处理，而且对某些不安全
的操作也会抛出错误。要在整个脚本中启用严格模式，可以在顶部添加如下代码： "use strict";
在函数内部的上方包含这条编译指示，也可以指定函数在严格模式下执行：
function doSomething(){
"use strict";
//函数体
}
typeof：var message = "some string";
alert(typeof message); // "string"
alert(typeof(message)); // "string"
alert(typeof 95); // "number"
语句：if do-while while for for-in(for-in 语句是一种精准的迭代语句，可以用来枚举对象的属性) label(使用 label 语句可以在代码中添加标签，以便将来使用) start: for (var i=0; i < count; i++) ..... 加标签一般与break continue连用，continue start。 break continue with(将代码的作用域设置到一个特定的对象中)
switch
变量、作用域和内存问题：
instanceof：虽然在检测基本数据类型时 typeof 是非常得力的助手，但在检测引用类型的值时，这个操作符的用处不大。通常，我们并不是想知道某个值是对象，而是想知道它是什么类型的对象。为此，ECMAScript提供了 instanceof 操作符，其语法如下所示：
result = variable instanceof constructor
with扩展作用域
引用类型：
Object 类型：var person = {
name : "Nicholas",
age : 29
}; person["first name"] = "Nicholas";由于 "first name" 中包含一个空格，所以不能使用点表示法来访问它。然而，属性名中是可以包含非字母非数字的，这时候
就可以使用方括号表示法来访问它们
Array 类型：所有对象都具有 toLocaleString() 、 toString() 和 valueOf() 方法。其中，调用数组的 toString() 方法会返回由数组中每个值的字符串形式拼接而成的一个以逗
号分隔的字符串。而调用 valueOf() 返回的还是数组。实际上，为了创建这个字符串会调用数组每一项的 toString() 方法。
栈方法：push(”xx“) pop（”xx“）
队列方法：push shift 还有unshift
重排序方法：values.reverse();
function compare(value1, value2) {
if (value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0;
}
}
values.sort(compare);
concat() 方法：可以基于当前数组中的所有项创建一个新数组。具体来说，这个方法会先创建当前数组一个副本，然后将接收到的参数添加到这个副本的末尾，最后返回新构建的数组。
splice() 方法：xx. splice(1,2,3) 至少指定1 2.1开始位置，2删除几项，均为数字，3插入的，可以多个，引号逗号隔开
位置方法： indexOf() 和 lastIndexOf() 1或2参数
迭代方法： every() ：对数组中的每一项运行给定函数，如果该函数对每一项都返回 true ，则返回 true 。
filter() ：对数组中的每一项运行给定函数，返回该函数会返回 true 的项组成的数组。
forEach() ：对数组中的每一项运行给定函数。这个方法没有返回值。
map() ：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。
some() ：对数组中的每一项运行给定函数，如果该函数对任一项返回 true ，则返回 true 。
以上方法都不会修改数组中的包含的值。
var everyResult = numbers.every(function(item, index, array){
return (item > 2);
});
归并方法： reduce() 和 reduceRight() 。这两个方法都会迭代数组的所有项，然后构建一个最终返回的值。
var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
return prev + cur;
});
alert(sum); //15
Date 类型：.....
RegExp 类型：var expression = / pattern / flags ; g ：表示全局（global）模式，即模式将被应用于所有字符串，而非在发现第一个匹配项时立即停止；
i ：表示不区分大小写（case-insensitive）模式，
m ：表示多行（multiline）模式，即在到达一行文本末尾时还会继续查找下一行中是否存在与模式匹配的项。
var pattern4 = /\.at/gi;
实例方法：exec() 接受一个参数，即要应用模式的字符串，然后返回包含第一个匹配项信息的数组；或者在没有匹配项的情况下返回 null 。返回的数组虽然
是 Array 的实例，但包含两个额外的属性： index 和 input 。其中， index 表示匹配项在字符串中的位置，而 input 表示应用正则表达式的字符
串。
构造函数：...
Function 类型：*1定义阶乘函数一般都要用到递归算法；如上面的代码所示，在函数有名字，而且名字以后也不会变的情况下，这样定义没有问题。但问题是这个函数的
执行与函数名 factorial 紧紧耦合在了一起。为了消除这种紧密耦合的现象，可以像下面这样使用 arguments.callee 。
前面曾经提到过，ECMAScript 中的函数是对象，因此函数也有属性和方法。每个函数都包含两个属性： length 和 prototype 。其中， length 属性表示函数希望接收的命名参数
prototype 是保存它们所有实例方法的真正所在。每个函数都包含两个非继承而来的方法： apply() 和 call() 。这两个方法的用途都是在特定的作用域中
调用函数，实际上等于设置函数体内 this 对象的值。首先， apply() 方法接收两个参数：一个是在其中运行函数的作用域，另一个是参数数组。其中，第
二个参数可以是 Array 的实例，也可以是arguments 对象。
基本包装类型：String Boolean Number
单体内置对象:ECMA-262 对内置对象的定义是：“由 ECMAScript 实现提供的、不依赖于宿主环境的对象，这些对象在 ECMAScript 程序执行之前就已经存在了。”意思就
是说，开发人员不必显式地实例化内置对象，因为它们已经实例化了。Global Math
面向对象的程序设计:
var person = {
name: "Nicholas",
age: 29,
job: "Software Engineer",
sayName: function(){
alert(this.name);
}
};
创建对象：工厂模式（return） 构造函数：（名字第一个字母大写，this）
原型模式：无论什么时候，只要创建了一个新函数，就会根据一组特定的规则为该函数创建一个 prototype属性，这个属性指向函数的原型对象。在默认情况
下，所有原型对象都会自动获得一个 constructor（构造函数）属性，这个属性包含一个指向 prototype 属性所在函数的指针。就拿前面的例子来说，
Person.prototype. constructor 指向 Person 。而通过这个构造函数，我们还可继续为原型对象添加其他属性和方法。
组合使用构造函数模式和原型模式：function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.friends = ["Shelby", "Court"];
}
Person.prototype = {
constructor : Person, ***
sayName : function(){
alert(this.name);
}
}
实现： 核心（ECMAScript）
文档对象模型（DOM）
浏览器对象模型（BOM）
在 HTML 中使用 JavaScript：
<script> 元素： 六个属性 async ：可选。表示应该立即下载脚本，但不应妨碍页面中的其他操作，只对外部脚本文件有效。
defer ：可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
src ：可选。表示包含要执行代码的外部文件。
type ：可选。 text/javascript
使用：直接写在页面<script type="text/javascript">
function sayHi(){
alert("Hi!");
}
</script>， 外部调用 <script type="text/javascript" src="http://www.somewhere.com/afile.js"></script>
位置：传统都在head里，但是先加载它，页面慢。可以加async（异步，加载期间不要修改DOM） defer属性。放在body页面最后。
<noscript> 元素：用以在不支持 JavaScript 的浏览器中显示替代的内容。这个元素可以包含能够出现在文档 <body> 中的任何 HTML 元素—— <script> 元素除外。包含
在 <noscript> 元素中的内容只有在下列情况下才会显示出来：
浏览器不支持脚本；
浏览器支持脚本，但脚本被禁用。
符合上述任何一个条件，浏览器都会显示 <noscript> 中的内容。而在除此之外的其他情况下，浏览器不会呈现 <noscript> 中的内容。
请看下面这个简单的例子：
<html>
<head>
<title>Example HTML Page</title>
<script type="text/javascript" defer="defer" src="example1.js"></script>
<script type="text/javascript" defer="defer" src="example2.js"></script>
</head>
<body>
<noscript>
<p> 本页面需要浏览器支持（启用）JavaScript 。
</noscript>
</body>
</html>
这个页面会在脚本无效的情况下向用户显示一条消息。而在启用了脚本的浏览器中，用户永远也不会看到它——尽管它是页面的一部分。
基本概念：
严格模式：严格模式是为 JavaScript 定义了一种不同的解析与执行模型。在严格模式下，ECMAScript 3 中的一些不确定的行为将得到处理，而且对某些不安全
的操作也会抛出错误。要在整个脚本中启用严格模式，可以在顶部添加如下代码： "use strict";
在函数内部的上方包含这条编译指示，也可以指定函数在严格模式下执行：
function doSomething(){
"use strict";
//函数体
}
typeof：var message = "some string";
alert(typeof message); // "string"
alert(typeof(message)); // "string"
alert(typeof 95); // "number"
语句：if do-while while for for-in(for-in 语句是一种精准的迭代语句，可以用来枚举对象的属性) label(使用 label 语句可以在代码中添加标签，以便将来使用) start: for (var i=0; i < count; i++) ..... 加标签一般与break continue连用，continue start。 break continue with(将代码的作用域设置到一个特定的对象中)
switch
变量、作用域和内存问题：
instanceof：虽然在检测基本数据类型时 typeof 是非常得力的助手，但在检测引用类型的值时，这个操作符的用处不大。通常，我们并不是想知道某个值是对象，而是想知道它是什么类型的对象。为此，ECMAScript提供了 instanceof 操作符，其语法如下所示：
result = variable instanceof constructor
with扩展作用域
引用类型：
Object 类型：var person = {
name : "Nicholas",
age : 29
}; person["first name"] = "Nicholas";由于 "first name" 中包含一个空格，所以不能使用点表示法来访问它。然而，属性名中是可以包含非字母非数字的，这时候
就可以使用方括号表示法来访问它们
Array 类型：所有对象都具有 toLocaleString() 、 toString() 和 valueOf() 方法。其中，调用数组的 toString() 方法会返回由数组中每个值的字符串形式拼接而成的一个以逗
号分隔的字符串。而调用 valueOf() 返回的还是数组。实际上，为了创建这个字符串会调用数组每一项的 toString() 方法。
栈方法：push(”xx“) pop（”xx“）
队列方法：push shift 还有unshift
重排序方法：values.reverse();
function compare(value1, value2) {
if (value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0;
}
}
values.sort(compare);
concat() 方法：可以基于当前数组中的所有项创建一个新数组。具体来说，这个方法会先创建当前数组一个副本，然后将接收到的参数添加到这个副本的末尾，最后返回新构建的数组。
splice() 方法：xx. splice(1,2,3) 至少指定1 2.1开始位置，2删除几项，均为数字，3插入的，可以多个，引号逗号隔开
位置方法： indexOf() 和 lastIndexOf() 1或2参数
迭代方法： every() ：对数组中的每一项运行给定函数，如果该函数对每一项都返回 true ，则返回 true 。
filter() ：对数组中的每一项运行给定函数，返回该函数会返回 true 的项组成的数组。
forEach() ：对数组中的每一项运行给定函数。这个方法没有返回值。
map() ：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。
some() ：对数组中的每一项运行给定函数，如果该函数对任一项返回 true ，则返回 true 。
以上方法都不会修改数组中的包含的值。
var everyResult = numbers.every(function(item, index, array){
return (item > 2);
});
归并方法： reduce() 和 reduceRight() 。这两个方法都会迭代数组的所有项，然后构建一个最终返回的值。
var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
return prev + cur;
});
alert(sum); //15
Date 类型：.....
RegExp 类型：var expression = / pattern / flags ; g ：表示全局（global）模式，即模式将被应用于所有字符串，而非在发现第一个匹配项时立即停止；
i ：表示不区分大小写（case-insensitive）模式，
m ：表示多行（multiline）模式，即在到达一行文本末尾时还会继续查找下一行中是否存在与模式匹配的项。
var pattern4 = /\.at/gi;
实例方法：exec() 接受一个参数，即要应用模式的字符串，然后返回包含第一个匹配项信息的数组；或者在没有匹配项的情况下返回 null 。返回的数组虽然
是 Array 的实例，但包含两个额外的属性： index 和 input 。其中， index 表示匹配项在字符串中的位置，而 input 表示应用正则表达式的字符
串。
构造函数：...
Function 类型：*1定义阶乘函数一般都要用到递归算法；如上面的代码所示，在函数有名字，而且名字以后也不会变的情况下，这样定义没有问题。但问题是这个函数的
执行与函数名 factorial 紧紧耦合在了一起。为了消除这种紧密耦合的现象，可以像下面这样使用 arguments.callee 。
前面曾经提到过，ECMAScript 中的函数是对象，因此函数也有属性和方法。每个函数都包含两个属性： length 和 prototype 。其中， length 属性表示函数希望接收的命名参数
prototype 是保存它们所有实例方法的真正所在。每个函数都包含两个非继承而来的方法： apply() 和 call() 。这两个方法的用途都是在特定的作用域中
调用函数，实际上等于设置函数体内 this 对象的值。首先， apply() 方法接收两个参数：一个是在其中运行函数的作用域，另一个是参数数组。其中，第
二个参数可以是 Array 的实例，也可以是arguments 对象。
基本包装类型：String Boolean Number
单体内置对象:ECMA-262 对内置对象的定义是：“由 ECMAScript 实现提供的、不依赖于宿主环境的对象，这些对象在 ECMAScript 程序执行之前就已经存在了。”意思就
是说，开发人员不必显式地实例化内置对象，因为它们已经实例化了。Global Math
面向对象的程序设计:
var person = {
name: "Nicholas",
age: 29,
job: "Software Engineer",
sayName: function(){
alert(this.name);
}
};
创建对象：工厂模式（return） 构造函数：（名字第一个字母大写，this）
原型模式：无论什么时候，只要创建了一个新函数，就会根据一组特定的规则为该函数创建一个 prototype属性，这个属性指向函数的原型对象。在默认情况
下，所有原型对象都会自动获得一个 constructor（构造函数）属性，这个属性包含一个指向 prototype 属性所在函数的指针。就拿前面的例子来说，
Person.prototype. constructor 指向 Person 。而通过这个构造函数，我们还可继续为原型对象添加其他属性和方法。
组合使用构造函数模式和原型模式：function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.friends = ["Shelby", "Court"];
}
Person.prototype = {
constructor : Person, ***
sayName : function(){
alert(this.name);
}
}
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- js: how to get length of dict
- jsp中获取客户ip及其他资料的方法
- 【JS】:JS做的一个闹钟
- Jsp基础
- javascript学习笔记w3chool
- 【js】:js中对于两种控件不同的值得显示方法
- enum枚举定义转json
- 最近兰州的js风格写个插件和一个template engine
- [转]深入详解javascript之delete操作符
- Json.NET
- DataTable.js
- [代码片段]javascript检查图片大小和格式
- [JS]js来取iframe框架中的内容源代码参考
- 如何用js得到当前页面的url信息方法(JS获取当前网址信息)
- JavaScript cookie存储和读取（一）
- js 静止f1到f12 和屏蔽鼠标右键
- JS中六种数据类型（三）——Boolean
- 中缀表达式转后缀表达式（用于求字符串表达式值）（js栈和队列的实现是通过数组的push和unshift方法插值，pop方法取值）
- Javascript 函数和模块定义
- JSON数据解析