Javascript 基础学习——周总结：

1.tostring()方法：

我们在页面中打印一个函数对象时，输出的其实是该对象 tostring()方法的返回值
如果想要输出指定对象的具体属性，可以修改该对象的原型对象中的string（）方法，利用this输出对象所包含的属性

2.有关JS中数组的基本知识和操作方法：

2.3数组简介

数组是一种特殊类型的对象。在 JavaScript 中对数组使用 typeof 运算符会返回 “object”
因此，数组中的元素可以使 任意数据类型，可以是一个函数，乃至一个对象

数组的属性：
length属性：
返回数组的长度（数组元素的数目）
而且这个属性不是只读的，也可以通过length属性来设置数组的长度（以实现删除或增加元素，但是未初始化的元素将会被定义成undefined）

应用：遍历数组：

var fruits, text, fLen, i;

fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
    
    
     text += "<li>" + fruits[i] + "</li>";
}

也可使用==foreach（）==属性：来遍历数组
该属性需要一个函数作为参数，数组中有几个元素，该函数就会执行几次

var fruits, text;
fruits = ["Banana", "Orange", "Apple", "Mango"];

text = "<ul>";
fruits.forEach(myFunction);
text += "</ul>";

function myFunction(value) {
    
    
  text += "<li>" + value + "</li>";
}

2.2 JS数组简单操作

（1）数组的创建
首先要知道的是，在JS中数组也是对象创建一个数组的方法通常有两种：
一种是通过构造函数创建：

var cars = new Array("Saab", "Volvo", "BMW");

其中的new关键字可以省略
两一种是通过 数组字面量 来创建一个数组：

var array-name = [item1, item2, ...];

两种方法的效果完全一样，所以常通过数组字面量来创建一个数组

（2）访问数组元素
JS中数组的访问方法和C中类似，即通过索引（下标）来进行访问
索引也是从0开始

var name = cars[0];

（3）修改数组元素
和C中一样，可以利用下标和[]直接进行修改

cars[0] = "Opel";

（4）访问完整数组：
在JS中，可通过引用数组名来访问完整数组

var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;

（5）删除元素：
由于数组属于对象，其中的元素就可以使用 JavaScript delete 运算符来删除：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // 把 fruits 中的首个元素改为 undefined

2.3 JS数组的一些常用方法：

tostring(): 把数组转换为数组值（逗号分隔）的字符串。
push(): 在数组结尾处添加一个新的元素，并且返回新数组的长度
pop()：从数组中删除最后一个元素，并且会返回被删除的元素
unshift()：在开头向数组添加新元素，并“反向位移”旧元素,返回新数组的长度
shift()：删除首个数组元素，并把所有其他元素“位移”到更低的索引，并且会返回被移除的字符串
concat()：合并多个数组

var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys);   // 连接 myGirls 和 myBoys

注意：（1）该方法不会修改原数组，它总是返回一个新数组
（2）该方法可以使用任意数量的数组作为参数
（3）该方法也可以将值作为参数：

var arr1 = ["Cecilie", "Lone"];
var myChildren = arr1.concat(["Emil", "Tobias", "Linus"]);

splice():splice() 方法可用于向数组添加新项：

ar fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

第一个参数（2）定义了应添加新元素的位置（拼接）。

第二个参数（0）定义应删除多少元素。

其余参数（“Lemon”，“Kiwi”）定义要添加的新元素。

该方法**返回一个包含已删除项的数组**

join():可将所有数组元素结合为一个字符串,但是与tostring()不同的是，你可以传递一个参数作为字符串之间的分隔符，如果没有参数，默认是以 ","分隔
reverse(): 颠倒数组中元素的顺序，此方法会直接修改原数组
sort(): 需要注意的是该方法始终按照unicode编码进行排序，所以在日常使用中有点鸡肋
但可以添加一个回调函数实现排序的目的：

arr.sort(function(a,b){
    
    
	return a-b;
})

3.Date对象：

3.1 创建Date对象：

（1）new Date() :用当前日期和时间创建新的日期对象

var d = new Date();

(2)new Date(year, month, …) : 用指定日期和时间创建新的日期对象

var d = new Date(2018, 11, 24, 10, 33, 30, 0);
/*JavaScript 从 0 到 11 计算月份。

一月是 0。十二月是11。

6个数字指定年、月、日、小时、分钟、秒*/

（3）new Date(dateString) : 从日期字符串创建一个新的日期对象：

var d = new Date("October 13, 2014 11:13:00");

3.2 日期获取方法：

在这里插入图片描述

4.Math对象：

一般允许对数字执行数学任务

4.1 Math对象的一些常用方法：

在这里插入图片描述

5.包装类：

在JS中为我们提供了三个包装类，通过这三个包装类可以将基本数据类型的数据转换为对象
String(),Number(),Boolean()
可以分别将基本数据类型转换为 String对象，Number对象，Boolean对象

5.1 String对象中的一些方法：
在这里插入图片描述

6.正则表达式：

6.1 正则表达式简介：

正则表达式用于定义一些字符串的规则，计算机可以通过正则表达式，来检查一个字符串是否符合规则（或者将字符串中符合规则的内容提取出来）

（1）创建正则表达式的对象：

var reg = new RegExp();

语法：
var 变量 = new RegExp(“正则表达式”,“匹配模式”);
第二个参数可以是
i 忽略大小写
g 全局匹配模式
m 执行多行匹配

正则表达式的方法：
test() 可以用来检查一个字符串是否符合正则表达式的规则，如果符合就返回true，反之则返回false

6.2 正则语法：

（1）使用字面量创建正则表达式：
语法：

var 变量 = /正则表达式/匹配模式;

（2）语法：

var reg =/a|b/;/*a或b*/
var reg =/[ab]/;/*查询[]间的任何字符*/
var reg = /a-z/;/*任意小写字母*/
var reg = /A-Z/; /*任意大写字母*/
var reg = /A-z/;/*任意字母*/
var reg =/^a/;/*匹配开头的a*/
var reg =/a$/;/*匹配结尾的a*/
var reg =/^abc$/;/*使用^ $则表示该字符串必须完全符合正则表达式*/
var reg =/./;/*查找单个字符，除了换行符和行结束符*/

[^ ]/*寻找除了括号内的内容*/

元字符（Metacharacter）是拥有特殊含义的字符：
在这里插入图片描述
\w 任意字母、数组、下划线
\W 与\w相反

量词：
在这里插入图片描述

6.3 字符串和正则表达式相关的方法：

split()：可以将一个字符串拆分为一个数组
该方法可以传递一个正则表达式作为参数，这样方法会根据正则表达式拆分字符串
search()：可以搜索字符串中是否含有指定内容，返回指定内容第一次出现的索引，如果没有找到就返回-1
match(): 可以根据正则表达式，从一个字符串中将符合条件的内容提取出来，
注意：此方法默认情况下只会找到第一个符合条件的内容就停止检索，可以在后面加上 g全局匹配模式
此方法会将查询到的内容封装到一个数组中返回，即使查询到的内容只有一个
replace():可以将字符串中的内容替换成新的内容
参数：第一个是被替换的内容（可以接收一个正则表达式作为参数）第二个是新内容
PS：默认情况下只会替换第一个
可以通过用空字符串""替换空格来实现去除空格的目的

7.DOM（Document Object Model）

dom即文档对象模型
-文档
表示的就是整个HTML网页
-对象
表示将网页中的每一个部分转换成了对象
-模型
使用模型来表示对象之间的关系，方便我们获取对象

在这里插入图片描述
####7.1 节点的概念：
节点 Node——是构成html文档的最基本单元
常用节点分为四类：

文档节点
元素节点
属性节点
文本节点

节点的属性：
nodeName nodeType nodeValue

7.1 有关dom查询的一些方法

（1）直接通过document对象调用

getElementById();
getElementByTagName(); 会返回一个类数组对象，查询到的元素都会封装到对象中
getElementByName();

（2）通过元素节点调用：
方法：getElementByTagName();
属性：

childNodes 返回该元素的所有子节点【包括文本节点在内的所有及诶单】
firstChild 首子节点
lastChild 尾子节点
Children 获取所有子元素

（3）获取父节点和兄弟节点：

parentNode 父节点
previousSibling 前一个兄弟节点（previousElementSibling 前一个兄弟元素）
nextSibling 后一个兄弟节点
注意：空白文本也属于节点

7.2 有关dom查询的剩余方法：

document中的：

body属性可以直接获取body标签
documentElement属性（即获取html标签）
all 页面中的所有元素（也可以用getElementByTagName(*)代替）
getElementsByClassName() 通过类名获取元素节点【IE8及以下不支持】
querySelector() 该方法可以通过选择器获取，但只会返回唯一的元素
querySelectorAll() 会将符合条件的元素封装在数组中返回

7.3 == 有关dom删改的方法==：

（1）通过父节点调用：

appendChild(); 添加子节点
removeChild(); 删除子节点
常用：子节点.parentNode.remove();
replaceChild(); 替换子节点
createElement(“标签名”) 创建元素节点对象并返回
createTextBode(); 创建文本节点并返回
insertBefore(); 在指定子节点前插入节点
用法：父节点.insertBefore(新节点，旧节点);

PS：结合 innerHTML 属性可以更高效率跟便捷的完成dom的增删改操作

通过这次总结发现很多刚学过的东西遗忘都挺严重的，尤其是各种方法属性实在是太多了，
希望自己能坚持总结