事件循环,promise面试题分析

2021-11-05

进程(process):计算机已经运行的程序，是操作系统管理程序的一种方式；
线程(thread):操作系统能够运行运算调度的最小单位，通常情况下它被包含在进程中;
可以说进程是线程的容器;

展开全文 >>

vue2&vue3响应式

2021-11-03

什么是响应式

比如: 有一个info对象:info:{name:’dadaguai’,age:12} 一些函数中引用着info中的数据比如foo函数 function foo() {console.log(info.name)} 当某一时刻,我手动修改了info中name的值,我想做到 foo函数会自动执行一遍, 这就是响应式

展开全文 >>

今日手写

2021-11-01

reduce的实现

reduce的基本使用 MDN对reduce的介绍

let arr = [1,2,3,4,5]
let res = arr.reduce((result, item, index, arr) => {
    return result + item
},0)
console.log(res) // 15

展开全文 >>

今日手写

2021-10-30

实现ajax

// 封装一
const ajax = {
    get(url, fn) {
        const xhr = new XMLHttpRequest()
        xhr.open('GET', url, true)//第三个参数表示是否异步
        xhr.onreadystatechange = function () {
            if(xhr.readyState === 2) {
                fn(xhr.responseText)
            }
    	}
    	xhr.send()
    },
    post(url, data, fn) {
        const xhr = new XMLHttpRequest()
        xhr.open('POST', url, true)
        xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded')
        xhr.onreadystatechange = function () {
            if(xhr.readyState === 4) {
            	fn(xhr.responseText)
            }
        }
        xhr.send(data)
    }
}
//封装二
function ajax(option) {
    //创建xmlhttprequest()对象
    var xhr = new XMLHttpRequest()

    // 初始化参数内容
    option = option || {}
    option.type = (option.type || 'GET').toUpperCase()
    option.dataType = option.dataType || 'json'
    const params = option.data

    // 发送请求
    if (option.type == 'GET') {
        let canshu = ''
        for(key in params) {
            canshu = canshu + `${key}=${params[key]}&`
        }
        xhr.open('GET', option.url + '?' + canshu.substr(0,canshu.length - 1), true)
        xhr.send(null)
    } else if (option.type == "POST") {
        xhr.open('POST', option.url, true)
        xhr.send(params)
    }

    //接受请求
    xhr.onreadystatechange = function() {
        if (xhr.readyState === 4 && xhr.status === 200) {
            option.success && option.success(xhr.responseText)
        } else if(xhr.readyState !== 4 && xhr.status >= 300){
            option.faile && option.faile(xhr.status)
        }
    }
    }
//使用
 ajax({
     type: 'get',
     url: 'https://localhost:8000/phoneimgs',
     data: { 
         page:1,
         name:20
     },
     dataType: 'json',
     success: function(data) {
         console.log(data);
     },
     faile: function(err) {
         console.log(`错误码${err}`);
     }
})
//这是拿到的结果: 我自己写的一个爬虫,爬到的数据
[{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946729.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946729.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946728.jpeg","showurl":"https://mfiles.alphacoders.com/946/thumb-946728.jpeg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946724.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946724.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946716.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946716.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946714.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946714.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946706.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946706.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946703.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946703.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946701.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946701.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946687.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946687.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946686.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946686.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946665.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946665.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946649.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946649.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946626.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946626.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946621.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946621.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946614.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946614.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946613.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946613.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946612.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946612.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946610.png","showurl":"https://mfiles.alphacoders.com/946/thumb-946610.png"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946609.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946609.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946607.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946607.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946600.png","showurl":"https://mfiles.alphacoders.com/946/thumb-946600.png"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946598.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946598.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946581.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946581.jpg"},{"url":"https://mfiles.alphacoders.com/946/thumb-1920-946576.jpg","showurl":"https://mfiles.alphacoders.com/946/thumb-946576.jpg"}]

展开全文 >>