怎么自学前端？
聊天环节比较长
怎么自学前端？
如果你学弟想自学计算机，你会建议怎样的路线？
为什么选择前端不是后端、客户端？
红宝书有没有过时？
为什么选择Vue而不是别的框架
你用的是Vue哪个版本
Vue双向绑定
常规题目，Vue2.X通过Object.defineProperty()来劫持各个属性的setter，getter，新版本通过Proxy劫持属性
Proxy优势
支持数组，其实还不止
Object.defineProperty() 的问题主要有三个：
- 不能监听数组的变化
- 必须遍历对象的每个属性
- 必须深层遍历嵌套的对象
Proxy 在 ES2015 规范中被正式加入，它有以下几个优势点
-
针对对象：针对整个对象，而不是对象的某个属性，所以也就不需要对 keys 进行遍历。这解决了上述 Object.defineProperty() 第二个问题
-
支持数组：Proxy 不需要对数组的方法进行重载，省去了众多 hack，减少代码量等于减少了维护成本，而且标准的就是最好的。
-
Proxy 的第二个参数可以有 13 种拦截方法，这比起 Object.defineProperty() 要更加丰富
-
Proxy 作为新标准受到浏览器厂商的重点关注和性能优化，相比之下 Object.defineProperty() 是一个已有的老方法，可以享受新版本红利。
数组在内存中存储形式
引用类型和基本类型的区别
keepalive
缓存组件，当组件切换时不会对当前组件进行卸载
v-show和v-if的区别
v-if ：让DOM 节点直接消失。（看不到，也没有位置，DOM节点也不在。）
v-show： 调用display:none 来控制元素是否展示。
display:none --> 物理空间消失，但是DOM还在（即：视觉上看不到，也没有位置，但是DOM节点还）。
visibility：hidden; -->物理空间以及DOM都还在（即：视觉上看不到，但位置，DOM节点还在）。
箭头函数和普通函数区别
讲了this指针指向定义时上下文的对象，而不是使用时的对象
不可以当作构造函数（不可以使用new命令）
其实还有可以讲的，记住一下（估计记不住，尤其是第2条）：
不可以使用arguments对象，该对象在函数体内不存在。如果要用，可以用Rest参数代替
不可以使用yield命令，因此箭头函数不能用作Generator函数
箭头函数可以使用call/apply/bind吗
不能，为什么我分析师this指针指向的原因，查了一下错了，能，只是没有效果
箭头函数对象通过原型链从Function原型上继承了call/apply/bind函数。箭头函数没有prototype，但是有proto，调用call/apply/bind时会顺着__proto找到父类（也就是Function）原型上的call/apply/bind。箭头函数call/apply/bind没有效，箭头函数内部this被一个在定义时外部词法环境声明的对象this指针代理了，因此没什么作用。
了解什么最新的ES语法更新吗
只记得最新的replaceAll,promise.any，讲了作用，更多我博客上写（抄）过：ES7-ES11新功能ES12新功能
了解Promise吗，有什么方法
promise.all、promise.any、promise.allSettled
Promise.any如果都是reject怎么办
const q = new Queue();
q.task(1000, () => {
console.log(1)
})
.task(2000, () => {
console.log(2)
})
.task(1000, () => {
console.log(3)
})
.start()
q.stop(); // 可以随时终止任务
class Queue{
constructor() {
this.queue = [];
this.timer = [];
this.startTime = 0;
}
task(time, fn) {
this.startTime += time;
this.queue.push([fn, this.startTime]);
return this;
}
start() {
for (let i = 0; i < this.queue.length; i++) {
this.timer[i] = setTimeout(this.queue[i][0],this.queue[i][1]);
}
}
stop() {
for (let i = 0; i < this.timer.length; i++) {
clearTimeout(this.timer[i]);
}
}
}
const q = new Queue();
q.task(1000, () => {
console.log(1)
})
.task(2000, () => {
console.log(2)
})
.task(1000, () => {
console.log(3)
})
.start()
q.stop(); // 可以随时终止任务
结束之后思考了一下怎么用Promise实现，网上查了查资料，再次强调，菜鸡的代码仅供参考，请勿当作答案，有更好的欢迎提出。
class Queue {
constructor() {
this.queue = [];
this.timer = null;
this.pro = Promise.resolve();
}
task(time, fn) {
this.queue.push([time, fn]);
return this;
};
start () {
this.queue.forEach((item) => {
this.pro = this.pro.then(() => {
return new Promise((resolve, reject) => {
this.timer = setTimeout(() => {
resolve(item[1]());
}, item[0]);
});
});
});
};
stop() {
this.pro = Promise.reject();
clearTimeout(this.timer);
}
}
const q = new Queue();
q.task(1000, () => {
console.log(1)
})
.task(2000, () => {
console.log(2)
})
.task(1000, () => {
console.log(3)
})
.start()
q.stop(); // 可以随时终止任务
setTimeout不准时，怎么实现一个前端1s倒计时计数，相对准时（口述）
思路：用0.1s定时器计时，利用Date计算剩下的时间，转换成秒数（整数），监听秒数改变进行变换
怎么实现数字->汉字的转化 ，力扣原题整数转换英文表示的简化汉字版本，要求通过以下三个case
12345 -> 一万二千三百四十五
10002 -> 一万零二
10080 -> 一万零八十
function revert(num) {
let numbers = ['零', '一','二','三','四','五','六','七','***'];
let counts = ['十', '百','千','万'];
let arr = [];
while (num) {
arr.push(num % 10);
num = Math.floor(num / 10);
}
// console.log(arr)
let res = "";
for (let i = arr.length - 1; i >= 0; i--) {
if (arr[i] !== 0) {
res += numbers[arr[i]];
if (i >= 1) {
res += counts[i - 1];
}
} else if (i > 0 && arr[i + 1] !== 0) {
res += numbers[0];
}
}
return res;
}
console.log(revert(12345))
console.log(revert(10002))
console.log(revert(10080))
function revert(num) {
let numbers = ['零', '一','二','三','四','五','六','七','***'];
let counts = ['十', '百','千','万'];
let arr = [];
while (num) {
arr.push(num % 10);
num = Math.floor(num / 10);
}
let res = "";
for (let i = arr.length - 1; i >= 0; i--) {
if (arr[i] !== 0) {
if (arr[i + 1] === 0) {
res += numbers[0];
}
res += numbers[arr[i]];
if (i >= 1) {
res += counts[i - 1];
}
}
}
return res;
}
console.log(revert(12345))
console.log(revert(10002))
console.log(revert(10080))
console.log(revert(10800))
全部评论
(5) 回帖