JavaScript 对象

数组去重

    var arr = [1, 2, 3, 3, 4];console.log(...new Set(arr))>> [1, 2, 3, 4]const deDupe = (myArray) => [... new Set(myArray)];deDupe([1, 1, 2, 1, 3, 3, 4])// [1, 2, 3, 4]

创建一个空对象

 let dict = Object.create(null);dict.__proto__ === "undefined"

for in/for of

// 数组
var A=[4,6,74,67];
for in:拿到的是数组下标for (let i in A){
console.log(i);  //0，1，2，3
}for of:拿到的是数组元素for (let i of A){
console.log(i);
}
------------------------------------------------------------------------
//字符串
var str="hellllo world";
for in:拿到的是字符串下标for (let i in str){console.log(i) //0 1 2 3 4 5 6 7 8 9 10 11 12
}for of:拿到的是字符串中的字符for (let i of str){console.log(i);//  h e l l l l o   w o r l d
}

合并对象

    const page = {current: 1,pageSize: 10}const form = {name: "",sex: ""}const params = {...form, ...page};/*{name: "",sex: "",current: 1,pageSize: 10}*

函数参数必须

如果需要检测某些参数是必传时,可以这么做

    const isRequired = () => { throw new Error('param is required'); };const hello = (name = isRequired()) => { console.log(`hello ${name}`) };// 这里将抛出一个错误,因为名字时必须hello();// 这也将抛出一个错误hello(undefined);// 正常hello(null);hello('David');

解构赋值时使用别名

var middle = [3, 4];
var arr = [1, 2, ...middle, 5, 6];
console.log(arr);
// [1, 2, 3, 4, 5, 6]对象的解构
通过解构对象，你可以把它的每个属性与不同的变量绑定，首先指定被绑定的属性，然后紧跟一个要解构的变量。var robotA = { name: "Bender" };var robotB = { name: "Flexo" };var { name: nameA } = robotA;var { name: nameB } = robotB;console.log(nameA);// "Bender"console.log(nameB);// "Flexo"
当属性名与变量名一致时，可以通过一种实用的句法简写：var { foo, bar } = { foo: "lorem", bar: "ipsum" };console.log(foo);// "lorem"console.log(bar);// "ipsum"
与数组解构一样，你可以随意嵌套并进一步组合对象解构：var complicatedObj = {arrayProp: ["Zapp",{ second: "Brannigan" }]};var { arrayProp: [first, { second }] } = complicatedObj;console.log(first);// "Zapp"console.log(second);// "Brannigan"
当你解构一个未定义的属性时，得到的值为undefined：var { missing } = {};console.log(missing);// undefined
请注意，当你解构对象并赋值给变量时，如果你已经声明或不打算声明这些变量（亦即赋值语句前没有let、const或var关键字），你应该注意这样一个潜在的语法错误：{ blowUp } = { blowUp: 10 };// Syntax error 语法错误
为什么会出错？这是因为JavaScript语法通知解析引擎将任何以{开始的语句解析为一个块语句（例如，{console}是一个合法块语句）。解决方案是将整个表达式用一对小括号包裹：({ safe } = {});// No errors 没有语法错误
----------------------------------------------------------------------------------------
数组与迭代器的解构
以上是数组解构赋值的一个简单示例，其语法的一般形式为：[ variable1, variable2, ..., variableN ] = array;
这将为variable1到variableN的变量赋予数组中相应元素项的值。如果你想在赋值的同时声明变量，可在赋值语句前加入var、let或const关键字，例如：var [ variable1, variable2, ..., variableN ] = array;let [ variable1, variable2, ..., variableN ] = array;const [ variable1, variable2, ..., variableN ] = array;
事实上，用变量来描述并不恰当，因为你可以对任意深度的嵌套数组进行解构：var [foo, [[bar], baz]] = [1, [[2], 3]];console.log(foo);// 1console.log(bar);// 2console.log(baz);// 3
此外，你可以在对应位留空来跳过被解构数组中的某些元素：var [,,third] = ["foo", "bar", "baz"];console.log(third);// "baz"
而且你还可以通过“不定参数”模式捕获数组中的所有尾随元素：var [head, ...tail] = [1, 2, 3, 4];console.log(tail);// [2, 3, 4]
当访问空数组或越界访问数组时，对其解构与对其索引的行为一致，最终得到的结果都是：undefined。console.log([][0]);// undefinedvar [missing] = [];console.log(missing);// undefined
请注意，数组解构赋值的模式同样适用于任意迭代器：function* fibs() {var a = 0;var b = 1;while (true) {yield a;[a, b] = [b, a + b];}}var [first, second, third, fourth, fifth, sixth] = fibs();console.log(sixth);// 5

获取查询参数（获取url中的参数）

过 URLSearchParams API 来获取查询参数

在不使用 URLSearchParams 我们通过正则的方式来完成获取查询参数的, 如下:

 function getQueryString(name) {var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");var r = window.location.search.substr(1).match(reg);return r ? r[2] : null;}

使用 URLSearchParams 之后:

 // 假设地址栏中查询参数是这样 "?post=1234&action=edit"var urlParams = new URLSearchParams(window.location.search);console.log(urlParams.has('post')); // trueconsole.log(urlParams.get('action')); // "edit"console.log(urlParams.getAll('action')); // ["edit"]console.log(urlParams.toString()); // "?post=1234&action=edit"console.log(urlParams.append('active', '1')); // "?post=1234&action=edit&active=1"

替换数组中指定的值

.split(start, 要删除的值，要添加的值)，然后设置好三个参数，指明希望从哪里修改、要修改几个值，以及新的值是什么。

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
fruits.splice(0, 2, “potato”, “tomato”);
console.log(fruits); // returns [“potato”, “tomato”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”]

清空数组

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];fruits.length = 0;
console.log(fruits); // returns []

将数组转化为对象

var fruits = [“banana”, “apple”, “orange”, “watermelon”];
var fruitsObj = { …fruits };
console.log(fruitsObj); // returns {0: “banana”, 1: “apple”, 2: “orange”, 3: “watermelon”, 4: “apple”, 5: “orange”, 6: “grape”, 7: “apple”}

求两个数组的交集

var numOne = [0, 2, 4, 6, 8, 8];
var numTwo = [1, 2, 3, 4, 5, 6];
var duplicatedValues = […new Set(numOne)].filter(item => numTwo.includes(item));
console.log(duplicatedValues); // returns [2, 4, 6]或者
const similarity = (arr, values) => arr.filter(v => values.includes(v));
similarity([1, 2, 3], [1, 2, 4]); // [1,2]

反转数组

var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var reversedColors = colors.reverse();
console.log(reversedColors); // returns [“brown”, “black”, “yellow”, “orange”, “purple”, “pink”, “navy”, “green”, “white”, “blue”]

.lastIndexOf()方法

可以让我们找出指定元素最后出现的位置。例如，如果数组中有重复元素，那么可以找出该元素最后出现的位置。代码如下：

var nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7];
var lastIndex = nums.lastIndexOf(5);
console.log(lastIndex); // returns 9

对数组中的所有值求和

var nums = [1, 5, 2, 6];
var sum = nums.reduce((x, y) => x + y);
console.log(sum); // returns 14

交换变量

let a = 1;
let b = 2;
[a, b] = [b, a] // a = 2 b = 1

过滤对象数组

const reducedFilter = (data, keys, fn) =>data.filter(fn).map(el =>keys.reduce((acc, key) => {acc[key] =el[key];return acc;}, {}));
const data = [{id: 1,name: 'john',age: 24},{id: 2,name: 'mike',age: 50}
];let a = reducedFilter(data, ['id', 'name'], item => item.age > 24); // [{ id: 2, name: 'mike'}]

获取两个日期相差天数

const getDaysDiffBetweenDates = (dateInitial, dateFinal) => (dateFinal - dateInitial) / (1000 * 3600 * 24);
getDaysDiffBetweenDates(new Date('2017-12-13'), new Date('2017-12-22')); // 9

数组对象去重

    // js 去掉数组对象中的重复对象deteleObject (obj) {var uniques = []var stringify = {}for (var i = 0; i < obj.length; i++) {var keys = Object.keys(obj[i])keys.sort(function (a, b) {return (Number(a) - Number(b))})var str = ''for (var j = 0; j < keys.length; j++) {str += JSON.stringify(keys[j])str += JSON.stringify(obj[i][keys[j]])}if (!stringify.hasOwnProperty(str)) {uniques.push(obj[i])stringify[str] = true}}return uniques},

对象的两种取值方式

let obj = {name: 'wan'};
console.log(obj.name);  //wanlet obj = {name: 'wan'};
console.log(obj[name]);  //wan·······································································
let data = []
data.unshift({label: '全部',value: ''
})
for (let i = 0; i < res.data.length; i++) {data.push({label: res.data[i].name,value: res.data[i].id})
}
········································································
var arr = []
for (let i in obj) {let o = {};o[i] = obj[i];arr.push(o)
}
console.log(arr);

some() 和 every()

every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。

every() 方法使用指定函数检测数组中的所有元素：

如果数组中检测到有一个元素不满足，则整个表达式返回 false，且剩余的元素不会再进行检测。
如果所有元素都满足条件，则返回 true。

注意：every() 不会对空数组进行检测。

注意：every() 不会改变原始数组。

some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。

some() 方法会依次执行数组的每个元素：

如果有一个元素满足条件，则表达式返回true, 剩余的元素不会再执行检测。
如果没有满足条件的元素，则返回false。

注意：some() 不会对空数组进行检测。

注意：some() 不会改变原始数组。

//currentValue   必须。当前元素的值
//index 可选。当前元素的索引值
//arr   可选。当前元素属于的数组对象array.some(function(currentValue,index,arr),thisValue)
array.every(function(currentValue,index,arr),thisValue)/** * 计算对象数组中每个电脑的扣件系统是否可用,大于16位操作系统表示可用,否则不可用
*/
var computers = [{name:"Apple",ram:8},{name:"IBM",ram:4},{name:"Acer",ram:32},
];var result= computers.every(function(computer){return computer.ram > 16
})
console.log(result)//false;
var some = computers.some(function(computer){return computer.ram > 16
})
console.log(some)//true;

join() 和 split()

join将数组的每一位按特定符号拼接，split()将字符串按特定符号分割成数组

const str = 'The quick brown fox jumps over the lazy dog.';const words = str.split(' ');
console.log(words[3]);let ssdwStrs = []sortSsdwItems.forEach(item => {ssdwStrs.push(item.showText())})return ssdwStrs.join('；')

用!!运算符转换为布尔值

一个简单的!!variable会自动将数据转换为布尔值，而且该变量只有在含有0、null、""、undefined或NaN这样的值时才会返回到false，否则会返回到true。

replace()

方法返回一个由替换值（replacement）替换一些或所有匹配的模式（pattern）后的新字符串。模式可以是一个字符串或者一个正则表达式，替换值可以是一个字符串或者一个每次匹配都要调用的回调函数

const p = 'The quick brown fox jumps over the lazy dog. If the dog reacted, was it really lazy?';const regex = /dog/gi;console.log(p.replace(regex, 'ferret'));
// expected output: "The quick brown fox jumps over the lazy ferret. If the ferret reacted, was it really lazy?"console.log(p.replace('dog', 'monkey'));
// expected output: "The quick brown fox jumps over the lazy monkey. If the dog reacted, was it really lazy?"

padEnd()

方法会用一个字符串填充当前字符串（如果需要的话则重复填充），返回填充后达到指定长度的字符串。从当前字符串的末尾（右侧）开始填充

'abc'.padEnd(10);          // "abc       "
'abc'.padEnd(10, "foo");   // "abcfoofoof"
'abc'.padEnd(6, "123456"); // "abc123"
'abc'.padEnd(1);           // "abc"

includes（）

方法用于判断一个字符串或者数组是否包含在另一个字符串中，根据情况返回 true 或 false。

var str = 'To be, or not to be, that is the question.';console.log(str.includes('To be'));       // true
console.log(str.includes('question'));    // true
console.log(str.includes('nonexistent')); // false
console.log(str.includes('To be', 1));    // false
console.log(str.includes('TO BE'));       // falsevar a=[CODE.YWLX.MSAJ_MSYS, CODE.YWLX.XZAJ_XZYS, CODE.YWLX.XSAJ_XSYS, CODE.YWLX.MSAJ_TJXYSFQR]a.includes(this.faTableData[i].ywlx)

splice()

splice() 方法用于添加或删除数组中的元素。

注意：这种方法会改变原始数组。

splice() 的返回值：如果仅删除一个元素，则返回一个元素的数组。如果未删除任何元素，则返回空数组。

//index  必需。规定从何处添加/删除元素。 该参数是开始插入和（或）删除的数组元素的下标，必须是数字。
//howmany   必需。规定应该删除多少元素。必须是数字，但可以是 "0"。 如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。
//item1, ..., itemX 可选。要添加到数组的新元素array.splice(index,howmany,item1,.....,itemX)const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "June"]months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

unshift()

方法将一个或多个元素添加到数组的开头，并返回该数组的新长度(该方法修改原有数组)。

const array1 = [1, 2, 3];console.log(array1.unshift(4, 5));
// expected output: 5console.log(array1);
// expected output: Array [4, 5, 1, 2, 3]

slice()

方法返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝（包括 begin，不包括end）。原始数组不会被改变。截取数组

   var param = []// 将数组切割成50个为一组的数组for (var i = 0, len = this.fackParams.kfary.length; i < len; i += 50) {param.push(this.fackParams.kfary.slice(i, i + 50))}

reverse()

方法将数组中元素的位置颠倒，并返回该数组。数组的第一个元素会变成最后一个，数组的最后一个元素变成第一个。该方法会改变原数组。

const array1 = ['one', 'two', 'three'];
console.log('array1:', array1);
// expected output: "array1:" Array ["one", "two", "three"]const reversed = array1.reverse();
console.log('reversed:', reversed);
// expected output: "reversed:" Array ["three", "two", "one"]// Careful: reverse is destructive -- it changes the original array.
console.log('array1:', array1);
// expected output: "array1:" Array ["three", "two", "one"]

reduce()

方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值。

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

reduce() 可以作为一个高阶函数，用于函数的 compose。

注意:reduce() 对于空数组是不会执行回调函数的。

//total  必需。初始值, 或者计算结束后的返回值。
//currentValue  必需。当前元素
//currentIndex  可选。当前元素的索引
//arr   可选。当前元素所属的数组对象。
//initialValue  可选。传递给函数的初始值
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// expected output: 15

pop()

方法从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度。

const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];console.log(plants.pop());
// expected output: "tomato"console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage", "kale"]plants.pop();console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage"]

map()

map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素。

forEach()方法不会返回执行结果，而是undefined。也就是说，forEach()会修改原来的数组。而map()方法会得到一个新的数组并返回。

注意：map() 不会对空数组进行检测。

注意：map() 不会改变原始数组。（在操作得当！！！！）

map是不会改变原数组的( 在不违背map的使用原则的情况下). 对于数组中的值是基本数据类型的情况是完全不会修改原数组的. 但是在数据中的值是引用类型的情况下,如果使用不恰当会改变原数组.

对象是引用类型, 传递的是地址, 所以你的 item.key = index 会修改原数组中的 对象（重点！！！！！）

引用数据类型和基本数据类型两种类型的区别

声明变量时不同的内存分配
- 基本数据类型: 存储在栈(stack)中的简单数据段. 也就是说, 它们的值直接储存在变量访问的位置. 这是因为这些原始类型占据的空间是固定的, 所以可以将它们存储在较小的内存区域 - 栈中. 这样存储便于迅速查找变量的值.
- 引用数据类型: 存储在堆(heap)中的复杂数据对象. 也就是说储存在变量出的值是一个指向堆内存的一个引用地址(有人称为指针). 这是因为: 引用值的大小会改变, 所以不能把它放到栈中, 否则会降低变量查寻的速度. 相反，放在变量的栈空间中的值是该对象存储在堆中的地址。地址的大小是固定的，所以把它存储在栈中对变量性能无任何负面影响。
不同的内存分配机制也带来了不同的访问机制
- 在javascript中是不允许直接访问保存在堆内存中的对象的，所以在访问一个对象时，首先得到的是这个对象在堆内存中的地址，然后再按照这个地址去获得这个对象中的值，这就是传说中的按引用访问
- 而原始类型的值则是可以直接访问到的
复制变量时的不同
- 原始值：在将一个保存着原始值的变量复制给另一个变量时，会将原始值的副本赋值给新变量，此后这两个变量是完全独立的，他们只是拥有相同的value而已
- 引用值：在将一个保存着对象内存地址的变量复制给另一个变量时，会把这个内存地址赋值给新变量，也就是说这两个变量都指向了堆内存中的同一个对象，他们中任何一个作出的改变都会反映在另一个身上。（这里要理解的一点就是，复制对象时并不会在堆内存中新生成一个一模一样的对象，只是多了一个保存指向这个对象指针的变量罢了）。多了一个指针
参数传递的不同（把实参复制给形参的过程）

首先我们应该明确一点：ECMAScript中所有函数的参数都是按值来传递的。但是为什么涉及到原始类型与引用类型的值时仍然有区别呢？还不就是因为内存分配时的差别
- 原始值：只是把变量里的值传递给参数，之后参数和这个变量互不影响
- 引用值：对象变量它里面的值是这个对象在堆内存中的内存地址，这一点你要时刻铭记在心！因此它传递的值也就是这个内存地址，这也就是为什么函数内部对这个参数的修改会体现在外部的原因了，因为它们都指向同一个对象

//currentValue   必须。当前元素的值
//index 可选。当前元素的索引值
//arr   可选。当前元素属于的数组对象
thisValue   可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。array.map(function(currentValue,index,arr), thisValue)const array1 = [1, 4, 9, 16];// pass a function to map
const map1 = array1.map(x => x * 2);console.log(map1);
// expected output: Array [2, 8, 18, 32]//map也会改变原数组let items = [{name: 'tom'},{name: 'tony'}
]
// good: 这样原数组不会影响
let result = item.map(item=> {return {...item,gender: 'male'}
})
// bad: 这用会修改原数组
let result2 = item.map(item=> item.gender: 'male')  // 我之前总是这样用

forEach()

foreach()：foreach方法中的function回调有三个参数：第一个参数是遍历的数组内容，第二个参数是对应的数组索引，第三个参数是数组本身。map的用法和foreach一样。forEach()方法不会返回执行结果，而是undefined。也就是说，forEach()会修改原来的数组。而map()方法会得到一个新的数组并返回。

注意:forEach() 对于空数组是不会执行回调函数的。

//currentValue   必需。当前元素
//index 可选。当前元素的索引值。
//arr   可选。当前元素所属的数组对象。
//可选。传递给函数的值一般用 "this" 值。 如果这个参数为空， "undefined" 会传递给 "this" 值
array.forEach(function(currentValue, index, arr), thisValue)const array1 = ['a', 'b', 'c'];array1.forEach(element => console.log(element));// expected output: "a"
// expected output: "b"
// expected output: "c"

find()

find() 方法返回通过测试（函数内判断）的数组的第一个元素的值。

find() 方法为数组中的每个元素都调用一次函数执行：

当数组中的元素在测试条件时返回 true时, find() 返回符合条件的元素，之后的值不会再调用执行函数。
如果没有符合条件的元素返回 undefined

注意:find() 对于空数组，函数是不会执行的。

注意:find() 并没有改变数组的原始值。

const array1 = [5, 12, 8, 130, 44];const found = array1.find(element => element > 10);console.log(found);
// expected output: 12

filter()

filter()：方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素；return后面判断结果，取布尔值，true的话就添入新的filter数组中，false的话，不会添进filter的数组中。

注意：filter() 不会对空数组进行检测。

注意：filter() 不会改变原始数组。

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];const result = words.filter(word => word.length > 6);console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

concat()

方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);console.log(array3);
// expected output: Array ["a", "b", "c", "d", "e", "f"]

Array.of()

方法创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型。

Array.of(7);       // [7]
Array.of(1, 2, 3); // [1, 2, 3]Array(7);          // [ , , , , , , ]
Array(1, 2, 3);    // [1, 2, 3]

Array.isArray()

isArray() 方法用于判断一个对象是否为数组。

如果对象是数组返回 true，否则返回 false。

Array.isArray([1, 2, 3]);
// true
Array.isArray({foo: 123});
// false
Array.isArray("foobar");
// false
Array.isArray(undefined);
// false

Array.from()

from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。

如果对象是数组返回 true，否则返回 false。

//object 必需，要转换为数组的对象。
//mapFunction   可选，数组中每个元素要调用的函数。
//thisValue 可选，映射函数(mapFunction)中的 this 对象。
Array.from(object, mapFunction, thisValue) var arr = Array.from([1, 2, 3], x => x * 10);
// arr[0] == 10;
// arr[1] == 20;
// arr[2] == 30;

Math

Math.pow( a, b)a的b次方
Math.round( .6 ) 四舍五入
Math.ceil( .6 ) 向上求整
Math.floor( .6 )向下求整
Math.abs( -4 )求绝对值
Math.max( a，b，c ) 几个数中最大值
Math.min( a，b，c ) 几个数中最小值
Math.random( ) 生成一个大于0小于1的随机数
Math.pow( 3, 1/3 ) 3的立方根

Screen 对象属性（Screen 对象包含有关客户端显示屏幕的信息。）

availHeight 属性声明了显示浏览器的屏幕的可用高度，以像素计。在 Windows 这样的操作系统中，这个可用高度不包括分配给半永久特性（如屏幕底部的任务栏）的垂直空间。

screen.availHeight

availWidth 属性声明了显示浏览器的屏幕的可用宽度，以像素计。在 Windows 这样的操作系统中，这个可用高度不包括分配给半永久特性（如屏幕底部的任务栏）的垂直空间。

screen.availWidth

height 属性声明了显示浏览器的屏幕的高度，以像素计。

screen.height

width 属性声明了显示浏览器的屏幕的宽度，以像素计。

screen.width

colorDepth 属性返回目标设备或缓冲器上的调色板的比特深度。

screen.colorDepth

pixelDepth 属性返回显示屏幕的颜色分辨率（比特每像素）。

screen.pixelDepth

History 对象（History 对象包含用户（在浏览器窗口中）访问过的 URL。History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问。）

History 对象属性

length 属性声明了浏览器历史列表中的元素数量。

注意：Internet Explorer和Opera从0开始，而Firefox、Chrome和Safari从1开始。

history.length

History 对象方法

back() 方法可加载历史列表中的前一个 URL（如果存在）。

调用该方法的效果等价于点击后退按钮或调用 history.go(-1)。

history.back()

forward() 方法可加载历史列表中的下一个 URL。

调用该方法的效果等价于点击前进按钮或调用 history.go(1)。

history.forward()

go() 方法可加载历史列表中的某个具体的页面。

该参数可以是数字，使用的是要访问的 URL 在 History 的 URL 列表中的相对位置。（-1上一个页面，1前进一个页面)。或一个字符串，字符串必须是局部或完整的URL，该函数会去匹配字符串的第一个URL。

history.go(number|URL)

Location 对象（Location 对象包含有关当前 URL 的信息。Location 对象是 window 对象的一部分，可通过 window.Location 属性对其进行访问。）

Location 对象属性

hash 属性是一个可读可写的字符串，该字符串是 URL 的锚部分（从 # 号开始的部分）。

location.hash

host 属性是一个可读可写的字符串，可设置或返回当前 URL 的主机名称和端口号。

location.host

hostname 属性是一个可读可写的字符串，可设置或返回当前 URL 的主机名。

location.hostname

href 属性是一个可读可写的字符串，可设置或返回当前显示的文档的完整 URL。

location.href

pathname 属性是一个可读可写的字符串，可设置或返回当前 URL 的路径部分。

location.pathname

port 属性是一个可读可写的字符串，可设置或返回当前 URL 的端口部分。

注意：如果端口号就是80（这是默认的端口号)，无需指定。

location.port

protocol 属性是一个可读可写的字符串，可设置或返回当前 URL 的协议。

location.protocol

search 属性是一个可读可写的字符串，可设置或返回当前 URL 的查询部分（问号 ? 之后的部分）。

location.search

Location 对象方法

assign()方法加载一个新的文档。

location.assign(URL)

重新载入当前文档:

location.reload();

replace() 方法可用一个新文档取代当前文档。

location.replace(newURL)

Navigator 对象（Navigator 对象包含有关浏览器的信息。）

Navigator 对象属性

appCodeName 属性是一个只读字符串，声明了浏览器的代码名。

navigator.appCodeName

appName 属性可返回浏览器的名称。

navigator.appName

appVersion 属性可返回浏览器的平台和版本信息。该属性是一个只读的字符串。

navigator.appVersion

cookieEnabled 属性可返回一个布尔值，如果浏览器启用了 cookie，该属性值为 true。如果禁用了 cookie，则值为 false。

navigator.cookieEnabled

platform 属性是一个只读的字符串，声明了运行浏览器的操作系统和（或）硬件平台。

navigator.platform

userAgent 属性是一个只读的字符串，声明了浏览器用于 HTTP 请求的用户代理头的值。

navigator.userAgent

Navigator 对象方法

javaEnabled() 方法可返回一个布尔值，该值指示浏览器是否支持并启用了 Java。如果是，则返回 true，否则返回 false。

navigator.javaEnabled()

taintEnabled() 方法可返回一个布尔值，该值声明了当前浏览器是否启用了数据污点 (data tainting)。

navigator.taintEnabled()

存储对象

Web 存储 API 提供了 sessionStorage （会话存储）和 localStorage（本地存储）两个存储对象来对网页的数据进行添加、删除、修改、查询操作。

存储对象属性

属性	描述
length	返回存储对象中包含多少条数据。

存储对象方法

方法	描述
key(n)	返回存储对象中第 n个键的名称
getItem(keyname)	返回指定键的值
setItem(keyname, value)	添加键和值，如果对应的值存在，则更新该键对应的值。
removeItem(keyname)	移除键
clear()	清除存储对象中所有的键

Web 存储 API

属性	描述
window.localStorage	在浏览器中存储 key/value 对。没有过期时间。
window.sessionStorage	在浏览器中存储 key/value 对。在关闭窗口或标签页之后将会删除这些数据。

localStorage sessionStorage

区别：

localStorage 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除。
sessionStorage 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。
都会在浏览器端保存，有大小限制，同源限制
cookie会在请求时发送到服务器，作为会话标识，服务器可修改cookie；web storage（也就是localStorage和sessionStorage）不会发送到服务器
cookie有path概念，子路径可以访问父路径cookie，父路径不能访问子路径cookie
有效期：cookie在设置的有效期内有效，默认为浏览器关闭；sessionStorage在窗口关闭前有效；localStorage长期有效，直到用户删除；
共享：sessionStorage不能共享，localStorage在同源文档之间共享，cookie在同源且符合path规则的文档之间共享
localStorage的修改会促发其他文档窗口的update事件
cookie有secure属性要求HTTPS传输
浏览器不能保存超过300个cookie，单个服务器不能超过20个，每个cookie不能超过4k。web storage大小支持能达到5M

使用：

有时存储为一个对象Object,会出现读取的返回值为 {object Object}的情况，所以一般存储为字符串再存（个人观点）

存储
sessionStorage.setItem(key, JSON.stringify({ validateResult: validateResult }))
取出
JSON.parse(sessionStorage.getItem(this.zkjaBtach))
删除对应key以及key中的内容
window.localStorage.removeItem('key')
清空所有的key
window.localStorage.clear()

定时器

 //设置有次数的定时请求
autoJa() {this.$refs.autoJa.open()this.countdown = 5this.$nextTick(() => {this.autoJaInterval = setInterval(() => {if (this.countdown == 0) {clearInterval(this.autoJaInterval)this.ja()} else {this.countdown--}}, 1000)})},

JS 大杂烩（持续更新）相关推荐

vue基础教程总结篇，用最短的时间入门vue.js（持续更新...）
目前,vue已经成为前端工程师必会的框架之一,这里简单总结一下,可以让您快速的入门vue,师傅带进门,修行靠个人,最主要的还是自己多动手,多实践,本专栏会持续更新. 1.vue安装教程及简介 2.vu ...
Node.js 学习(持续更新)
JavaWeb前端 Node.js nodejs操作入门 //helloworldjs //类似于:System.out.printIn("Hello world") consol ...
vue开发常用css，js（持续更新）
目录 1.文字溢出显示三个点 2.input 框光标左边距 3.水平垂直居中常用写法 1)position属性实现 2)flex属性实现 4.input框消除空格 5.纯css实现箭头 6.箭头在上面 ...
详细前端面试题javascript篇--持续更新
最新前端面试题汇总大全(超详细含vue,react,css,js,webpack,性能优化等)–持续更新点击查看前端HTML篇前端CSS篇前端面试题js篇--持续更新 1. JS 数据类型 ?存 ...
js中text方法是啥意识_一盏茶的时间，快速捕获JS中常用的方法（细心整理，持续更新ing）...
不知不觉上班一周辽-趁着大好周末,小编挣扎着从床上爬起来,决定对前端日常编程中常用到的一些方法做一个系统的整合. 有些人或许会觉得忘了百度就完事儿,no no no!这事儿小编真的亲践过好多次,百度一 ...
前端知识点总结——JS高级（持续更新中）
前端知识点总结--JS高级(持续更新中) 1.字符串什么是: 连续存储多个字符的字符数组相同: 1. 下标 2. .length 3. 遍历 4. 选取: slice(starti[, endi] ...
关于js的一些常用小知识点（持续更新）
关于js的一些常用小知识点 1.获取页面中所有选中的CheckBox复选框的值 2.js获取网页URL中所带的参数 3.js模拟点击button 4.前端传入后台list,后台是不能接收List的,就 ...
前端面试题总结（js、html、小程序、React、ES6、Vue、算法、全栈热门视频资源）持续更新
文档描述本文是关注微信小程序的开发和面试问题, 由基础到困难循序渐进, 适合面试和开发小程序. 并有热点框架(vue react node.js 全栈)前端资源以及后端视频资源和源码并基于前端进阶 ...
前端面试题精编2020（js、html、小程序、React、ES6、Vue、算法、全栈热门视频资源）持续更新
文档描述本文是关注微信小程序的开发和面试问题, 由基础到困难循序渐进, 适合面试和开发小程序. 并有热点框架(vue react node.js 全栈)前端资源以及后端视频资源和源码并基于前端进阶 ...
前端(js/css/html)那些小的知识点，持续更新......
前端(js/css/html)那些小的知识点,持续更新...... 1.行内元素与块级元素有哪些及区别? 块级元素和行内元素的区别是,块级元素会占一行显示,而行内元素可以在一行并排显示.通过样式控制, ...

JS 大杂烩（持续更新）