2021-06-24
1、// 用js 实现一个无限极累加的函数， 形如:
add(1) //=> 1;
add(1)(2) //=> 2;
add(1)(2)(3) //=> 6;
add(1)(2)(3)(4) //=> 10;
以此类推
function add(a) {
function temp(b) {
a+=b;
return temp;
}
temp.toString = function() {
return a;
}
return temp;
}
console.log(add(1)(2)(3)); // f 6
2、// 实现 add(1,2,3) == 6, add(1,2,3)() = 6, add(1)(2)(3) = 6, add(1)(2)(3)() = 6
function add () {
console.log(arguments);
console.log([...arguments]);
let res = [...arguments].reduce((a, b)=>{
return a+b;
}, 0);
let temp=function() { // 使用闭包
if(arguments.length){
res+=[...arguments].reduce((a, b)=>{
return a+b;
}, 0); // 累加
return temp;
} else {
return res;
}
}
temp.toString = function() { // 重写toSting() 方法
return res;
}
return temp; // 返回一个函数
}
console.log(add(1,2,3)()) //6
console.log(add(1,2,3)) //f 6
console.log(add(1)(3)) // f 4
console.log(add(1)(3)(5)()) //9
https://blog.csdn.net/PHPxiaoxuesheng/article/details/105286190
3、函数参数不定长
function add(...args) {
return args.reduce((a,b) => a+b);
}
function curry(fn) {
const res = [];
let args = [];
return function _c(...newArgs) {
if(newArgs.length){
args = [...args, ...newArgs];
return _c;
} else {
return fn.apply(this, args);
}
}
}
let addCurry = curry(add)
addCurry(1)(2,3)(4)();
4、过滤树形数据，把符合条件的数据过滤出来，树形数据如下：
const objarr= [{
"id": 1,
"isshow": true,
"children": [{
"id": 2,
"isshow": true,
"children": [{
"id": 100268,
"isshow": false,
"showname": "ccccc"
}, {
"id": 6,
"isshow": true,
"showname": "纯纯粹粹"
}, {
"id": 100500,
"isshow": true,
"showname": "666"
}],
"showname": "1.1猜猜猜等到"
}],
"showname": "嗯哼"
}, {
"id": 3,
"isshow": true,
"children": [{
"id": 4,
"isshow": true,
"showname": "2.1"
}, {
"id": 5,
"isshow": true,
"showname": "纯纯粹粹纯纯粹粹"
}],
"showname": "2"
}, {
"id": 100121,
"isshow": true,
"children": [{
"id": 100122,
"isshow": true,
"showname": "vvv v"
}],
"showname": "单位名称"
}]
function convert(arr) {
const newArr = arr.filter(item => item.isshow);
// console.log(newArr);
return newArr.map(item => {
if (item.children) {
item.children = convert(item.children);
}
return item;
})
}
const arr = convert(objarr);
console.log(arr);
// 菜单列表
const menuList = [{
name: '系统管理',
code: 'system_manage',
children: [{
name: '用户管理',
code: 'user_manage',
children: [{
name: '添加用户',
code: 'add_user'
}, {
name: '编辑用户',
code: 'edit_user'
}, {
name: '删除用户',
code: 'del_user'
}]
}, {
name: '角色管理',
code: 'role_manage',
children: [{
name: '添加角色',
code: 'add_role'
}]
}]
}, {
name: '业务管理',
code: 'bus_manage',
children: [{
name: '流程管理',
code: 'process_manage'
}]
}, {
name: '订单管理',
code: 'order_manage'
}]
// 权限列表
const myMenuCode = ['system_manage', 'user_manage', 'add_user', 'order_manage']
const filterMenu = (menuList, menuCode) => {
return menuList.filter(item => {
return menuCode.indexOf(item.code) > -1
}).map(item => {
item = Object.assign({}, item)
if (item.children) {
item.children = filterMenu(item.children, menuCode)
}
return item
})
}
// 过滤后的菜单
const myMenu = filterMenu(menuList, myMenuCode)
console.log(myMenu)
3、js常见的安全漏洞问题及解决方案
4、require和import的区别
https://zhuanlan.zhihu.com/p/121770261
1）require是运行时调用，所以可以随处引入
import是编译时调用，必须放在文件开头引入，目前部分浏览器不支持，需要用
babel把es6转成es5再执行。
2）
import（es6语法）
主要有俩个功能：export和import
export用于对外输出本模块（一个文件可以理解为一个模块）变量的接口
import用于在一个模块中加载export输出变量的接口。
require（CommandJS规范 ，在nodejs中使用）
在nodejs环境中，我们采用的是CommandJS模块规范，使用require引入模块， 使用module.exports导出接口
5 、实现把一个字符串的大写转成小写、小写转为大写
0 ~ 9 (Unicode编码值范围：48~57)
a ~ z(Unicode编码值范围：97~122)
A ~ Z(Unicode编码值范围：[65~90])
// js 将字符串反转
function strReverse(str) {
var tmp = str.split('');
return (tmp.reverse()).join('');
}
console.log(strReverse('abcdef'))
// js 将字符串中的大写变成小写,小写变成大写
function strChange(arg) {
var str=arg.split('');
for(var i = 0; i < str.length; i++) {
if (str[i].charCodeAt() >= 65 && str[i].charCodeAt() <= 90) {
str[i] = str[i].toLowerCase();
} else {
str[i] = str[i].toUpperCase();
}
}
return str.join('');
}
console.log(strChange('abcERdsQ2d'))
var str = '123adaAWEEER';
Array.prototype.map.call(str,a=>a.toUpperCase(a)==a?a.toLowerCase():a.toUpperCase()).join('');
【代码分析：】
利用数组的map方法将字符串变成字符数组循环操作，最后将大小写互换后的字符数组再拼接成字符串。
互换逻辑：按字符转换，先转成大写与原字符比较如果相等说明它是大写，则调用转换为小写的方法，否则调用转换为大写的方法。
6、 Set Map weakMap weakSet的区别以及map和普通的对象有什么区别？
https://blog.csdn.net/qq_30101131/article/details/88544297
https://blog.csdn.net/weixin_40073115/article/details/104014232
https://www.cnblogs.com/magicg/p/13131383.html
set
set定义及特征
- 在js中Set 对象允许存储任何类型的唯一值，无论是原始值或者是对象引用。
- 顶层数据结构不具备key—>value特征,内部会自动加index序列。
- 可以存储不同类型的任何数据。
set方法
size属性: 返回集合的元素个数。（类似数组的长度length）
add(value)方法: 向集合中添加一个元素value。注意：如果向集合中添加一个已经存在的元素，不报错但是集合不会改变。
delete(value)方法: 从集合中删除元素value。
has(value)方法: 判断value是否在集合中，返回true或false.
clear()方法: 清空集合。
set应用场景
鉴于set存储值的不重复特性，经常被用来求数组去重，交集，并集，差集等操作。
1、数组去重
let arry = [1, 2, 3, 4, 4,1,2,3,2];
var mySet = new Set(arry);
let newArry = [...mySet]; // [1, 2, 3, 4]
2、求并集，交集,差集。
//set求并集
let arryA= [2,3,4,5,6],arryB = [3,4,5,6,7,8];
let setAB = new Set([...arryA,...arryB]);
let newArryAB = [...setAB];
console.log(newArryAB); //[2,3,4,5,6,7,8]
//求交集
let arryC= [2,3,4,5,6],arryD = [3,4,5,6,7,8];
let setC = new Set(arryC);
let setD = new Set(arryD);
let newArryC_D = arryA.filter(x=>setD.has(x));
console.log(newArryC_D); //[3,4,5,6]
//求差集
let newArryD_C = arryA.filter(x=>!setD.has(x));
let newArryD_D = arryB.filter(x=>!setC.has(x));
let newArryCD = [...newArryD_C,...newArryD_D];
console.log(newArryCD); //[2,7,8]
map
map定义及特征
Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。
Map常用属性及增删改查方法:
size: 属性，取出字典的长度
set(key, value)：方法，向字典中添加新元素
get(key)：方法，通过键查找特定的数值并返回
has(key)：方法，判断字典中是否存在键key
delete(key)：方法，通过键 key 从字典中移除对应的数据
clear()：方法，将这个字典中的所有元素删除
Map 和 Object 的区别
(https://www.cnblogs.com/ysx215/p/11387938.html)
####### 1、Key filed
在 Object 中， key 必须是简单数据类型（整数，字符串或者是 symbol），而在 Map 中则可以是 JavaScript 支持的所有数据类型，也就是说可以用一个 Object 来当做一个Map元素的 key。
####### 2、元素顺序
Map 元素的顺序遵循插入的顺序，而 Object 的则没有这一特性。
####### 3、继承
Map 继承自 Object 对象。
map的遍历
for … of
forEach
for(let [key,value] of map){
console.log("key:"+JSON.stringify(key)+"-------value:"+JSON.stringify(value))
}
map.forEach((value,key)=>{
console.log("key:"+JSON.stringify(key)+"-------value:"+JSON.stringify(value))
})
map与数组之间的转换
let arryK = [[1,2],[3,4],[5,6]];
let mapK = new Map(arryK);
let mapP = Array.from(mapK);
console.log(mapK);
console.log(mapP);
WeakSet
和Set结构类似，也是不重复的值的集合，但WeakSet的成员只能是对象。
WeakSet的API：add() //增 ；delete() //删； has() //是否存在
注意：ws没有size属性，不可遍历。因为WeakSet的成员都是弱引用，随时可能消失，成员是不稳定的。
WeakSet的用处：
（1）使用ws储存DOM节点，就不用担心节点从文档移除时，会引发内存泄漏（即在被移除的节点上绑定的click等事件）。
（2）下面代码保证了Foo的实例方法，只能在Foo的实例上调用。这里使用 WeakSet 的好处是，foos对实例的引用，不会被计入内存回收机制，所以删除实例的时候，不用考虑foos，也不会出现内存泄漏。
WeakMap与Map的区别:
WeakMap 对象是一组键值对的集合，其中的键是弱引用对象，而值可以是任意。
注意，WeakMap 弱引用的只是键名，而不是键值。键值依然是正常引用。
WeakMap 中，每个键对自己所引用对象的引用都是弱引用，在没有其他引用和该键引用同一对象，这个对象将会被垃圾回收（相应的key则变成无效的），所以，WeakMap 的 key 是不可枚举的。
用WeakMap来实现私有属性
7、http中简单请求和复杂请求的区别
setTimeout、setInterval的区别
setTimeout() 只执行 code 一次。如果要多次调用，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。
方法一 es6块级作用域let
function count(){
for (let i=0; i<5; i++) {
setTimeout(() => console.log(i), 1000*i)
}
}
count() // 0 1 2 3 4
// 函数表达式的写法和上面写法效果一样
function count(){
for (let i=0; i<5; i++) {
(function(){
setTimeout(() => console.log(i), 1000*i)
})()
}
}
count()
方法二 es5写法：自执行函数
function count(){
for (var i=0; i<5; i++) {
(function(i){
setTimeout(() => console.log(i), 1000*i)
})(i)
}
}
count()
for(var i = 0;i<10;i++){
setTimeout(function(){
console.log(i)
},100)
} // 输出全是10( 10个10)
// 输出全是10的原因是因为i是全局变量，最后访问的都是全局变量i，而每次循环改变i的值就是改变全局变量的值，故而输出值均为10
// 之前对于这种问题的解决办法是通过闭包来实现
for(let i = 0;i<10;i++){
setTimeout(function(){
console.log(i)
},100)
} // 输出0123456789;
8、实现一个执行多次的有间隔的定时器函数
const repeatFunc = repeat(console.log, 4, 3000)
repeatFunc("helloworld")//会输出四次helloworld，每次间隔3s
//方法一 利用setInterval
function repeat (func, times, wait) {
return function(content){
var count = 0;
var interval = setInterval(function(){
count += 1;
func(content);
if(count === times){
clearInterval(interval);
}
}, wait);
}
}
const repeatFunc = repeat(alert, 4, 3000)
repeatFunc("hellworld");
// 方法二
function repeat(func, count, wait) {
return async function(...arg){
for(let i=0;i<count;i++){
await new Promise(function(resolve,reject){
setTimeout(() => {
func.apply(this,arg)
resolve()
}, wait);
})
}
}
}
const repeatFunc = repeat(console.log, 4, 3000)
repeatFunc("helloworld")
