1.使用css实现一个三角形
<style>
#triangle {
width: 0px;
height: 0px;
border: 50px solid transparent;
border-top-left-radius: 50px solid red;
}
</style>
<body>
<div id="triangle">
</div>
2. flex布局
3. 用css实现单行截断字符串，最后以...结尾。
#strcut {
width: 200px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
<div id="strcut">
用css实现单行截断字符串，最后以...结尾用css实现单行截断字符串，最后以...结尾用css实现单行截断字符串，最后以...结尾用css实现单行截断字符串，最后以...结尾
</div>
4. 输出ByteDance1，说一下流程
window.name = 'ByteDance';
function A () {
this.name = 123;
}
A.prototype.getA = function(){
console.log(this);
return this.name + 1;
}
let a = new A();
let funcA = a.getA;
funcA();
a继承A的属性，即A.prototype，但是内部的this.name没有得到继承，当调用的时候，打印this,这时this指向window，并且this.name 为'ByteDance'
5. 关于宏任务，微任务打印队列
async function async1() {
console.log('async1 start');
await async2();
console.log('async1 end');
}
async function async2() {
console.log('async2 start');
return new Promise((resolve, reject) => {
resolve();
console.log('async2 promise');
})
}
console.log('script start');
setTimeout(function() {
console.log('setTimeout');
}, 0);
async1();
new Promise(function(resolve) {
console.log('promise1');
resolve();
}).then(function() {
console.log('promise2');
}).then(function() {
console.log('promise3');
});
console.log('script end')
6. PromiseAll的实现
function myPromisAll(iterator) {
iterator = Array.from(iterator) //数组转换
const res = []
return new Promise((reslove, reject) => {
iterator.map(item => {
Promise.resolve(item).then(data => { // 对单个Promise进行处理
res.push(data)
if (res.length === iterator.length) { // 当长度一致的时候进行结果的返回
reslove(res)
}
}).catch(e => { // 如果出现错误直接返回错误
reject(e)
})
})
})
}
菜鸡本人自写，纯个人思路，有问题还望各位大佬指正。
