🚀 作者 ：“码上有前”
🚀 文章简介 ：高频前端面试题–JS下篇
🚀 欢迎小伙伴们 点赞👍、收藏⭐、留言💬
前端高频面试题--JS下篇
往期精彩内容
【前端高频面试题–HTML篇】
【前端高频面试题–CSS上篇】
【前端高频面试题–CSS下篇】
【前端高频面试题–JS上篇】
【前端高频面试题–JS下篇】
【前端高频面试题–ES6篇】
【前端高频面试题–ES7-ES11】
【前端–异步编程】
【前端高频面试题–TypeScript篇】
【前端高频面试题–git篇】
【前端高频面试题–微信小程序篇】
【前端高频面试题–Vue基础篇】
【前端高频面试题–虚拟DOM篇】
【前端高频面试题–Vue3.0篇】
【前端高频面试题–Vuex上篇】
【前端高频面试题–Vuex下篇】
【前端高频面试题–Vue生命周期篇】
【前端高频面试题–Vue组件通信篇】
【前端高频面试题–Vue路由篇】
【前端-Vue3创建一个新项目】
【前端大屏自适应缩放】
【前端Vue3 + TS项目开发一般流程】
简介
前端中JavaScript通常包括三个部分，分别是ES规范（ECMAScript）、DOM（Document Object Model ）、BOM（Brower Object Model）。JS的功能主要包括对HTML的元素和属性的操作、样式的修改、对事件的处理与如何添加或删除 HTML 元素。本文章旨在强化自身学习，文章中观点仅代表个人，如有错误欢迎留言讨论。
参考学习资源：
菜鸟教程：https://www.runoob.com/js/js-tutorial.html
尚硅谷视频： https://www.bilibili.com/video/BV1YW411T7GX/?share_source=copy_web&vd_source=bd78999e1f4edcc1234bdfaee1f58d8d
ES规范语法
基本数据类型
String
字符串类型使用引号引起来，但是不能穿插使用。
//斜杠\表示转义特殊字符。特殊的/t表示制表符，/n表示换行
console.log("\\"); //输出\
console.log(typeof "123"); //string
//typeof返回的结果是字符串
var result = typeof "123";
console.log(typeof (typeof result)); //string
其他类型强制转换成string
//方法一：调用toString方法
//该方法对unll和undefined无效，因为其没有该方法
//方法二：使用String()函数,对null与undefined也生效
//方法三：使用运算法则，与空串“”运算,+号会进行拼串,任何值与字符串相加都会转换成字符串再拼串
var num = 123;
console.log("" + num ); //
console.log(typeof ("" + num));
console.log(typeof ("123" + "456")); //"123456"
Number
所有的整数和小数都属于Number类型
console.log(typeof 123); //number
//最大数Number.MAX_VALUE,大于0的最小数Number.MIN_VALUE
//正无穷Infinity，负无穷-Infinity
//非数字比如 123a，则用NaN表示，数据类型任然是number
浮点数运算不精确
console.log(0.2 + 0.1);//0.30000004 计组。。。
其他类型强制转换成number
//方法一：调用Number()函数，如果字符串是非纯数字则转换成NaN，如果不是字符转则会先转换成字符串再传入到Number函数中。
console.log(Number(Null));//0
console.log(Number(undefined));//NaN
//方法二： 与数字运算 除+与字符串有拼串操作， - * / 都可以转成成数字进行运算。即通过-0 、*1 、/1来进行隐式的数值转换
//当非Number类型的值进行运算时，会将这些值转换成Number再运算
console.log(12 + null);//12 null为0
console.log(123 + "1");//1231
//任意数值与NaN运算都是NaN
相等运算符下数值转换
//下式中字符串类型的“1”与布尔类型的true都会转换成number，再进行数值比较
console.log("1" == 1); //true
console.log("1" == true); //true
//但是
console.log(null == 0); //flase
console.log(null == undefined); //true
//NaN不和任何值相等，包括他本身
console.log(NaN == NaN); //flase
全等运算符下数值转换
//全等要求不仅数值要相等而且数据类型也要相等
console.log("1" === 1); //flase
console.log(null === undefined); //flase
获得有效数字
//使用parseInt(),与parseFloat()函数
//非string类型转会先转换成string再传入parseInt()方法再转换成数字
console.log(parseInt("123px")); //123
console.log(parseInt("123px123")); //123
console.log(parseInt("1.23px123")); //1
console.log(parseInt("px123px123")); //NaN
//parseFloat()作用与parseInt()效果类似
其他进制数字的转换
//十六进制以0x开头,八进制以0开头、二进制以0b开头、会输出为十进制数
console.log(0x10); //16
console.log(010); //8
console.log(0b10); //2
其他类型强制转换成boolean
Boolean
//方法一：使用Boolean()函数
//数字转换成布尔，除0和NaN其他都是true
console.log(Boolean(-123)); //true
console.log(Boolean(0)); //flase
console.log(Boolean(NaN)); //flase
//字符串转换成布尔，除空串其他都是true
console.log(Boolean("")); //flase
console.log(Boolean("123sdfsd")); //true
//null、undefined转换成布尔是flase
console.log(Boolean(null)); //flase
console.log(Boolean(undefined)); //flase
//对象也会转换成true
Null
null表示一个空对象
console.log(typeof null); //object
//如果一个对象没有任何的变量和属性对他引用此时我们就无法操作.
//这种对象就是垃圾，过多不释放会占用大量的内存空间。
//JS中拥有垃圾回收机制，会将垃圾对象从内存中销毁，不需要手动垃圾回收
//有些对象可能以后都没有用了，但是有被引用，那么我们就需要手动的回收，即obj = null
Undefined
//undefined表示未定义，声明了变量并未赋值
console.log(typeof undefined); //underlined
引用数据类型
Object
//引用对象存储的是对象堆内存中的地址，而基本数据类型保存的是栈内存中的数值
//克服了单一的基本数据类型表示数据的能力
var name = '李sha猪';
var gender = "男";
var age = '18';
//如用对象则方便且可以表示事物之间的关系，而且可以表示事物之间的不同类型的数据
//字面量创建对象
var boy = {
//name 可以用引号引起 建议不写， 有的地方要这样写
name = '李sha猪', // "name" : '李sha猪'
gender = "男",
age = 18
}
//构造函数创建对象
var boy = new Object();
boy.name = '李sha猪';
boy.gender = 'man';
boy.age = 18
对象的分类
//对象的分类：内建对象 自定义对象
//内建对象:es标准定义的对象 可以任意使用，如基本数据类型
//宿主对象:由js运行运行环境提供，目前主要是指浏览器提供的对象
// 如Bom 和Dom 平时常用的documnent、 window 、 console都是
//自定义对象:由开发人员自主创建的对象
函数Function
//构造函数声明调用，在开发中很少使用构造函数
//函数会在函数调用时运行，而不是在函数声明时,即fun不会立即执行
var fun= new Function(console.log('构造函数'));
console.log(fun);// function anonymous(){console.log('构造函数')}
console.log(typeof fun);//function
fun();//函数调用，此时将会执行，同理fun2(1,2)也是函数调用
//匿名函数因为没有名字，所以无法调用，如果想要执行使用函数名()形式编程立即执行执行函数进行调用，或者将其复制为另一变量
function(){console.log('这是一个匿名函数'）}
//函数声明式调用，将匿名函数赋值给一个变量
var fun3 = function(){console.log('函数声明式调用'）};
fun3();
// 字面量式调用
function fun4(){console.log('字面量创建')};
fun4();
//立即执行函数,立即执行，只执行一次就不再执行，因为没有名字
(function(){console.log('这是一个立即执行函数')})();
//函数的实参与函数的返回值可以是任意的数据类型 ，也可以是个对象和函数
//在函数体中return 之后的语句将不再执行，即return可以终结一个函数
//函数也可以作为对象的属性
var boy = {
name = '李sha猪',
gender = "男",
age = 18
sayName: function(){
console.log(boy.name);
}
}
boy.sayName();//调用
构造函数与普通函数
//区别一:构造函数使用new关键词调用，而普通函数直接调用
//构造函数习惯上首字母大写
//构造函数对象的执行流程: 1立即创建一个新的对象，2.将新建的对象设置为函数的this
// 3.执行行数代码 4.将新建的对象作为返回值返回
var boy = new Person();
function Person(){
console.log(this); //boy
this.name = "李sha猪"; //this指向实例化对象boy
this.gender= "man"; //this指向实例化对象boy
this.age= 18; //this指向实例化对象boy
}
//这种写法固定了对象的值，写死了，所以我们通常这样写
var boy = new Person("李sha猪","man",18);
function Person(name,gender,age){
console.log(this); //boy
this.name = name; //this指向实例化对象boy
this.gender = gender; //this指向实例化对象boy
this.age = age; //this指向实例化对象boy
}
//此时Person为一个类，而通过new创建的对象boy是他的实例
//使用instanceof检测某个对象是都是每个构建函数的实例
console.log(boy instanceof Person);//true
//所有的对象都是Object 的实例。（亚当夏娃）
function Person(name,gender,age){
console.log(this); //boy
this.name = name; //this指向实例化对象boy
this.gender = gender; //this指向实例化对象boy
this.age = age; //this指向实例化对象boy
}
原型对象
//当每一个构造函数中都有相同的方法时，假如该方法经常被调用，会造成大量的冗余（如下的sayName）,但是如果将它放入到全局的作用域下，又会污染全局的命名空间（很容易被覆盖或者被修改，不利于协同工作），而且不安全。
function Person(name){
this.name = name;
sayName: function(){
console.log(this.name);
}
function Dog(name){
this.name = name;
sayName: function(){
console.log(this.name);
}
//因此引出原型对象
//每创建一个函数，解析器都会为这个函数添加一个prototype属性
//这个属性对应着一个对象，这个对象就是原型对象
//普通函数使用prototype没有效果
console.log(Person.prototype);//object
//对于实例化对象来说，也有一个隐含属性__proto__来访问
console.log(boy.__proto__);//object
console.log(Person.prototype == boy.__proto__);//true
//原型对象相当于一个公共的区域，所以我们可以将构造函数中共同的方法和属性放在原型对象中，解决了冗余重复的代码，对于维护代码也更加方便，也不会污染全局区域。
Person.prototype.sayName = function(){
console.log("我的名字是:" + this.name);
};
//检查属性是否存在对象中，使用in 如果该对象没有，其原型中有也返回true
console.log("name" in per);//true
//原型对象也有原型，但是最终都会指向Object，Object的原型是undefined
//即形成了一条原型链
闭包
//计数器困境，设想下如果你想统计一些数值，且该计数器在所有函数中都是可用的。你可以使用全局变量，函数设置计数器递增：
var counter = 0;
function add() {
return counter += 1;
}
add();add();add();
//问题也来了，页面上的任何脚本都能改变计数器，即便没有调用 add()函数。如果我在函数内声明计数器，如果没有调用函数将无法修改计数器的值
//因此我们想出闭包的方法，闭包的方法是：函数体里的变量需要被访问时，会寻找函数体内是否存在该变量，如果没有就会找到上一次作用域中寻找（函数那一层），因此只要上一层不是全局那一层（即该变量不是全局变量），那么页面里的其他脚本就无法修改该变量，所以我们在函数体外在套上一个函数就解决了。
var add = (function () {
//将变量放在函数的上一层，但是又被另外一个函数包裹住，不是最外一层
var counter = 0;
//当函数想要访问counter时会在上一层中寻找到该变量
return function () {return counter += 1;}
})();
add();add();add(); //3 且只会通过add()方法改变
枚举对象
//使用for...in枚举对象中的元素
for(let n in boy){
console.log("属性名" + n);//n是对象中的属性名
//不能使用boy.n,其表示取对象boy中找一个属性n，应该使用[]取属性值
console.log("属性值" + boy[n]);
}
类
//我们使用class关键字来创建一个类，类体在一对大括号 {} 中，我们可以在大括号{}中定义类成员的位置，如方法或构造函数。每个类中包含了一个特殊的方法 constructor()，它是类的构造函数，这种方法用于创建和初始化一个由 class 创建的对象。创建一个类的语法格式如下：
class Person{
constructor(name,age) {
this.name = name;
this.age = age
}
}
//实例化该类
let boy = new Person("李sha猪", 18);
//创建对象时会自动调用构造函数方法 constructor()。
//类表达式:将创建的Class赋值给变量，分为匿名变量与命名类变量
// 未命名/匿名类
let Boy = class {
constructor(name, url) {
this.name = name;
this.url = url;
}
};
//实例化该类
let boy = new Person("李sha猪", 18);
console.log(Boy.name);// '李sha猪'
// 命名类
let Boy= class Person {
constructor(name, url) {
this.name = name;
this.url = url;
}
};
//实例化该类
let boy = new Person("李sha猪", 18);
console.log(Boy.name);
//构造方法是一种特殊的方法：构造方法名为 constructor()。构造方法在创建新对象时会自动执行。构造方法用于初始化对象属性。如果不定义构造方法，JavaScript 会自动添加一个空的构造方法。
//类方法:在实例化对象中可添加方法，语法如下：
class ClassName {
constructor() { ... }
method_1() { ... }
method_2() { ... }
}
//实例
lass Boy {
constructor(name, age) {
this.name = name;
this.year = age;
}
//为该类添加一个方法,同时还可以添加参数
age(a) {
let date = new Date();
let year = date.getFullYear();
return this.year - a;
}
}
let boy= new Boy("李sha猪", 2000);
console.log(boy.age(age));
类继承
//类关键字
//extends: 继承一个类，继承允许我们依据另一个类来定义一个类，这使得创建和维护一个应用程序变得更容易。
//static: 在类中定义一个静态方法
//super: super方法用于调用父类的构造函数。
class Person{
constructor(name) {
this.name = name;
}
present() {
return '我喜欢' + this.name;
}
}
class Boy extends Person{
constructor(name, age) {
//super()方法引用父类的构造方法,调用了父类的构造方法，这样就可以访问父类的属性和方法,继承对于代码可复用性很有用。(hh 与java很像呀)
super(name);
this.age = age;
}
show() {
return this.present() + ', 它出生了 ' + this.age + ' 年。';
}
}
let hiBoy= new Person("李sha猪", 18);
console.log(hiBoy.show());
getter setter
//类中我们可以使用 getter 和 setter在严格模式下 来获取和设置值。getter和 setter可以使得我们对属性的操作变的很灵活。类中添加 getter 和 setter 使用的是 get和set 键字。以下实例：
class Person{
constructor(name) {
this.name = name;
}
get s_name() {
return this.name;
}
set s_name(x) {
this.sname = x;
}
}
let boy= new Person("李sha猪");
console.log(boy.s_name);
//注意：即使 getter 是一个方法，当你想获取属性值时也不要使用括号。getter/setter 方法的名称不能与属性的名称相同，在本例中属名为 name。很多开发者在属性名称前使用下划线字符 _ 将 getter/setter 与实际属性分开：以下实例使用下划线 _ 来设置属性，并创建对应的 getter/setter 方法：
this
//方式一:以普通函数的形式调用，this永远指向window
//方式二:以方法的形式调用，thhis指向调用该方法的对象
//方式三:以构造函数的形式调用，this指向实例化的对象
//方式四：函数调用call或者apply方法，this指向传入的对象
call apply
//函数对象的方法，需要通过对象调用
function fun(){
console.log(this)；
}
//将传入的对象指定为第一个参数，此时执行的this就指向该对象
//即call和apply函数可以修改this的指向
fun();//以函数形式调用，this指向window
fun.call(boy);//此时this指向对象boy
fun.apply(boy);//此时this指向对象boy
var boy = {
name = '鼠鼠我呀',
sayName: function(){
console.log(this.name);
}
}
var man= { name = '某个帅哥man' }
boy.sayName.call(man);//'某个帅哥man',this指向man
//call():可以将对象之后的一个一个实参依次传递给函数，
fun.call(obj,a,b,c);//可以依次的接收a,b,c
//而apply():不会接受对象之后一个个实参，其接受的是所有参数封装在一起的数组arguments.
fun.apply(obj,[a,b,c]);
数组
创建数组
//方式一:构造函数创建，这种方法实际开发少用
var arr = new Array();
console.log(typeof arr);//object
arr[0] = 1;arr[1] = 2;//向数组添加元素
//如不连续的数组 输出值为undefined
var arr2 = new Array(10,20,30); //也可直接在构造函数中传入参数，逗号隔开
var arr3 = new Array(10); //表示创建一个长度为10的数组
//方式二:字面量创建数组
arr4 = [0,1,2,3];
//数组值可以是任意数据类型,对象，函数，数组也可以
arr5 = ['boy',18,true,null,undefined,function(){},arr4];
obj = {name:'李sha猪'}; arr5[arr.length] = obj;//向数组最后一个元素添加对象
arr6 = [[1,2],[2,4]] //二维数组，同理可以三维思维
数组的属性
//Array.length.返回数组的长度，最大索引+1，可控制数组内容的删增
//Array.constructor 数组的构造函数
//Array.prototype 数组的原型
数组的方法
//数组的方法有很多，简要列举，详细请查询手册
//pop() ,push() ,shift() ,unshift()
//slice() ,splice() ,concat() ,join() , sort() ,reverse()
//valueOf() ,toSource() ,toString() ,toLocaleString()
push pop unshift shift
var arr = ['html','css','js','vue'];
//push():向数组末尾添加一个或多个元素，并返回数组新的长度
var result = arr.push('ts','react');
console.log(arr);//['html','css','js','vue','ts','react']
console.log(result );//6
//pop() 删除数组最后一个元素，并返回最后一个元素
var result = arr.pop();
console.log(arr);//['html','css','js','vue','ts']
console.log(result );//'react'
//unshift() 向数组开头添加一个或多个元素，并返回新的数组长度
var arr = ['html','css','js','vue'];
var result = arr.unshift('node.js','ts');
console.log(arr);//['node.js','ts','html','css','js','vue'];
console.log(result );//6
//shift()删除并返回删除的元素
var result = arr.shift();
console.log(arr);//['ts','html','css','js','vue'];
console.log(result );//'node.js'
slice splice
var arr = ['html','css','js','vue'];
//slice(start,end): 从某个已有的数组返回选定的元素。该方法不改变原数组
//start必需，表示从何处开始截取，如是负数则无效会返回空数组
//end可选。规定从何处结束，如果是负数那个表示从数组尾部开始算也就是倒数
var newArr = arr.slice(1,2);//左闭右开区间
console.log(arr);//['html','css','js','vue'];
console.log(newArr);//['css'];
var newArr = arr.slice(1);//第二参数不写表示从1往后都要
console.log(newArr);//['css','js','vue'];
var newArr = arr.slice(1,-1);//单数
console.log(newArr);//['css','js'];
//splice(index,num):删除元素并向数组添加新元素,影响原数组，并将删除内容返回
//第一个参数表示开始位置的索引，第二个参数表示删除元素的个数
var arr = ['html','css','js','vue'];
var newArr = arr.splice(0,2);//从第0个开始删除，删除第二个
console.log(arr);//['js','vue'];该方法影响原数组
console.log(newArr);//['html','css'];返回删除的元素
var result = arr.splice(0,2,'webpack');
console.log(arr);//['webpack','js','vue']; webpack替换成删除元素
console.log(newArr);//['html','css'];返回删除的元素
//当第二个元素为0时，可以实现添加功能
var result2 = arr.splice(1,0,'webpack');//
console.log(arr);//['html','webpack','css','js','vue'];
console.log(newArr);//[''];返回空数组
concat join sort reverse
var arr1 = ['react','ts'];
var arr2 = ['uniapp'];
var arr3 = ['webpack','vite'];
//concat(arr,'string'):两个一个或多个数组或元素，该方法不会对原数组产生影响
var newArr = arr1.concat(arr2,arr3,'node.js');
console.log(arr1);//['react','ts'];
console.log(newArr);//['react','ts','uniapp','webpack','vite','node.js']
//join('连接符'):该方法将数组转换成字符串，不会对原数组产生影响
//可以传入一个字符串作为数组元素的连接符，不传默认逗号
var str = arr1.join('^_^');
console.log(arr1);// ['react','ts'];
console.log(str);//'react^_^ts'
console.log(typeof str);'string'
//reverse():颠倒数组，该方法会直接修改原数组
var arr3 = ['webpack','vite'];
var reArr = arr3.reverse();
//因为该方法会直接改变原数组可不必用新的变量接受
console.log(arr3);//['vite','webpack'];
console.log(reArr);//['vite','webpack'];
//sort():根据排序
var sortArr = ['a','c','d','b'];
sortArr.sort();
console.log(sortArr); //[‘a’,'b','c','d'];
var sortArr1 = [1,2,3,4,5];
sortArr1.sort();
console.log(sortArr1 ); //[1,2,3,4,5,]
//发现排序不成功，按unicode编码排序
var sortArr2 = [12,3,4,5];
sortArr2.sort();
console.log(sortArr2); //[12,3,4,5]
//可指定回调函数进行排序
var sortArr3 = [05,30,11,27];
//传入两个参数，参数a,b的值不确定，但是a的下标位置一定在b的前面
//返回一个大于0的值会交换两个数的位置，小于0则不变，如果相等认为两个值相等也不变
sortArr3.sort(function(a,b){
return a>b; //升序排列
console.log(sortArr3);//[05,11,27,30]
})
//可以使用箭头函数的写法，ES6中的新语法
sortArr3.sort((a,b) => a>b{
console.log(sortArr3);//[05,11,27,30]
})
filter some every map
//filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
//filter()不会对空数组进行检测。filter()不会改变原数组。
//语法：array.filter(function(currentValue,index,arr), thisValue)
//语法：currentValue必需，其余值包括thisValue皆可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。
//如果省略了 thisValue ，"this" 的值为 "undefined"
//示例：返回数组 ages 中所有元素都大于 18 的元素:
var ages = [32, 33, 16, 40, 12, 21];
//三个参数类似于value index arr。与forEach(function(value,index,arr))的三个参数很类似
var filterArr = ages.filter(function(age){
return age >= 18;
})
console.log(ages);//[32, 33, 16, 40, 12, 21];
console.log(filterArr);//[32, 33, 40, 21]
//some()方法用于检测数组中的元素是否满足指定条件。方法会依次执行数组的每个元素,如果有一个元素满足条件，则表达式返回true。如果没有满足条件的元素，则返回false。注意some()不会对空数组进行检测。且不会改变原始数组。
//语法：array.some(function(currentValue,index,arr),thisValue)
//检测数组中是否存在大于5的数
var arrArr = [1,3,2,11,22,15];
var someArr = arrArr.some(function(currentValue,index,arr){
return currentValue > 5;
console.log(currentValue);
})
console.log(someArr ); //true
//every 的用法与some特别的相似。只不过erery要求数组内全部满足。
//every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。every() 方法使用指定函数检测数组中的所有元素：如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。如果所有元素都满足条件，则返回 true。注意： every() 不会对空数组进行检测。 every() 不会改变原始数组。
//检查数组中所有元素是都大于5
var arrArr = [1,3,2,11,22,15];
var everyArr = arrArr.ervery(function(currentValue){
return currentValue > 5;
console.log(currentValue);
})
console.log(everyArr ); //flase
//map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素。
//语法:array.map(function(currentValue,index,arr), thisValue)
var arrArr = [1,3,22,15];
var mapArr = arrArr.map(function(currentValue,index,arr){
return currentValue-10
})
console.log(mapArr );//[-9,-7,12,5]
find findIndex
//find()方法返回通过测试的数组的第一个元素的值。find() 方法为数组中的每个元素都调用一次函数执行：当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素，之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined
var arrArr = [1,4,2,3,2,11,32,34,22,15];
var findValue = arrArr.find(function(age){
return age > 18
})
console.log(findArr);//返回第一个满足大于18的元素，32
//findIndex的用法和find很相似，返回符合函数体内条件的数组元素下标
var arrArr = [1,4,2,3,2,11,32,34,22,15];
var findIndexValue = arrArr.findIndex(function(age){
return age > 18
})
console.log(findArr);//返回第一个满足大于18的元素的下表，6
fill copyWithin
//fill()使用一个固定值来填充数组。
//语法：array.fill(value, start, end)
var city= ["Yichun", "Shenyang", "Beijing"];
city.fill("Nanchang");
console.log(city);//["Nanchang", "Nanchang", "Nanchang"]
//传入start与end参数
var city = ["Yichun", "Shenyang", "Beijing"];
city.fill("Nanchang",1,2);//[1,2)
console.log(city);//["Yichun", "Nanchang", "Beijing"]
//copyWithin()从数组的指定位置拷贝元素到数组的另一个指定位置中。
//语法array.copyWithin(target, start, end)。target必需
var city= ["Yichun", 'Shizuishan',"Shenyang", "Beijing"];
//第一个二表示数组下标，表示要被赋值的元素。0表示数组索引0,2表示数组索引2的位置，即从0开始到2结束的值将从数组下标为2的位置开始赋值
city.copyWithin(2,0,2);
console.log(city);
//["Yichun", 'Shizuishan',"Yichun", 'Shizuishan']
var city= ["Yichun", 'Shizuishan',"Shenyang", "Beijing"];
city.copyWithin(2,0);
console.log(city);
//["Yichun", 'Shizuishan',"Shenyang", "Beijing"]
indexOf lastIndexOf
//indexOf(item,start) 方法可返回数组中某个指定的元素位置。开始检索的位置在数组 start 处或数组的开头（没有指定 start 参数时）。如果找到一个item，则返回 item 的第一次出现的位置。开始位置的索引为 0。如果在数组中没找到指定元素则返回-1。
//提示如果你想查找字符串最后出现的位置，请使用 lastIndexOf() 方法,即从后往前开始查找数组元素，用法与lastndexOf一致。
var frontEnd = ['html','css','js','node.js'];
var num = frontEnd.indexOf('js');// num = 1;
from
//from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。如果对象是数组返回 true，否则返回 false。
//语法：Array.from(object, mapFunction, thisValue);
//其中:object必需，要转换为数组的对象。mapFunction可选，数组中每个元素要调用的函数。thisValue可选，映射函数(mapFunction)中的this对象
//例如下文中所用到的数组去重要将Set对象转换成Array对象，借用下文
var arr = [1,2,3,4,2,3,2,1,2,1,3,4];
var newSet = new Set(arr);//newSet为集合
console.log(newSet);//{1,2,3,4}
console.log(typeof newSet);//object
var newArr = Array.from(newSet );
console.log(newArr);//[1,2,3,4]
console.log(newArr instanceof Array);//true
reduce reduceRight
//reduce: 将数组元素计算为一个值（从左到右）。
//reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。reduce() 可以作为一个高阶函数，用于函数的 compose。
//语法 :array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
//reduceRight 是从右向左
总结
- 不改变原数组的方法： concat、join、reduce、map、forEach、filter、slice、findIndex
- 会改变原数组： push、pop、shift、unshift、sort、reverse、splice、
数组方法基本上每一版本都会增加一些，本篇文章主要总结了我们开发中比较常用而且容易混淆的Js数组方法。至于为什么要区分是否更改原数组，那就得根据实际情况来决定。
提供一个很好的记忆上述数组方法是否改变原数组的方法：记住这几个常见的会改变数组的方法：pop和push一对，shift和unshift一对，sort和reverse一对，剩下一个splice。其余的就都是不改变数组的方法了。
打个比方，如果有一道算法题，可以用 unshift 和 slice 来解决，那么选用哪一个呢？首先 unshift 会改变原数组，它的时间复杂度是 O(n)，而 slice 方法不会改变原数组，它的时间复杂度是 O(1)，用哪个一目了然喽。
arguments
//在调用函数时，浏览器每次都会传递两个隐含的参数，
//一个是上下文对象this，另一个是参数类数组对象arguments
//传入的实参都会封装在arguments中
console.log(arguments instanceof Array);//false;
console.log(Array.isArray(arguments));//false;
//类数组不是数组，但是可以获取length属性，同时也可以通过下标来操作
//arguments.callee返回当前执行函数
数组的遍历
//方法一：使用forEach()
var arr = ['html','css','js','vue'];
arr.forEach(function(value，index，arr){
//传入一个回调函数，回调函数是由我们创建但不由我们调用的函数
//数组中有几个元素就回执行几次回调函数
//其中有三个参数，分别是数组值，数组下标，数组与长度
console.log(value);//'html'
console.log(index);//0
console.log(arr);
//{"0":"html","1":"css","2":"js","3":"vue","length":4}
})
//方法二：for...in
var arr = ['html','css','js','vue'];
for(let i in arr){
console.log(i);
console.log(arr[i]);
}
//方法二：for...of
var arr = ['html','css','js','vue'];
for(let v in arr){ //v即value
console.log(v);//'html','css','js','vue'
}
数组去重
//方法一:利用es6中的新数据结构set
var arr = [1,2,3,4,2,3,2,1,2,1,3,4];
var newSet = new Set(arr);
console.log(newSet);//{1,2,3,4}
console.log(typeof newSet);//object
//因此要将对象转换成数组
var newArr = new Array(newSet);
console.log(newArr);//[set{1,2,3,4}]
console.log(newArr instanceof Array);//true
//说明使用数组实例化是可不可行的，调用Array.from()也可行
var newArr = Array.from(newSet );
console.log(newArr);//[1,2,3,4]
console.log(newArr instanceof Array);//true
//方法二：使用forEach()遍历数组
var arr = [1,2,3,4,2,3,2,1,2,1,3,4];
var newArr = []; //let也行;
arr.forEach(function(value){
//判断传入的值在数组newArr中下标是否是-1，如果newArr中有的话就不是-1，如果没有就添加进去
if(newArr.indexOf(value) == -1){
newArr.push(value);
console.log(newArr);
}
})
console.log(newArr);//[1,2,3,4]
//方法三：for...in
var arr = [1,2,3,4,2,3,2,1,2,1,3,4];
let newArr = [];
for(let i in arr){
// 如果新数组没有包含该元素，那么就保存
//当然这里判断indexOf(value) == -1也成
if(!newArr.includes(arr[i])){
newArr.push(arr[i]);
}
}
console.log(newArr);//[1,2,3,4]
//方法四: 使用for...of
var arr = [1,2,3,4,2,3,2,1,2,1,3,4];
let newArr = [];
for(let i of array){
// 如果新数组没有包含该元素，那么就保存
//当然也可以使用indexOf
if(!newArr.includes(i)){
newArr.push(i);
}
}
console.log(newArr);//[1,2,3,4]
//方法五:filter() some() every()
//方法六: 双重for循环
//方法七：将数组的每一个元素依次与其他元素做比较，发现重复元素删除
Date
//创建时间对象
//方法一：构造函数创建
var d = new Date();
console.log(d);//当前时间
//创建指定时间
var d = new Date("18/2/2013");
console.log(d);//传入的时间
时间方法
var d = new Date();
var date = d.getDate();//获取当前日期的几日0~31
var day = d.getDay();//周几 0~6.0表示周日
var month = d.getMonth();//月份 0~11.0表示一月
var year= d.getFullYear();//年份 2023
var time= d.getTime();//获取当前对象的时间戳，毫秒数
//可以利用时间戳测试代码执行前后的时间差用两个time做减法
//除此之外 还有获取小时，分钟，秒，毫秒，
Math
//Math和其他对象不同，他不是一个构造函数，而是一个工具类
//它里边封装了数学运算相关的属性和方法
var m = new Math();
//Math的属性都是大写的常量，比如Math.PI表示圆周率
//Math的方法有很多，详细见手册
//ceil(x)向上取整 floor() 向下取整 round(x)四舍五入取整
//random()0-1随机数 abs(x)取绝对值
//三角函数与反三角函数 最大最小
//exp(x)e的x次指数 sprt(x)取x的平方根 pow(x,y)x的y次幂
String
//创建字符串字符串底层也是数组的形式
//方式一：构造函数
//方式二：字面量创建
var str = 'nxlg neu';
String的属性
//string.constructor
//string.prototype
//string.length
String的方法
//charAt():返回指定位置的数组,不会对全数组产生影响
//charCodeAt():返回指定位置字符的unicode编码
//fromCharCode(x)根据x的值返回对应的字符
string.fromCharCode(20013)//中
//indexOf()检索是否含有指定内容,有返回下标，没有-1
str = 'nxlg neu';
str.indexOf('u');//7
//可以指定查找的位置
str.indexOf('n',1);//5
//lastIndexOf() 从后开始查找
//slice() 同上
//small()
var str = "Hello world!";
document.write(str.small());//'hello world'
//split() 同上
//strike() 用于显示加删除线的字符串。
//sub()
//substr()
//subString()
//sup()
//toLocaleLowerCase()
//toLocaleUpperCase()
//toLowerCase()
//string方法大多与数组方法类似 不再做梳理
RegExp正则表达式
//正则表达式用于定于一些字符串的规则，计算机用正则表达式来检查一个字符串是否符合规则，可以用来检索和替换字符串
//创建一个正则表达式对象
//语法：var 变量 = new RegExp('正则表达式','匹配模式');
var reg = new RegExp('a');//检查字符串中是否含有a
console.log(reg,typeof reg);// /a/,object
var str = 'a';
//字面量创建:语法/x/i, x是正则表达式,i是修饰符
var regexp = /regexp/i
正则表达式方法
//正则表达式对象的方法test(),用来检查某字符串是否符合正则表达式
console.log(reg.test(str));//true
console.log(reg.test('bsertew'));//没有a返回false
console.log(reg.test('A'));//false 严格区分大小写
//exec(): 用于检索字符串中的正则表达式匹配，返回一个数组
//如未找到返回null
var result = /best/.exec('The best world is the most ordinary world!'); console.log(result,Array.isArray(result));//true
正则修饰符
//i :不区分大小写
//g ：执行全局匹配
//m :执行多行匹配
正则表达式模式
//[abc]: 查找任何在中括号之间的任意字符
//[^abc]: 查找任何不在中括号之间的任意字
//[0-9]: 查找任意数字
//[a-z]: 查找任何小写字码
//[A-Z]: 查找任何大写字母
//[A-z]: 查找任何字母
//(x|y)：查找任意以|分隔的选项
元字符
// \w: 查找单词字符 \W: 查找非单词字符
// \s: 查找空白字符 \S： 查找非空白字符
// \d: 查找数字 \D: 查找非数字
// \b: 匹配单词边界 \B: 匹配非单词边界
// \0: 查找NULL字符 // \n: 查找换行
// \f：查找换页 // \t：查找制表符
// \uxxx: 查找十六进制数xxx规定的Unicode字符
// \xxx: 查找八进制xxx规定的字符
量词
//n+: 匹配至少一个位n的字符，[1,)
//n*: 匹配0个或者多个为n的字符，[0,)
//n?: 匹配0个或多个，(0|1)
//n{x}: 匹配包含n个连续出现的
//n{x,y}: 至少x次，至多y次
//n$: 匹配任何结尾为n的字符串
//^n: 匹配任何楷体为n的字符串
//?=n: 匹配任何其后为n的字符串
正则常用的字符串方法
//searcch(): 用于检索字符串中指定的子字符串,或检索正则匹配的子字符串，并返回子串位置
var str = 'Learning FrontEnd';
var n = str.search(/front/i); //n =9
var n = str.search('Front'); //n =9
//replace(): 用字符串替换另一些字符串，或替换一个与正则匹配的子串
var txt = str.replace(/front/i,'Back');
var txt = str.replace('front','Back');
console.log(txt);//Learning BackEnd
//match: 找到一个或多个正则的匹配，提取出来
var str = [345j352345b3k4j543];
//如提取任意的字母，match一般会找到第一个字母，需要全局匹配添加修饰符g，即可完成该需求
var result = str.match(/[A-z]/g);
console.log(result);//全是字母的字符串
//split: 将字符串分割为字符串数组
var str = '1+2=3+4=2+3='
var arr = str.split('=');//按照=号拆分字符串，返回数组
console.log(arr);//['1+2','3+4','2+3'];
//在split()中可以传入一个正则表达式
正则示例
//邮箱的匹配：用户名@域名 xxx@xx.xxx
//任意字母下划线 .任意字母下划线 @ 任意数字字母 .任意字母
//\w{3,} (\.\w+)* @ [A-z0-9]+ (\.[A-z]{2,5}{1,2})
var emailRegExp =/\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}/;
var email = '23we4.23sd_2@163qq.com';
console.log(emailRegExp.test(email));//true
//改进 限制开头与结尾
var emailRegExp =/^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/;
//网上也有常用的正则表达式
全局属性与函数
js全局属性
//js全局属性和方法可以用来创建js对象
//infinity: 表示无穷大
//NaN: 不是数字
//undefined：未定义
js全局函数
//挑几个重要的，其余的是关于解析编码的url
//eval(): 计算js字符串，并把它当做js代码执行
//inFinite(): 检查某个值是否是无穷大
//inNaN(): 检查某个值是否是NaN
//str.parseFloat str.parseInt
//包装类String(),Number(),Boolean()
DOM
//Dom :Document Object Model
//文档：网页; 对象：将文档中的每一个节点转换成对象，便于面向对象操作。模型：表示对象之间的关系（树状结构）
获取节点
//节点：构成Html文档最基本的单元
//常见的文档分为四类：文档节点、元素节点、属性节点、文本节点
//节点的属性nodeName,nodeType,nodeValue
获取节点方法
<input type="text" name="hh" id="hh" value="hh" />
<input type="text" name="hh" id="dd" value="dd" />
//获取元素节点：通过document对象
//getElmentById();
//getElementsByTagName();返回类数组 HTMLCollection
//getElementsByName();返回类数组NodeList 表单标签
//getElementsByClassName();根据类名查找
var arr2 = document.getElementsByName('hh');
console.log(arr2 instanceof Array);//flase
console.log(arr2);//NodeList
//可以使用for..in for...of forEach()来遍历类数组
//但是不能使用数组的方法，比如concat(),splice()等等
var div = document.querySelectot(div.box1);
//将符合的元素封装在一个数组中，即是只有一个也会返回数组
var box = document.querySelectorAll('.box1');
获取子节点
//可以先过去该节点，再使用getElementsByTagName()来获取子节点
var node = getElementById('#input');
var resultArr = node.getElementsByTagName();
//获取节点后使用节点属性childNodes
var node = getElementById('#input');
var child= node.childNodes;
//但是这个节点是文本节点，属性节点与元素节点三个之和
//有时候标签之间的空白也算一个文本节点（不换行写一块就没有）
var child = node.children;//返回元素节点，不会包括文本
//firstChild属性返回当前节点的第一个子节点
//lastChild属性返回当前节点的第一个子节点
//firstElementChild属性返回当前节点的第一个子元素
//lastElementChild属性返回当前节点的第一个子元素
获取父节点与兄弟节点
//调用属性
//parentNode：当前节点的父节点，返回HTMLUListElement
//previousSibling: 表示前一个兄弟节点(可能是空白节点 ,previousElementSibling返回的是HTMLLIElement)
//nextSubling: 当前节点的后一个兄弟节点
//每个节点都含有的节点属性:nodeName nodeType nodeValue
//其中文本节点的nodeValue就是文本内容
其他Dom查询方法
//获取body标签
var body = document.getElementsByTagName('body')[0];
var body = document.body;//document下面有属性叫body
var html = document.documentElement; //html
var all = document.all;//document下所有元素
//根据一个选择器来查询,如果有多个只会返回第一个
var div = document.querySelectot(div.box1);
//将符合的元素封装在一个数组中，即是只有一个也会返回数组
var box = document.querySelectorAll('.box1');
Dom的增删改查
增添元素-appendChild(node)
//创建新的 HTML元素(节点) - appendChild();
var para = document.createElement("p");//创建 <p> 元素:
//为 <p> 元素创建一个新的文本节点：
var node = document.createTextNode("这是一个新的段落。");
para.appendChild(node);//将文本节点添加到 <p> 元素中：
//查找一个p标签并添加创建的标签在其尾部
var element = document.getElementById("div1");
element.appendChild(para);
//如果我们需要将新元素添加到开始位置，可以使用 insertBefore()方法
//上述前四步都相同，最后一步
var child = document.getElementById("p1");
element.insertBefore(para, child);
移除元素-removeChild(child)
//移除已存在的元素,而要移除一个元素，就需要知道该元素的父元素。
var parent = document.getElementById("div1");
var child = document.getElementById("p1");
parent.removeChild(child);
<div id="div1">
<p id="p1">子元素段落p1。</p>
<p id="p2">子元素段落p2。</p>
</div>
替换元素 - replaceChild()
//先创建一个元素
var para = document.createElement("p");
var node = document.createTextNode("这是一个新的段落。");
para.appendChild(node);
//再使用创建的元素通过父元素调用replaceChild方法替换原先元素
var parent = document.getElementById("div1");
var child = document.getElementById("p1");
parent.replaceChild(para, child);
<div id="div1">
<p id="p1">子元素段落p1。</p>
<p id="p2">子元素段落p2。</p>
</div>
Dom事件
//点击事件 onclick ondbclick
//变化事件 onchange 常结合对输入字段的验证来使用
//加载事件 onload 会在用户进入或离开页面时被触发，当用户改变输入字段的内容时，会调用函数。
//onmouseover 和 onmouseout 事件。onmouseover 和 onmouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数。
//onmousedown和 onmouseup事件，是鼠标按下与松动时触发。
//键盘事件
//onkeydown onkeypress 键盘按下与松开
//框架/对象（Frame/Object）事件
//onabort 图像的加载被中断。 (object)
//onbeforeunload 该事件在即将离开页面（刷新或关闭）时触发
//onerror 在加载文档或图像时发生错误。 (object,body和 frameset)
//onhashchange 该事件在当前 URL 的锚部分发生修改时触发。
//onload 一张页面或一幅图像完成加载。
//onpageshow 该事件在用户访问页面时触发
//onpagehide 该事件在用户离开当前网页跳转到另外一个页面时触发
//onresize 窗口或框架被重新调整大小。
//onscroll 当文档被滚动时发生的事件。
//onunload 用户退出页面。 ( <body> 和 <frameset>)
//表单事件
//onblur 元素失去焦点时触发
//onchange 该事件在表单元素的内容改变时触发( <input>, <keygen>, <select>, 和 <textarea>)
//onfocus 元素获取焦点时触发
//onfocusin 元素即将获取焦点时触发
//onfocusout 元素即将失去焦点时触发
//oninput 元素获取用户输入时触发
//onreset 表单重置时触发
//onsearch 用户向搜索域输入文本时触发 ( <input="search">)
//onselect 用户选取文本时触发 ( <input> 和 <textarea>)
//onsubmit 表单提交时触发
//此外还有剪切板事件 打印事件 拖动事件 动画事件 过渡事件
//addEventListener() 方法用于向指定元素添加事件句柄。句柄不会覆盖已存在的事件句柄。你可以向一个元素添加多个事件句柄。你可以向同个元素添加多个同类型的事件句柄，如：两个"click"事件。你可以向任何 DOM 对象添加事件监听，不仅仅是 HTML元素。如：window 对象。
//addEventListener() 方法可以更简单的控制事件（冒泡与捕获）。JavaScript从HTML 标记中分离开来，可读性更强， 在没有控制HTML标记时也可以添加事件监听。你可以使用 removeEventListener() 方法来移除事件的监听。
//语法：element.addEventListener(event, function, useCapture);
//向同个元素添加不同类型的事件和同一事件多个方法：
element.addEventListener("mouseover", myFunction);
element.addEventListener("click", mySecondFunction);
element.addEventListener("click", myClickFunction);
element.addEventListener("mouseout", myThirdFunction);
操作内联样式
//修改box1的样式,元素.style.样式名 = ‘样式值’
//通过js修改的样式都是内联样式，优先级高，往往立即显示
//当时!impotent标注的样式的优先级最高
var box1 = document.getElementById('box1');
box1.style.width = 100px;
//如果样式中含有减号如background-color在js中是不合法
//记为驼峰命名方法
box1.style.backgroundColor = 'yellow';
//元素.currentStyle.width,用来读取当前正显示和生效的样式
//而不内联的样式，这个只有IE支持，现在IE也停服了。。。
//其他浏览器使用getCoputedStyle()方法获取当前元素样式
//window的方法，可直接使用。传两个参数
//第一个参数：需获取样式的元素 第二个参数可传递一个伪元素，一般为null
var cssObj = getCoputedStyle(box1,null);
console.log(obj.width);/即可获取
事件对象Event
事件冒泡
<body>
<div id= 'box1'>我是父元素box
<span id= 's1'>我是子元素span<span>
</div>
</body>
//事件冒泡(Buddle):事件向上传导，当后代元素触发事件时，其祖先元素的相同事件也会触发
//相同事件比如都是元素都是单击事件，或都是双击事件
//虽大部分冒泡都是有益处的，但是如果不希望发生冒泡，可通过事件对象来取消冒泡。event.cancelBuddle = true;
document.body.onclick = function(){
//触发一次，即span 触发
console.log('body的响应函数');
}
document.getElementById('box1').onclick = function(){
//触发两次，即span div触发
console.log('box1的响应函数');
}
document.getElementById('s1').onclick =
function(e){
//发现控制台连续输出三次，即span div body都触发
console.log('s1的响应函数');
//取消冒泡
e.cancelBuddle = true;
}
事件委派
//事件委派：将事件统一绑定给元素的共同祖先，这样后代触发事件时，通过冒泡就可以触发绑定在祖先元素上的相同事件，因此处理绑定在父元素上的响应事件就可以
//应用场景：子元素颇多，使用循环遍历绑定开销大，且不利于代码维护和功能的扩展性。下面举例说明：
<ul id='ul' >
<li><a src='js'></li>
<li><a src='js'></li>
<li><a src='js'></li>
</ul>
//当我们需要给li或者新增的li增加绑定事件时，只需要给ul添加事件，并给其处理时间即可，即当点击li的时候会向上寻找到ul进行事件的委派
ul.onclick = function(){
console.log('这是给ul的事件委派')
}
Bom
简介
//Bom对象有：
//Window也是网页中的全局对象，表示真个浏览器窗口，document也是Window的属性之一
//Navigator:代表当前浏览器信息、可用来识别不同的浏览器
//Location:代表当前浏览器地址栏、
//History：访问浏览器的历史记录、由于隐私问题不能获取全部的历史记录，只能离开
//Screen:代表浏览器屏幕对象
Window
//获取windoww窗口的尺寸
//window.innerHeight: 浏览器窗口内部高度
//window.innerWidth: 浏览器窗口内部宽度
Navigator
navigator.appCodeName //浏览器代号
navigator.appName //浏览器名称
//navigator的信息具有误导性，不应该用来检测浏览器版本
navigator.appVersion //浏览器版本
navigator.cookieEnabled //启用Cookies
navigator.platform //硬件平台
navigator.userAgent //用户代理
navigator.language //用户代理语言
History
//为了保护隐私，对js范根对象的方法做出限制
history.back() :与浏览器点击后退按钮相同，直接调用
history.forward() :与浏览器点击前进按钮相同，直接调用
history.go():可实现向前向后。参数表示跳转页面的个数。
history.go(1)表示前进一个页面。
history.go(-1)表示后退一个页面。
history.go(0)表示刷新一个页面
Location
location.hostname :web主机域名
location.pathname :返回当前页面的路径和文件名
location.port :返回web主机端口
location.protocol :返回使用的web协议
location.href :返回当前页面的url
location.assign(url):加载新的文档，传入url
定时器
//关键两个方法:
//setInterval():间隔指定的毫秒数不停地执行指定的代码
//每隔3秒钟执行一次函数
var interTime = setInterval(function(),3000);
//如何setInterval()的方法呢，使用clearInterval()
clearInterval(interTime);
//setTimeOut():在指定毫秒数后执行程序
var setTime = setTimeOut(function(),3000);
//如何setInterval()的方法呢，使用clearInterval()
clearTimeOut(setTime );
Cookie
//Cookie的作用就是用于解决“如何记录客户端的用户信息”
//当第一次访问，用户信息记录在Cooike中，在用户下一次访问该页面时，可以在Cooike中访问。Cooike以名值对形式存储。
username = KillPig Li;
//创建和修改Cooike，修改后新的会覆盖旧的
document.cooike = 'username = KillPig Li';
//添加过期时间和浏览器Cooike路径
document.cooike = 'username = KillPig Li;expires = 18 Doe 2043;Path=/ ';
//读取Cooike通过属性document.Cooike
//删除Cooike只需要重新设置过期时间为过去就成
JS Cooike实例
JSON
//JSON用于存储和传输数据的格式，通常用户服务端向网页传送数据，全称JacaScript Object Notation。轻量级 独立 易理解。较容易将Json格式转换成JS对象，语法和JS很像。
//使用js内置函数JSON.parse()将字符串转换成JS对象
var obj = JSON.parse()//JSON字符串转换成JS对象
//JS对象转换成JSON字符串
JSON.stringify()
与XML相同之处
//JSON是纯文本
//JSON有自我描述性，人类可读，易理解
//JSON具有层级结构
//JSON可通过js解析
//JSON数据可通过AJAX进行传输
与XML不同之处
//没有结束标签
//更短
//读写更快
//能够使用js内建的eval()方法进行解析
//使用数组
//不使用保留字
1351
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
