你真的会使用数组map,slice,splice?

112 阅读2分钟

1.数组slice和splice的区别?

1.slice  纯函数
    const arr1 = arr.slice();      // 类似复制了一份
    const arr2 = arr.slice(1, 4);  // 索引为1开始截取到4
    const arr3 = arr.slice(2);     // 索引为2向后开始截取
    const arr4 = arr.slice(-2);    // 截取数组最后俩位
    
2.splice 非纯函数
  const arr = [1,2,3,4,5,6,7,8,9]
  (1) 剪切加填充
    const arr1 = arr.splice(1,2, '三', '四') // 将索引1-2的剪切出来,空出来的替换为后面的张三,李四
    console.log(arr); // [1, '三', '四',4, 5, 6, 7, 8, 9]
    console.log(arr1); // [ 2, 3 ] 
  (2) 只剪切
    const arr1 = arr.splice(1,2)  // 只剪切不填充
    console.log(arr); // [1,4, 5, 6, 7, 8, 9]
    console.log(arr1); // [ 2, 3 ] 
  (3) 不剪切 只添加
    const arr1 = arr.splice(1,0, 'abc', 'def');  // 1开始0结束表示直接添加
    console.log(arr); // [1, 'abc', 'def', 2, 3, 4, 5, 6, 7, 8, 9]
    console.log(arr1); // [ 2, 3 ] 

2.[10, 20, 30].map(parseInt) 返回结果是什么?

const result = [10, 20, 30].map(parseInt)
console.log(result);  // [ 10, NaN, NaN ]

// 拆分
[10, 20, 30].map((num, idx)=>{
    return parseInt(num, idx)
})
parseInt(10, 0) // item = 10, idx = 0  10
parseInt(20, 1) // item = 20, idx = 1  NaN
parseInt(30, 2) // item = 30, idx = 2  NaN

parseInt(string,radix)俩个参数,一个是字符串,另一个是被解析值的进制radix
如果第一个传入的不是字符串,则会默认使用toString()来转化
radix 该参数为可选,default10,值在2~36之间

3.ajax get请求和post的区别?

get
    1.get用于查询用户操作
    2.get参数是拼接在url上面的
post
    1.一般用户提交操作
    2.post放在请求体内(数据体积大的时候)
安全性
    post 容易防止CSRF

4.如何预防 xss 攻击

  • 常见的web前端攻击方式有哪些?
  • 1.XSS跨站请求攻击
  • 2.XSRF跨站请求伪造
比如一个博客网站,发表一篇博客,其中嵌入<script> 脚本
1.脚本内容: 获取cookie,发送到我的服务器(服务器配合跨域)
2.发布这篇博客,有人查看它,我轻松收割访问者的cookie

解决方法:
1.替换特殊字符,比如< 变为&lt; >变为&gt;
2.<script> 变为&lt;script&gt; 直接显示,不会做为脚本执行
3.前端显示的时候替换,后端存储的时候替换

5.如何预防 xsrf攻击

1.使用POST接口
2.增加验证,例如密码,短信验证登录,指纹等安全措施