<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[titoni_yunruohan的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/titoni_yunruohan</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; titoni_yunruohan]]></copyright><item><title><![CDATA[常考浏览器面试考点]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/114387346</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/114387346</guid><author>titoni_yunruohan</author><pubDate>Fri, 05 Mar 2021 11:24:12 +0800</pubDate><description><![CDATA[1.浏览器的从接收url到渲染的过程

浏览器在用户输入url之后会先对url进行dns解析，dns会按照浏览器本地 &gt; 本地电话host &gt;dns服务器这个顺序去查找对应的ip，找到ip后就会向服务器发出请求，服务器在收到请求之后会把对应的静态文件返回，浏览器解析html的时候会按照从上到下，遇到css加入异步的请求中，不阻碍继续解析，遇到script要看script标签是否标识要异步，如果是就先进行异步加载继续解析html，如果是script设有defer标签就是等到dom解析完再解析...]]></description><category></category></item><item><title><![CDATA[JS的常见知识点]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/114102273</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/114102273</guid><author>titoni_yunruohan</author><pubDate>Thu, 25 Feb 2021 19:33:17 +0800</pubDate><description><![CDATA[JS的内置类型
	
js的内置类型分为两大类：一类是JS的基本类型包括六种

null
	undefined
	string
	number
	boolean
	symbol
第二类是引用类型Object


面试题
1.说下你知道的JS的内置类型


 2.JS继承

 JS继承有7种方式：

原型链继承

function father() {    
   this.type = 1
}
function person(name) {   
   this.name = name   
...]]></description><category></category></item><item><title><![CDATA[我理解的闭包]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/112756012</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/112756012</guid><author>titoni_yunruohan</author><pubDate>Sun, 17 Jan 2021 19:07:29 +0800</pubDate><description><![CDATA[一、理解闭包

函数A中包含函数B，函数B可以访问函数A作用域中的变量，这种情况下就称闭包

二、闭包的应用

应用1：封装私有变量

特点：当你想要让一个函数中的变量变成私有(这时候大家应该想到对象，但是对象是可以直接访问变量的，那么new就是一个好的中间转换过程)，只能通过函数对应的方法来获得，这时你就可以利用闭包



function Ninja() {

     var feints = 0;

 this.getFetint = function() {...]]></description><category></category></item><item><title><![CDATA[this指向问题总结]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/112748172</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/112748172</guid><author>titoni_yunruohan</author><pubDate>Sun, 17 Jan 2021 15:49:40 +0800</pubDate><description><![CDATA[一、什么情况下会讨论this的指向

访问this访问对象的某个属性

二、不同情况下this的指向问题

①全局普通函数中使用this

this指向window

var a = 1
function f() {
  console.log(this.a)
}
// 1

②对象中的某个属性为普通函数，函数中使用this

this指向对象

let obj = {
    a: 'obj',
    f: function() {
        console.log(this.a)
    }
}]]></description><category></category></item><item><title><![CDATA[Promise]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/111940072</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/111940072</guid><author>titoni_yunruohan</author><pubDate>Sun, 10 Jan 2021 23:20:50 +0800</pubDate><description><![CDATA[一、promise为何产生

promise是一种异步解决方案，因为promise可以让异步回调变得更简单，其具有以下特点

promise的状态有三种，pending(执行状态)、成功状态(resolved)、失败状态(rejected),只有构造函数传入的code执行结果才会改变promise的状态
	只要新建就会执行
	promise构造函数中传入的code会立即被执行，但是then属于微任务
二、promise的基本使用


let p = new Promise((resolve, reject)]]></description><category></category></item><item><title><![CDATA[js的深拷贝]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/112372625</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/112372625</guid><author>titoni_yunruohan</author><pubDate>Fri, 08 Jan 2021 17:19:34 +0800</pubDate><description><![CDATA[一、通过for in实现


function deepCopy1(obj) {
  let o = {}
  for(let key in obj) {
    o[key] = obj[key]
  }
  return o
}

let obj = {
  a:1,
  b: undefined,
  c:function() {},
}
console.log(deepCopy1(obj))
// { a: 1, b: undefined, c: [Function: c] }

二、通过JSON.]]></description><category></category></item><item><title><![CDATA[谈一谈自己对BFC的理解]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/112347817</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/112347817</guid><author>titoni_yunruohan</author><pubDate>Fri, 08 Jan 2021 16:51:29 +0800</pubDate><description><![CDATA[一、BFC概念

BFC全名为块级格式化上下文，它是一个独立的渲染区域，其内部的盒子如何布局只遵循块级格式化上下文的规则，不受外部元素的干扰

二、如何定义BFC

当前元素的float属性不为none
	当前元素的position属性不为static和relative
	当前元素的overflow属性不为visible
	当前元素的display属性是inline-block、table-cell、flex、table-caption和inline-flex
三、BFC的布局规则

每个盒子都占一行，在垂]]></description><category></category></item><item><title><![CDATA[事件]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/111568554</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/111568554</guid><author>titoni_yunruohan</author><pubDate>Tue, 22 Dec 2020 23:38:22 +0800</pubDate><description><![CDATA[一、事件冒泡

观察dom结构，我们会发现每个元素都被其它元素包裹着，像同心圆一样，当圆心有事件发生的时候，似乎会向外扩散，这里我们可以把这种扩散理解为事件冒泡

事件冒泡：事件开始时由最具体的元素接收，然后逐级向上传播到较为不具体的节点
	举例理解：

&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
    &lt;title&gt;理解冒泡实例&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;div id=]]></description><category></category></item><item><title><![CDATA[JS垃圾回收机制]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/111477850</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/111477850</guid><author>titoni_yunruohan</author><pubDate>Mon, 21 Dec 2020 18:56:25 +0800</pubDate><description><![CDATA[一、什么是垃圾

一般来说，没有被引用的对象就是垃圾，为了减少内存被无用的变量占用造成内存的浪费，所以需要对垃圾进行回收

二、回收的方法

 1.标记清除

清除维度：其作用域是否在执行环境
	不同执行环境清除原则：全局作用域是在当前窗口在执行态的时候就不会被清除，但是局部环境是在其执行环境被销毁的时候就会被标记清除
	举例解释

let obj1 = {
  prop: 'obj1'
}
function f1() {
  let obj2 = {
    prop: 'obj2'
  }
  ret.]]></description><category></category></item><item><title><![CDATA[理解js中声明的作用域]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/111463499</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/111463499</guid><author>titoni_yunruohan</author><pubDate>Mon, 21 Dec 2020 00:39:03 +0800</pubDate><description><![CDATA[一、首先我们了解一下作用域的分类

全局作用域：全局作用域是未定义在某个函数内的
	函数作用域：局部作用域是定义在某个函数内的
二、通过实例理解作用域中的声明

例子一：代码中a、b、c和f1均为全局作用域中声明，我们可以将全局理解为一级作用域，全局作用域中声明的函数为二级作用域，函数中的函数称为三级作用域，以此类推，级数大的可以访问级数小的

&lt;script&gt;
var a = 1
let b = 2
const c = 3
function f1() {
    let d = 4
    r]]></description><category></category></item><item><title><![CDATA[手写简单的apply、call和bind]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110988970</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110988970</guid><author>titoni_yunruohan</author><pubDate>Thu, 10 Dec 2020 21:00:29 +0800</pubDate><description><![CDATA[一、手写call

先来看下call的使用

let obj = {
  name: 'obj'
}
var name = 'window'
function f(lastname) {
  console.log(this.name + ' ' + lastname)
}
f.call(obj, 'sun')

// 输出obj sun


思考：能直接通过函数.调用，通过我们学到的原型链的知识，我们可以将callFun写到prototype上

Function.prototype.callFun = ]]></description><category></category></item><item><title><![CDATA[函数被调用的方式]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110732182</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110732182</guid><author>titoni_yunruohan</author><pubDate>Sun, 06 Dec 2020 12:19:10 +0800</pubDate><description><![CDATA[一、理解函数调用

函数调用其实就是发挥函数作用的时候，我们常见的方式有如下几种方式

二、函数调用的方式

方式一：直接使用函数名调用，作为一个普通函数被调用

特点：函数内或者函数外均可调用


var a = 0
function f1() {
    a++
}
function f2() {
    f1()
    a++
    return a
}
f2() // 2

方式二：作为方法被某个实例对象调用

特点：方法被定义在某个对象的属性中

var obj = {
    name: ']]></description><category></category></item><item><title><![CDATA[函数传参的方式]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110731602</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110731602</guid><author>titoni_yunruohan</author><pubDate>Sun, 06 Dec 2020 10:55:59 +0800</pubDate><description><![CDATA[一、理解函数的实参和形参

形参：函数定义时写明的参数叫形参
	实参：函数调用时传入的参数叫实参

function f(a, b) { // a b为形参
    return a + b
}
f(1, 2) // 1 2为实参

二、函数形参的定义方式

方式一：预先定义好所有需要的形参

特点：需要预知参数的个数

function f(a, b, c, d) {
    return a + b + c + d
}
f(1, 2, 3, 4)

方式二：只定义部分可预知的参数，剩余的用剩余参数定义
]]></description><category></category></item><item><title><![CDATA[解析函数创建的六种方式]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110701274</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110701274</guid><author>titoni_yunruohan</author><pubDate>Sat, 05 Dec 2020 17:30:36 +0800</pubDate><description><![CDATA[一、理解函数

工作中我们经常接触各种各样的函数，比如通过字面量定义的函数，箭头函数、立即函数等等，函数也经常被使用于各种各样的场景中，比如回调函数、被实例调用、普通执行等，那么我们接下来先总结一下函数创建的方式。

二、函数创建的四种方式

方式一：函数声明

特点：通过函数声明的方式如下，函数声明存在提升，会将变量的声明提升到作用域顶部，也就是可以在声明之前调用;且其this的指向是window对象

function A() {
    return this;
}

观察函数的执行结果我们可以发现全]]></description><category></category></item><item><title><![CDATA[js的继承]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110507148</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110507148</guid><author>titoni_yunruohan</author><pubDate>Thu, 03 Dec 2020 12:50:32 +0800</pubDate><description><![CDATA[一、理解继承

对象的继承是

二、继承方式总结

方式一：原型继承



方式二：构造函数继承

方式三：原型和构造函数组合式继承

方式四：Class继承
]]></description><category></category></item><item><title><![CDATA[从对象创建来理解原型链]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110494297</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110494297</guid><author>titoni_yunruohan</author><pubDate>Wed, 02 Dec 2020 22:15:39 +0800</pubDate><description><![CDATA[一、理解__proto__ 和prototype

在理解原型链之前我们先来看两个属性，__proto__ 和prototype，在我的理解中，__proto__和prototype是对象和函数与其关联对象的一种标识

__proto__：对象的一个属性，指向它的来源
	prototype：函数的一个属性，指向它的来源
二、对象创建总结

方式一：对象字面量

特点：创建一个自定义属性的对象，属性在创建的时候定义,不能复用


let obj = {
  name: 'a',
  age: 'b'
}

观]]></description><category></category></item><item><title><![CDATA[从页面输入url到页面渲染的过程]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110367294</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110367294</guid><author>titoni_yunruohan</author><pubDate>Mon, 30 Nov 2020 18:00:36 +0800</pubDate><description><![CDATA[1.用户输入

用户输入一个url之后，浏览器会解析用户的输入，目的是找到该地址对应服务器的index.html文件，解析的步骤如下

先找浏览器缓存（chrome://dns/）看是否有改url对应的服务器地址，如果有则向服务器发出请求，没有则进行第二步
	浏览器缓存没有该url，那么就像系统的缓存文件中找，如果有则向服务器发出请求，没有则进行第三步
	本地缓存没有就会像dns服务器请求去解析，dns会将对应的地方返回，浏览器向返回的地址发出请求
2.浏览器发出请求

浏览器会向服务器发出tcp链接
	服]]></description><category></category></item><item><title><![CDATA[JS的同步和异步、微任务和宏任务]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110187508</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/110187508</guid><author>titoni_yunruohan</author><pubDate>Thu, 26 Nov 2020 20:41:40 +0800</pubDate><description><![CDATA[1.为什么JS是单线程的

js是运行于浏览器的脚本语言，因其经常涉及操作dom，如果是多线程的，如果一个线程修改dom，另一个线程删除dom，那么浏览器就不知道该先执行哪个操作，所以js执行的时候会按照一个任务一个任务来执行，那么任务是怎么排列的呢

2.为什么JS的任务要分类为同步任务和异步任务

试想一下，如果js的任务都是同步的，那么遇到定时器、网络请求等这类型需要延时执行回调函数的任务会发生什么？页面会像瘫痪一下暂停下来等待这些需要需要时间的代码执行完毕，基于此，又引入了异步任务，每个异步任务都必]]></description><category></category></item><item><title><![CDATA[JaveScript数据类型相关知识点及面试题总结]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/108258042</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/108258042</guid><author>titoni_yunruohan</author><pubDate>Thu, 27 Aug 2020 16:57:35 +0800</pubDate><description><![CDATA[第一部分介绍JS的基础数据类型


1. String


let str = 'sun';
console.log(typeof str) // String

2. Number


	JS 的 number 类型是浮点类型的，0.1 + 0.2 !== 0.3，所以不要计算某个特定的浮点数值，这是使用IEEE754的数值的浮点计算的通病
	
	
	string 类型是不可变的，无论你在 string 类型上调用何种方法，都不会对值有改变
	

let n = 123;
console.log(t...]]></description><category></category></item><item><title><![CDATA[JSON的parse与stringify]]></title><link>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/103041497</link><guid>https://blog.youkuaiyun.com/titoni_yunruohan/article/details/103041497</guid><author>titoni_yunruohan</author><pubDate>Wed, 13 Nov 2019 03:16:55 +0800</pubDate><description><![CDATA[第一部分介绍JSON对象的定义


1. JSON的定义


JSON是一种语法，用来序列化对象、数组、数值、字符串、布尔值和null




第二部分介绍JSON的方法


1. JSON.stringify(value)用于将js对象转化为字符串

value 需要转换的对象
 2 . JSON.parse(text)用于将text转化为js的字符串

text 需要解析的js值的字...]]></description><category></category></item></channel></rss>