1、常用几种居中方式
// 外层盒子有高度
.box {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
margin: auto;
}
.box {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
// 外层flex
body {
display: flex;
justify-content: center;
align-items: center;
}
// table
// grid 布局
2、双飞翼
// 1、float 布局 （外层给左右padding, 两边负margin）
// 2、flex 布局，中间给flex 1
3、js 题
// 面向对象
function Foo(){
// 执行后会覆盖外层getName
getName = function(){
console.log(1)
}
return this
}
Foo.getName = function(){
console.log(2)
}
Foo.prototype.getName = function(){
console.log(3)
}
var getName = function(){
console.log(4)
}
function getName(){
console.log(5)
}
// ============
Foo.getName() // 2
getName() // 4
Foo().getName() // this --- window 1
getName() // 1
new Foo.getName() // 2
new Foo().getName() // 3
new new Foo().getName() // 3
// new Foo() 用Foo()构造函数new一个对象;\
// new Foo().getName() 引用这个对象的私有函数;\
// new new Foo().getName() 用这个对象的私有函数作为一个构造函数，再new一个对象。
// JS的EventLoop
async function async1(){
console.log('async1 start')
await async2();
console.log('async1 end')
}
async function async2(){
console.log('async2')
}
console.log('script start')
setTimeout(function(){
console.log('setTimeout')
}, 0)
async1()
new Promise(function(resolve){
console.log('promise1')
resolve()
}).then(function(){
console.log('promise2')
})
console.log('script end')
对象(数组)的深克隆
function deepClone(obj) {
if(typeof obj !== 'object') return obj;
if(obj instanceof RegExp) return new RegExp(obj)
if(obj instanceof Date) return new Date(obj)
let cloneObj = new obj.constructor
for( let key in obj ){
if(obj.hasOwnProperty(key)){
cloneObj[key] = deepClone(obj[key])
}
}
return cloneObj
}
//=>深克隆
let obj = {
a: 100,
b: [10, 20, 30],
c: {
x: 10
},
d: /^\d+$/
};
let arr = [10,
[100, 200],
{
x: 10,
y: 20
}
];
如何使表达式成立
if (a == 1 && a == 2 && a == 3) {
console.log(1);
}
// 解
// 1、通过重写toString方法来实现。
var a = {
i: 0,
toString: function () {
return ++a.i;
}
};
// 2、利用Object.defineProperty，在获取全局属性a的值的时候，触发GETTER函数，从而返回指定的值
Object.defineProperty(window, 'a', {
get: function () {
return ++i;
}
});
4、基本算法题
数组去重
冒泡排序\插入排序\快速排序
function bubble(ary) {
let temp = null
for(let i=0;i<ary.length-1;i++){
for(let j=0;j<ary.length - 1 -i;j++){
if(ary[j]>ary[j+1]){
temp = ary[j];
ary[j]=ary[j+1];
ary[j+1]=temp
}
}
}
return ary
}
let ary = [12,12,2,1,2,3,32,312,3];
bubble(ary)
数组扁平化的N种实现方案
斐波那契数列
function fibonacci(count){
function fn(count, curr =1, next = 1){
if(count === 0){
return curr;
}else {
return fn(count -1, next, curr+next)
}
}
return fn(count)
}
字节跳动经典算法题
/*
* 输入一个正数N，输出所有和为N的连续正数序列
* 例如：输入15
* 结果：[[1,2,3,4,5],[4,5,6],[7,8]]
*/
function createArr(n,len){
let arr=new Array(len).fill(null),
temp=[];
arr[0]=n;
arr=arr.map((item,index)=>{
if(item===null){
item=temp[index-1]+1;
}
temp.push(item);
return item;
});
return arr;
}
function fn(count){
let result=[];
//=>求出中间值
let middle=Math.ceil(count/2);
//从1开始累加
for(let i=1;i<=middle;i++){
//控制累加多少次
for(let j=2;;j++){
//求出累加多次的和
let total=(i+(i+j-1))*(j/2);
if(total>count){
break;
}else if(total===count){
result.push(createArr(i,j));
break;
}
}
}
return result;
}
相邻项的处理方案
let ary = [12,13,12,14,15,6,423,52,423,423,43,3];
ary.sort((a, b)=> a - b);
ary = ary.join('@') + '@';
let reg = /(\d+@)\1*/g;
const arr = []
ary.replace(reg, (val, group) => {
arr.push(parseFloat(group));
});
console.log(arr); // [3, 6, 12, 13, 14, 15, 43, 52, 423]
相邻项的处理方案2
let ary = [12,13,12,14,15,6,423,52,423,423,43,3];
let obj = {}
for(let i=0;i<ary.length;i++){
let item = ary[i];
if(typeof obj[item] !== 'undefined'){
ary[i] = ary[ary.length - 1];
ary.length--;
i--;
continue;
}
obj[item] = item
}
obj = null
console.log(ary)
数组扁平化
斐波那契数列
// 1
function fibonacci(n){
if(n<=1) return 1;
let arr=[1,1];
//=>即将要创建多少个
let i=n+1-2;
while(i>0){
let a=arr[arr.length-2],
b=arr[arr.length-1];
arr.push(a+b);
i--;
}
return arr[arr.length-1];
}
// 2
function fibonacci(count) {
function fn(count, curr = 1, next = 1) {
if (count == 0) {
return curr;
} else {
return fn(count - 1, next, curr + next);
}
};
return fn(count);
}
