07日

关于打包后白屏问题

vue 路径指向问题

vue,config.js添加publicPath: "./",

module.exports = {
  // ...
  publicPath: "./",
}

深浅拷贝问题

浅拷贝 只能复制一层

const a = [1, 2, 3, [4, 5], 6]
const b = [...a]
a[3][1] = 7
a[0] = 2
console.log(a);
console.log(b);

[ 2, 2, 3, [ 4, 7 ], 6 ]
[ 1, 2, 3, [ 4, 7 ], 6 ]

简单来说 拷贝得不彻底

深拷贝就是

将每一个元素都复制过来了 不再是引用

const a = [1, 2, 3, [4, 5], 6]
const b = [...a]
const c = JSON.parse(JSON.stringify(a))
a[3][1] = 7
a[0] = 2
console.log(a);
console.log(b);
console.log(c);

[ 2, 2, 3, [ 4, 7 ], 6 ] //a
[ 1, 2, 3, [ 4, 7 ], 6 ]// b
[ 1, 2, 3, [ 4, 5 ], 6 ]// c

典型案例

对于一维数组 or 一维对象、即 对象里面的都是基本数据类型的 就无所谓，如果数组里面套数组，对象里面套对象 浅拷贝其实对于数组来说还是拷贝的它的地址
比如上面 b[3] 指向的还是a[3]的地址 如果直接 b=a 则是b指向了a的地址 仅此而已

手写 深拷贝

function deepcopy(arr) {
  const c = []
  for (let i in arr) {
    if (typeof arr[i] === 'object') {
      c.push(deepcopy(arr[i]))
    } else {
      c.push(arr[i])
    }
  }
  return c
}

for in for of

const a = ['a', 'b', 'b']
const b = {
  a: 'q',
  b: 'w',
  c: 'e'
}

console.log('for-in-arr');
for (let i in a) {
  console.log(i);
}

console.log('for-in-obj');
for (let i in b) {
  console.log('i');
  console.log(i)
  console.log('obj.i');
  console.log(b.i);
  console.log('obj[i]');
  console.log(b[i]);
}

console.log('for-of-arr');
for (let i of a) {
  console.log(i);
}

// console.log('for-of-obj');
// for (let i of b) {
//   console.log(i)
// }
//结果：
for-in-arr
0
1
2
for-in-obj
i
a
obj.i
undefined
obj[i]
q
i
b
obj.i
undefined
obj[i]
w
i
c
obj.i
undefined
obj[i]
e
for-of-arr
a
b
b

for in 对于数组来说 是获取的索引值
for in 对于对象来说 获取的也是对象名 obj.i 是获取不到具体值的 是undefined 要用obj[i]
for of 对于数组 可以直接获取数组对应的值
for of 对于对象 会报错 无法迭代 可能需要自定义迭代器

今日总结

• [x] 添加修改用户页面

早上一来就修电脑 修到差不多十一点 离大谱

遇到一个小问题 就是打包后的页面问题 已经上传到服务器 ky.liuyangtest.cn

重新回顾了一下深浅拷贝 手写深拷贝代码

for in for of 搞懂了 可能会忘 但是基本搞懂