diff --git a/404.html b/404.html index 8628c7c..6924a62 100644 --- a/404.html +++ b/404.html @@ -19,7 +19,7 @@
怀谷

Appearance

404

PAGE NOT FOUND

But if you don't change your direction, and if you keep looking, you may end up where you are heading.
Take me home
- + diff --git a/JS.TS/ES6/Iterator.html b/JS.TS/ES6/Iterator.html index 01f7c5b..53eda94 100644 --- a/JS.TS/ES6/Iterator.html +++ b/JS.TS/ES6/Iterator.html @@ -59,7 +59,7 @@ }

关于Symbol可以点击这里

- + diff --git a/JS.TS/ES6/Symbol.html b/JS.TS/ES6/Symbol.html index df727c7..06b2a20 100644 --- a/JS.TS/ES6/Symbol.html +++ b/JS.TS/ES6/Symbol.html @@ -32,7 +32,7 @@ [...myIterable] // [1, 2, 3] - + diff --git a/JS.TS/ES6/index.html b/JS.TS/ES6/index.html index 06e7201..4ee973f 100644 --- a/JS.TS/ES6/index.html +++ b/JS.TS/ES6/index.html @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page

面试老被问ES6?

我们今天来谈谈ES6

- + diff --git a/JS.TS/ES6/promise.html b/JS.TS/ES6/promise.html index 34d7d0f..f7a7b97 100644 --- a/JS.TS/ES6/promise.html +++ b/JS.TS/ES6/promise.html @@ -109,7 +109,7 @@ }) } - + diff --git "a/JS.TS/ES6/\350\247\243\346\236\204\350\265\213\345\200\274.html" "b/JS.TS/ES6/\350\247\243\346\236\204\350\265\213\345\200\274.html" index 62fd10a..3002ca6 100644 --- "a/JS.TS/ES6/\350\247\243\346\236\204\350\265\213\345\200\274.html" +++ "b/JS.TS/ES6/\350\247\243\346\236\204\350\265\213\345\200\274.html" @@ -32,7 +32,7 @@ let [_,x]= test console.log(x) //3

事实上，只要某种数据结构具有 Iterator 接口，都可以采用数组形式的解构赋值。

Iterator 接口看这边

- + diff --git "a/JS.TS/ES6/\350\277\220\347\256\227\347\254\246.html" "b/JS.TS/ES6/\350\277\220\347\256\227\347\254\246.html" index 0ffad26..c6879cc 100644 --- "a/JS.TS/ES6/\350\277\220\347\256\227\347\254\246.html" +++ "b/JS.TS/ES6/\350\277\220\347\256\227\347\254\246.html" @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page
- + diff --git "a/JS.TS/JS\344\270\212\344\270\213\346\226\207\345\222\214\346\211\247\350\241\214\346\240\210.html" "b/JS.TS/JS\344\270\212\344\270\213\346\226\207\345\222\214\346\211\247\350\241\214\346\240\210.html" index 14baa7e..1c0a631 100644 --- "a/JS.TS/JS\344\270\212\344\270\213\346\226\207\345\222\214\346\211\247\350\241\214\346\240\210.html" +++ "b/JS.TS/JS\344\270\212\344\270\213\346\226\207\345\222\214\346\211\247\350\241\214\346\240\210.html" @@ -41,7 +41,7 @@ // undefined {n:2}

连等操作符执行顺序从过至左

  1. a=

  2. 赋值给a.x 但没有该x属性，所以在原对象上加上该属性，该即b指向的对象

- + diff --git a/JS.TS/TS/is.html b/JS.TS/TS/is.html index 9dbd7f8..425a8ca 100644 --- a/JS.TS/TS/is.html +++ b/JS.TS/TS/is.html @@ -33,7 +33,7 @@ // 这里我们通过泛型说明如果 isArray 返回了 true ，意味着 val 是由 string 构成的数组 const foo = (val: unknown) => isArray<string>(val) ? val.map(item => item.toLowerCase()) : val - + diff --git "a/JS.TS/TS/\347\264\242\345\274\225.html" "b/JS.TS/TS/\347\264\242\345\274\225.html" index 472ed7e..a064c83 100644 --- "a/JS.TS/TS/\347\264\242\345\274\225.html" +++ "b/JS.TS/TS/\347\264\242\345\274\225.html" @@ -69,7 +69,7 @@ em.emit("aa"); // 只输出 "bb" - + diff --git "a/JS.TS/\345\237\272\347\241\200/Eventloop.html" "b/JS.TS/\345\237\272\347\241\200/Eventloop.html" index b48b82d..db6102d 100644 --- "a/JS.TS/\345\237\272\347\241\200/Eventloop.html" +++ "b/JS.TS/\345\237\272\347\241\200/Eventloop.html" @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page

Js 任务

MacroTask（宏任务） script全部代码、setTimeout、setInterval、setImmediate（浏览器暂时不支持，只有IE10支持，具体可见MDN）、I/O、UI Rendering。

MicroTask（微任务） Process.nextTick（Node独有）、Promise、Object.observe(废弃)、MutationObserver（具体使用方式查看这里）

- + diff --git "a/JS.TS/\345\237\272\347\241\200/Js\344\270\255\347\232\204map\345\222\214weakMap.html" "b/JS.TS/\345\237\272\347\241\200/Js\344\270\255\347\232\204map\345\222\214weakMap.html" index 17e4df0..2f530ef 100644 --- "a/JS.TS/\345\237\272\347\241\200/Js\344\270\255\347\232\204map\345\222\214weakMap.html" +++ "b/JS.TS/\345\237\272\347\241\200/Js\344\270\255\347\232\204map\345\222\214weakMap.html" @@ -34,7 +34,7 @@

weakMap

WeakMap 对象是一组键/值对的集合，其中的键是弱引用的。其键必须是对象，而值可以是任意的。 原始数据类型不能作为WeakMap 的key 且weakMap 所引用的对象不计入 垃圾回收

js
- + diff --git "a/JS.TS/\345\237\272\347\241\200/new\346\223\215\344\275\234\347\254\246.html" "b/JS.TS/\345\237\272\347\241\200/new\346\223\215\344\275\234\347\254\246.html" index 41ef845..a7ddd81 100644 --- "a/JS.TS/\345\237\272\347\241\200/new\346\223\215\344\275\234\347\254\246.html" +++ "b/JS.TS/\345\237\272\347\241\200/new\346\223\215\344\275\234\347\254\246.html" @@ -89,7 +89,7 @@ bind的实现

三者第一个参数都是 this 要指向的对象，如果如果没有这个参数或参数为 undefined 或 null，则默认指向全局 window 三者都可以传参，但是 apply 是数组，而 call 是参数列表，且 apply 和 call 是一次性传入参数，而 bind 可以分为多次传入 bind 是返回绑定 this 之后的函数，apply、call 则是立即执行

- + diff --git "a/JS.TS/\345\237\272\347\241\200/\344\270\200\346\226\207\346\220\236\346\207\202map\345\207\275\346\225\260.html" "b/JS.TS/\345\237\272\347\241\200/\344\270\200\346\226\207\346\220\236\346\207\202map\345\207\275\346\225\260.html" index 60984ce..e326ef3 100644 --- "a/JS.TS/\345\237\272\347\241\200/\344\270\200\346\226\207\346\220\236\346\207\202map\345\207\275\346\225\260.html" +++ "b/JS.TS/\345\237\272\347\241\200/\344\270\200\346\226\207\346\220\236\346\207\202map\345\207\275\346\225\260.html" @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page
- + diff --git "a/JS.TS/\345\237\272\347\241\200/\345\236\203\345\234\276\345\233\236\346\224\266.html" "b/JS.TS/\345\237\272\347\241\200/\345\236\203\345\234\276\345\233\236\346\224\266.html" index cb1c828..bf0a5cb 100644 --- "a/JS.TS/\345\237\272\347\241\200/\345\236\203\345\234\276\345\233\236\346\224\266.html" +++ "b/JS.TS/\345\237\272\347\241\200/\345\236\203\345\234\276\345\233\236\346\224\266.html" @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page
- + diff --git "a/JS.TS/\350\256\276\350\256\241\346\250\241\345\274\217/\345\217\221\345\270\203\350\256\242\351\230\205\346\250\241\345\274\217.html" "b/JS.TS/\350\256\276\350\256\241\346\250\241\345\274\217/\345\217\221\345\270\203\350\256\242\351\230\205\346\250\241\345\274\217.html" index 4bc8eaa..77073cf 100644 --- "a/JS.TS/\350\256\276\350\256\241\346\250\241\345\274\217/\345\217\221\345\270\203\350\256\242\351\230\205\346\250\241\345\274\217.html" +++ "b/JS.TS/\350\256\276\350\256\241\346\250\241\345\274\217/\345\217\221\345\270\203\350\256\242\351\230\205\346\250\241\345\274\217.html" @@ -118,7 +118,7 @@ dispatch.emit('post', {type:'post'}) dispatch.emit('post', {type:'post'})

执行结果如下：通过once绑定的事件，仅能触发一次

- + diff --git a/React/ReactHooks/useCallback.html b/React/ReactHooks/useCallback.html index 219115a..10a40f6 100644 --- a/React/ReactHooks/useCallback.html +++ b/React/ReactHooks/useCallback.html @@ -22,7 +22,7 @@
怀谷

Appearance

Return to top
On this page

useCallback

jsx

 const cachedFn = useCallback(fn, dependencies)
- + diff --git a/React/ReactHooks/useContext.html b/React/ReactHooks/useContext.html index 7017f44..c1eea1c 100644 --- a/React/ReactHooks/useContext.html +++ b/React/ReactHooks/useContext.html @@ -27,7 +27,7 @@ const theme = useContext(ThemeContext); - + diff --git a/React/ReactHooks/useEffect.html b/React/ReactHooks/useEffect.html index f905836..2c84a6d 100644 --- a/React/ReactHooks/useEffect.html +++ b/React/ReactHooks/useEffect.html @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page

useEffect

注意Effect和返回值即可

- + diff --git a/React/ReactHooks/useRef.html b/React/ReactHooks/useRef.html index 6ab7b21..c2e7dcb 100644 --- a/React/ReactHooks/useRef.html +++ b/React/ReactHooks/useRef.html @@ -38,7 +38,7 @@ } }

当想获得组件的引用时

react

- + diff --git a/React/ReactHooks/useState.html b/React/ReactHooks/useState.html index 61bd6a3..19b0d99 100644 --- a/React/ReactHooks/useState.html +++ b/React/ReactHooks/useState.html @@ -99,7 +99,7 @@ ); } - + diff --git a/React/index.html b/React/index.html index 9bdd6f3..081c56e 100644 --- a/React/index.html +++ b/React/index.html @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page
- + diff --git a/React/redux.html b/React/redux.html index 266c4f5..affc3b3 100644 --- a/React/redux.html +++ b/React/redux.html @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page
- + diff --git a/Vue/CSS/scroll.html b/Vue/CSS/scroll.html index bc086ca..9534b12 100644 --- a/Vue/CSS/scroll.html +++ b/Vue/CSS/scroll.html @@ -20,7 +20,7 @@
怀谷

Appearance

Return to top
On this page

滚动条样式的修改

here

- + diff --git "a/Vue/\346\272\220\347\240\201\345\210\206\346\236\220/VNode\344\270\216diff\347\256\227\346\263\225.html" "b/Vue/\346\272\220\347\240\201\345\210\206\346\236\220/VNode\344\270\216diff\347\256\227\346\263\225.html" index 73f7c93..a124a02 100644 --- "a/Vue/\346\272\220\347\240\201\345\210\206\346\236\220/VNode\344\270\216diff\347\256\227\346\263\225.html" +++ "b/Vue/\346\272\220\347\240\201\345\210\206\346\236\220/VNode\344\270\216diff\347\256\227\346\263\225.html" @@ -75,7 +75,7 @@ return typeA === typeB } - + diff --git "a/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-attrs.html" "b/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-attrs.html" index 76c6834..2d6b270 100644 --- "a/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-attrs.html" +++ "b/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-attrs.html" @@ -63,7 +63,7 @@ }; </script>

效果实现

alt

log打印

alt

- + diff --git "a/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-parent.html" "b/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-parent.html" index b12699b..0d4b4ed 100644 --- "a/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-parent.html" +++ "b/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-parent.html" @@ -87,7 +87,7 @@ } } - + diff --git "a/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-props.html" "b/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-props.html" index 779c73b..8518aad 100644 --- "a/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-props.html" +++ "b/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-props.html" @@ -89,7 +89,7 @@ this.$refs.demo.$on('test',this.test) }
  • 子组件触发自定义事件：this.$emit('test',传给父组件的数据)
  • 解绑自定义事件this.$off('test')
  • 组件上也可以绑定原生DOM事件，需要使用native修饰符。
    • - + diff --git "a/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-provide.html" "b/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-provide.html" index b0eba33..12da9fe 100644 --- "a/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-provide.html" +++ "b/Vue/\347\273\204\344\273\266\351\200\232\344\277\241/Api-provide.html" @@ -96,7 +96,7 @@ } } - + diff --git "a/assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.0db32377.js" "b/assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.45a6f5da.js" similarity index 93% rename from "assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.0db32377.js" rename to "assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.45a6f5da.js" index d5a686a..9e53ea1 100644 --- "a/assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.0db32377.js" +++ "b/assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.45a6f5da.js" @@ -1,4 +1,4 @@ -import{_ as s,c as n,o as a,a as l}from"./app.e7d182be.js";const i=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[{"level":2,"title":"new操作符的实现原理","slug":"new操作符的实现原理","link":"#new操作符的实现原理","children":[{"level":3,"title":"new操作符的定义","slug":"new操作符的定义","link":"#new操作符的定义","children":[]},{"level":3,"title":"示例2（对象属性为其他对象）","slug":"示例2-对象属性为其他对象","link":"#示例2-对象属性为其他对象","children":[]},{"level":3,"title":"原理阐述","slug":"原理阐述","link":"#原理阐述","children":[]}]}],"relativePath":"面试/NONI/JS/JS基础/new操作符实现原理.md"}'),o={name:"面试/NONI/JS/JS基础/new操作符实现原理.md"},p=l(`

    new操作符的实现原理

    new操作符的定义

    使用示例（对象类型和对象实例）

    new操作符可以用来创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。（来自MDN的定义）

    简而言之：new可以创建对象实例

    使用场景：

    js
    function newTest(arguments1,arguments2) {	//构造一个函数newTest
+import{_ as s,c as n,o as a,a as l}from"./app.e7d182be.js";const i=JSON.parse('{"title":"","description":"","frontmatter":{},"headers":[{"level":2,"title":"new操作符的实现原理","slug":"new操作符的实现原理","link":"#new操作符的实现原理","children":[{"level":3,"title":"new操作符的定义","slug":"new操作符的定义","link":"#new操作符的定义","children":[]},{"level":3,"title":"示例2（对象属性为其他对象）","slug":"示例2-对象属性为其他对象","link":"#示例2-对象属性为其他对象","children":[]},{"level":3,"title":"原理阐述","slug":"原理阐述","link":"#原理阐述","children":[]}]}],"relativePath":"面试/NONI/JS/JS基础/new操作符实现原理.md"}'),o={name:"面试/NONI/JS/JS基础/new操作符实现原理.md"},p=l(`
    new操作符的实现原理 
    new操作符的定义 
    示例1（对象类型和对象实例） 
    new操作符可以用来创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。（来自MDN的定义）
    简而言之：new可以创建对象实例
    使用场景：
    js
    function newTest(arguments1,arguments2) {	//构造一个函数newTest
     this.arguments1 = arguments1;
     this.arguments2 = arguments2;
 }
diff --git "a/assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.0db32377.lean.js" "b/assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.45a6f5da.lean.js"
similarity index 100%
rename from "assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.0db32377.lean.js"
rename to "assets/\351\235\242\350\257\225_NONI_JS_JS\345\237\272\347\241\200_new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.md.45a6f5da.lean.js"
diff --git a/hashmap.json b/hashmap.json
index 5d47fff..993f0fc 100644
--- a/hashmap.json
+++ b/hashmap.json
@@ -1 +1 @@
-{"js.ts_基础_一文搞懂map函数.md":"6f738674","tips_2023.3.5.md":"21509e11","计算机基础_index.md":"e2044195","js.ts_基础_new操作符.md":"7f59965c","react_reacthooks_useeffect.md":"d902d48b","react_reacthooks_usecontext.md":"847d487b","react_reacthooks_useref.md":"3ac096c6","react_reacthooks_usecallback.md":"8457f7bc","react_reacthooks_usestate.md":"50a896e5","计算机基础_git_命令_merge.md":"c0baf43e","vue_源码分析_vnode与diff算法.md":"0e1165a1","vue_组件通信_api-parent.md":"9f04918c","vue_组件通信_api-props.md":"1fc0fa94","vue_组件通信_api-attrs.md":"151c8caa","index.md":"15a13528","js.ts_es6_iterator.md":"127df911","js.ts_ts_is.md":"eb4151ba","js.ts_基础_eventloop.md":"13c81eeb","js.ts_ts_索引.md":"34950033","js.ts_基础_js中的map和weakmap.md":"4a55a6ee","开发总结_常用的库_css.md":"e5d574f8","计算机基础_git_tips.md":"cac69e35","算法_二叉树_层序遍历.md":"9bc886d9","算法_面试算法题_1.15七牛云春招笔试题.md":"e275a4e2","计算机基础_git_命令_常用.md":"d9685af2","计算机基础_git_场景及解决方案_发版.md":"0318bfab","算法_面试算法题_1.7字节.md":"2c92daa3","计算机基础_git_git规范.md":"cf2fcef2","计算机基础_git_git设置两个ssh密钥.md":"2d08a8e0","开发总结_github-deploy.md":"921b5690","计算机基础_git_场景及解决方案_紧急bug.md":"7c4d025b","开发总结_v-for和v-if.md":"39e07e00","js.ts_基础_垃圾回收.md":"48659112","面试_cz前端_html_css.md":"02eebf96","计算机基础_http.md":"b23a7b0f","js.ts_设计模式_发布订阅模式.md":"806a2619","面试_noni_js_js基础_new操作符实现原理.md":"0db32377","面试_noni_js_js基础_dom和bom.md":"f9bf8e78","面试_cz前端_js基础_原型和原型链.md":"aa4c10ca","面试_cz前端_js基础_异步.md":"962b5778","计算机基础_git_场景及解决方案_开发新功能.md":"f4084ef2","面试_前端_http_http的优先级.md":"a3ebd34a","面试_noni_js_js基础_手写防抖节流.md":"feda70b1","vue_css_scroll.md":"e814a328","js.ts_es6_symbol.md":"e0363ef2","js.ts_es6_解构赋值.md":"6a0724ff","react_redux.md":"60643533","js.ts_es6_index.md":"80fcad39","vue_组件通信_api-provide.md":"ccf20d43","js.ts_js上下文和执行栈.md":"3d56bc83","js.ts_es6_promise.md":"13deaa08","js.ts_es6_运算符.md":"126e65a5","计算机基础_git_命令_init.md":"c047b043","计算机基础_git_index.md":"0985af5e","面试_前端_事件_事件循环.md":"74f35ced","面试_前端_事件_事件机制.md":"d6e13daf","面试_前端_跨域.md":"50822428","面试_前端_url到页面_总章.md":"91332a01","面试_前端_客户端存储.md":"be88b5aa","面试_noni_vue_v-if和v-for同时使用问题.md":"8e44b224","面试_前端_flexandgrid.md":"25a3110d","面试_noni_js_js基础_数组原生方法.md":"87d8643d","开发总结_adobe-pr插件.md":"d76317a3","开发总结_canvas_canvas.md":"2523b101","react_index.md":"0012e3a8","面试_noni_js_js基础_手写call.md":"e0a488b6","面试_cz前端_js基础_变量类型和计算.md":"d5f75960","面试_cz前端_js基础_作用域和闭包.md":"9e5fa0bd"}
+{"js.ts_es6_运算符.md":"126e65a5","js.ts_基础_js中的map和weakmap.md":"4a55a6ee","js.ts_js上下文和执行栈.md":"3d56bc83","js.ts_es6_解构赋值.md":"6a0724ff","react_reacthooks_usecallback.md":"8457f7bc","react_reacthooks_usecontext.md":"847d487b","react_reacthooks_useeffect.md":"d902d48b","js.ts_ts_is.md":"eb4151ba","js.ts_ts_索引.md":"34950033","js.ts_基础_垃圾回收.md":"48659112","js.ts_基础_eventloop.md":"13c81eeb","js.ts_基础_一文搞懂map函数.md":"6f738674","js.ts_es6_iterator.md":"127df911","js.ts_基础_new操作符.md":"7f59965c","js.ts_es6_index.md":"80fcad39","js.ts_设计模式_发布订阅模式.md":"806a2619","js.ts_es6_symbol.md":"e0363ef2","js.ts_es6_promise.md":"13deaa08","react_index.md":"0012e3a8","开发总结_github-deploy.md":"921b5690","开发总结_canvas_canvas.md":"2523b101","tips_2023.3.5.md":"21509e11","计算机基础_git_场景及解决方案_紧急bug.md":"7c4d025b","计算机基础_git_场景及解决方案_开发新功能.md":"f4084ef2","开发总结_adobe-pr插件.md":"d76317a3","计算机基础_index.md":"e2044195","面试_cz前端_html_css.md":"02eebf96","面试_cz前端_js基础_作用域和闭包.md":"9e5fa0bd","面试_cz前端_js基础_原型和原型链.md":"aa4c10ca","react_redux.md":"60643533","vue_组件通信_api-props.md":"1fc0fa94","面试_cz前端_js基础_变量类型和计算.md":"d5f75960","面试_noni_js_js基础_手写防抖节流.md":"feda70b1","面试_noni_js_js基础_手写call.md":"e0a488b6","开发总结_v-for和v-if.md":"39e07e00","面试_noni_js_js基础_数组原生方法.md":"87d8643d","面试_noni_vue_v-if和v-for同时使用问题.md":"8e44b224","计算机基础_git_命令_init.md":"c047b043","计算机基础_git_git规范.md":"cf2fcef2","面试_前端_http_http的优先级.md":"a3ebd34a","index.md":"15a13528","react_reacthooks_useref.md":"3ac096c6","面试_前端_url到页面_总章.md":"91332a01","vue_组件通信_api-attrs.md":"151c8caa","面试_前端_客户端存储.md":"be88b5aa","面试_前端_事件_事件机制.md":"d6e13daf","vue_组件通信_api-provide.md":"ccf20d43","开发总结_常用的库_css.md":"e5d574f8","面试_前端_跨域.md":"50822428","计算机基础_http.md":"b23a7b0f","计算机基础_git_命令_merge.md":"c0baf43e","面试_cz前端_js基础_异步.md":"962b5778","算法_二叉树_层序遍历.md":"9bc886d9","vue_css_scroll.md":"e814a328","计算机基础_git_命令_常用.md":"d9685af2","计算机基础_git_tips.md":"cac69e35","面试_前端_flexandgrid.md":"25a3110d","vue_组件通信_api-parent.md":"9f04918c","计算机基础_git_git设置两个ssh密钥.md":"2d08a8e0","算法_面试算法题_1.7字节.md":"2c92daa3","面试_noni_js_js基础_dom和bom.md":"f9bf8e78","vue_源码分析_vnode与diff算法.md":"0e1165a1","面试_noni_js_js基础_new操作符实现原理.md":"45a6f5da","计算机基础_git_index.md":"0985af5e","计算机基础_git_场景及解决方案_发版.md":"0318bfab","面试_前端_事件_事件循环.md":"74f35ced","算法_面试算法题_1.15七牛云春招笔试题.md":"e275a4e2","react_reacthooks_usestate.md":"50a896e5"}
diff --git a/index.html b/index.html
index f6e2896..5f8821d 100644
--- a/index.html
+++ b/index.html
@@ -20,7 +20,7 @@
   
   
     
    怀谷
    Appearance
    怀谷
    敦兮其若朴 旷兮其若谷
    快速开始
    View on Github
    图片怎么不见了？？？？？？？？？？？？
    🖖
    Vue/React/Angular
    🖖
    Webpack/gulp/rollup
    🛠️
    leetcode/TCP/IP
    
-    
+    
     
     
   
diff --git a/tips/2023.3.5.html b/tips/2023.3.5.html
index b7c99f4..5d0e72a 100644
--- a/tips/2023.3.5.html
+++ b/tips/2023.3.5.html
@@ -24,7 +24,7 @@
 console.log(regex.source); // "fooBar"，不包含 /.../ 和 "ig"。
 
 
    自动发版 semantic-release
    - + diff --git "a/\345\274\200\345\217\221\346\200\273\347\273\223/Adobe-pr\346\217\222\344\273\266.html" "b/\345\274\200\345\217\221\346\200\273\347\273\223/Adobe-pr\346\217\222\344\273\266.html" index 18e18b4..3a505b0 100644 --- "a/\345\274\200\345\217\221\346\200\273\347\273\223/Adobe-pr\346\217\222\344\273\266.html" +++ "b/\345\274\200\345\217\221\346\200\273\347\273\223/Adobe-pr\346\217\222\344\273\266.html" @@ -75,7 +75,7 @@ </DispatchInfoList> </ExtensionManifest>

    打包安装有机会再进行更新

    此处占位

    ELES？

    🌞事实上UXP可能更为友好，这里不再赘述

    🌞jsx操作CEP的API可能正是你需要的

    🌞感谢大家的分享以及相关依赖的开发🌟🌟🌟🌟

    - + diff --git "a/\345\274\200\345\217\221\346\200\273\347\273\223/canvas/canvas.html" "b/\345\274\200\345\217\221\346\200\273\347\273\223/canvas/canvas.html" index 22dfc48..eae0b88 100644 --- "a/\345\274\200\345\217\221\346\200\273\347\273\223/canvas/canvas.html" +++ "b/\345\274\200\345\217\221\346\200\273\347\273\223/canvas/canvas.html" @@ -38,7 +38,7 @@ height: this.height(), }); - + diff --git "a/\345\274\200\345\217\221\346\200\273\347\273\223/github-deploy.html" "b/\345\274\200\345\217\221\346\200\273\347\273\223/github-deploy.html" index 908b785..16c7551 100644 --- "a/\345\274\200\345\217\221\346\200\273\347\273\223/github-deploy.html" +++ "b/\345\274\200\345\217\221\346\200\273\347\273\223/github-deploy.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    github deploy

    在根目录配置github/workflows 新建 xx.yml文件

    alt

    配置page页面

    配置actions

    成功

    - + diff --git "a/\345\274\200\345\217\221\346\200\273\347\273\223/v-for\345\222\214v-if.html" "b/\345\274\200\345\217\221\346\200\273\347\273\223/v-for\345\222\214v-if.html" index 3d396ef..e7cc0fc 100644 --- "a/\345\274\200\345\217\221\346\200\273\347\273\223/v-for\345\222\214v-if.html" +++ "b/\345\274\200\345\217\221\346\200\273\347\273\223/v-for\345\222\214v-if.html" @@ -90,7 +90,7 @@ </script>

    这样在切换的时候会多次渲染goodlist

    原因也很简单

    在第一次渲染的时候是正常渲染 v-for 在组件挂载的时候

    但是在v-if 执行后会重新渲染但是没有之前的DOM节点 又通过v-for 渲染了一次

    第二次渲染可能在update 时（没测试过先这样明天再来）

    至于为什么没有销毁大概是没有指令销毁吧 、

    - + diff --git "a/\345\274\200\345\217\221\346\200\273\347\273\223/\345\270\270\347\224\250\347\232\204\345\272\223/css.html" "b/\345\274\200\345\217\221\346\200\273\347\273\223/\345\270\270\347\224\250\347\232\204\345\272\223/css.html" index 4b49a66..95b3a3e 100644 --- "a/\345\274\200\345\217\221\346\200\273\347\273\223/\345\270\270\347\224\250\347\232\204\345\272\223/css.html" +++ "b/\345\274\200\345\217\221\346\200\273\347\273\223/\345\270\270\347\224\250\347\232\204\345\272\223/css.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page
    - + diff --git "a/\347\256\227\346\263\225/\344\272\214\345\217\211\346\240\221/\345\261\202\345\272\217\351\201\215\345\216\206.html" "b/\347\256\227\346\263\225/\344\272\214\345\217\211\346\240\221/\345\261\202\345\272\217\351\201\215\345\216\206.html" index f13e4f6..ea2e6cb 100644 --- "a/\347\256\227\346\263\225/\344\272\214\345\217\211\346\240\221/\345\261\202\345\272\217\351\201\215\345\216\206.html" +++ "b/\347\256\227\346\263\225/\344\272\214\345\217\211\346\240\221/\345\261\202\345\272\217\351\201\215\345\216\206.html" @@ -93,7 +93,7 @@ };

    👹好的，今天的层序遍历我们到此结束

    - + diff --git "a/\347\256\227\346\263\225/\351\235\242\350\257\225\347\256\227\346\263\225\351\242\230/1.15\344\270\203\347\211\233\344\272\221\346\230\245\346\213\233\347\254\224\350\257\225\351\242\230.html" "b/\347\256\227\346\263\225/\351\235\242\350\257\225\347\256\227\346\263\225\351\242\230/1.15\344\270\203\347\211\233\344\272\221\346\230\245\346\213\233\347\254\224\350\257\225\351\242\230.html" index b87eefa..feecd79 100644 --- "a/\347\256\227\346\263\225/\351\235\242\350\257\225\347\256\227\346\263\225\351\242\230/1.15\344\270\203\347\211\233\344\272\221\346\230\245\346\213\233\347\254\224\350\257\225\351\242\230.html" +++ "b/\347\256\227\346\263\225/\351\235\242\350\257\225\347\256\227\346\263\225\351\242\230/1.15\344\270\203\347\211\233\344\272\221\346\230\245\346\213\233\347\254\224\350\257\225\351\242\230.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    aa-bb-cc to AaBbCc

    算法实现模板字符串

    给一个数组，栈，依次入栈，且栈顶元素随时可以弹出

    - + diff --git "a/\347\256\227\346\263\225/\351\235\242\350\257\225\347\256\227\346\263\225\351\242\230/1.7\345\255\227\350\212\202.html" "b/\347\256\227\346\263\225/\351\235\242\350\257\225\347\256\227\346\263\225\351\242\230/1.7\345\255\227\350\212\202.html" index 7925c89..f243137 100644 --- "a/\347\256\227\346\263\225/\351\235\242\350\257\225\347\256\227\346\263\225\351\242\230/1.7\345\255\227\350\212\202.html" +++ "b/\347\256\227\346\263\225/\351\235\242\350\257\225\347\256\227\346\263\225\351\242\230/1.7\345\255\227\350\212\202.html" @@ -42,7 +42,7 @@ return result; } - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/HTTP.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/HTTP.html" index b258f0e..5799333 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/HTTP.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/HTTP.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    HTTP

    version

    1. HTTP 0.9

    只有一个get , 一次TCP连接只能发送一次HTTP请求

    1. HTTP 1.0

    增加一些新方法 head post

    增加响应状态码, 对可能错误的原因进行标记

    引入 HTTP HEADER

    HTTP/1.0最核心的改变是增加了头部设定，头部内容以键值对的形式设置。请求头部通过 Accept 字段来告诉服务端可以接收的文件类型，响应头部再通过 Content-Type 字段来告诉浏览器返回文件的类型

    1. HTTP 1.1

    长连接: 引入TCP 连接复用

    引入管道机制 一个TCP连接，可以同时发送多个请求

    允许数据分块

    1. HTTP 2.0 不再使用ASCII 传输而是使用二进制数据来提升传输效率
    - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/git\350\247\204\350\214\203.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/git\350\247\204\350\214\203.html" index c0c9cea..bd0717f 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/git\350\247\204\350\214\203.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/git\350\247\204\350\214\203.html" @@ -34,7 +34,7 @@ perf: 优化相关，比如提升性能、体验 revert: 回滚到上一个版本



    -----------------------------------from后端gitlab开发文档规范------------------------------

    - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/git\350\256\276\347\275\256\344\270\244\344\270\252ssh\345\257\206\351\222\245.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/git\350\256\276\347\275\256\344\270\244\344\270\252ssh\345\257\206\351\222\245.html" index 34105d5..11010f3 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/git\350\256\276\347\275\256\344\270\244\344\270\252ssh\345\257\206\351\222\245.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/git\350\256\276\347\275\256\344\270\244\344\270\252ssh\345\257\206\351\222\245.html" @@ -38,7 +38,7 @@     HostkeyAlgorithms +ssh-rsa     PubkeyAcceptedAlgorithms +ssh-rsa - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/index.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/index.html" index e009c56..97134d4 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/index.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/index.html" @@ -22,7 +22,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    git

    远端维护一个存储库，每个人从远端拉取代码 alt

    对比svn

    git 是分布式的，而svn是集中式的

    svn 严重依赖于服务器端 挂了就啥都没了 而git可以从另外的客户端获取所以代码

    git config

    git 配置分为全局配置和本地配置

    即命令行输入用带上 --global

    或者在全局配置文件中修改.gitconfig文件

    bash
    git config --global user.name "your-username"
 git config --global user.email "your-email-address"

    更多配置点这里

    分支的概念

    A->B->D (main) A->C (master)

    git checkout <分支名字> 切换分支

    git merge <分支名字> 将此分支合并在当前分支

    - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/tips.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/tips.html" index 86f007a..ab0684e 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/tips.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/tips.html" @@ -21,7 +21,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    配置别名

    展示git提交记录

    bash
    git config --global alias.lg "log --color --graph --pretty=format:'%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset' --abbrev-commit"
    - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/init.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/init.html" index f615a57..cf679e1 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/init.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/init.html" @@ -151,7 +151,7 @@ | ├─push-to-checkout.sample | └update.sample - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/merge.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/merge.html" index b2842b1..42f9045 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/merge.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/merge.html" @@ -27,7 +27,7 @@ A->D->E master

    fast-forward

    如果一个分支的提交历史是另一个分支的子集，那么Git会简单地将当前分支指向另一个分支的最新提交，这样就完成了合并操作

    recursive

    在recursive合并策略中，Git会创建一个新的提交来表示合并结果，这个提交会包含两个分支的所有变更内容。

    - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/\345\270\270\347\224\250.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/\345\270\270\347\224\250.html" index 110865e..edc22e2 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/\345\270\270\347\224\250.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\221\275\344\273\244/\345\270\270\347\224\250.html" @@ -24,7 +24,7 @@ git pull origin master //拉取远程的master分支 - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\345\217\221\347\211\210.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\345\217\221\347\211\210.html" index 4a41365..45402fb 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\345\217\221\347\211\210.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\345\217\221\347\211\210.html" @@ -25,7 +25,7 @@ git branch release -b git push release:release - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\345\274\200\345\217\221\346\226\260\345\212\237\350\203\275.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\345\274\200\345\217\221\346\226\260\345\212\237\350\203\275.html" index dd74978..3f870bd 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\345\274\200\345\217\221\346\226\260\345\212\237\350\203\275.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\345\274\200\345\217\221\346\226\260\345\212\237\350\203\275.html" @@ -37,7 +37,7 @@ |->E---->F feature

    参考 https://git-scm.com/book/zh/v2/Git-分支-分支的新建与合并

    - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\347\264\247\346\200\245bug.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\347\264\247\346\200\245bug.html" index 9bcaa22..29cf1a4 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\347\264\247\346\200\245bug.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/git/\345\234\272\346\231\257\345\217\212\350\247\243\345\206\263\346\226\271\346\241\210/\347\264\247\346\200\245bug.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    当遇到紧急bug

    - + diff --git "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/index.html" "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/index.html" index 4547da9..c5f6def 100644 --- "a/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/index.html" +++ "b/\350\256\241\347\256\227\346\234\272\345\237\272\347\241\200/index.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page
    - + diff --git "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/HTML+CSS.html" "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/HTML+CSS.html" index 7880aed..13ee1d0 100644 --- "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/HTML+CSS.html" +++ "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/HTML+CSS.html" @@ -43,7 +43,7 @@ <p>this is p</p> </body>

    响应式

    CSS3

    - + diff --git "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\344\275\234\347\224\250\345\237\237\345\222\214\351\227\255\345\214\205.html" "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\344\275\234\347\224\250\345\237\237\345\222\214\351\227\255\345\214\205.html" index c5003ea..375bbe8 100644 --- "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\344\275\234\347\224\250\345\237\237\345\222\214\351\227\255\345\214\205.html" +++ "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\344\275\234\347\224\250\345\237\237\345\222\214\351\227\255\345\214\205.html" @@ -86,7 +86,7 @@ } } - + diff --git "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\216\237\345\236\213\345\222\214\345\216\237\345\236\213\351\223\276.html" "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\216\237\345\236\213\345\222\214\345\216\237\345\236\213\351\223\276.html" index 55d185a..6207cf3 100644 --- "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\216\237\345\236\213\345\222\214\345\216\237\345\236\213\351\223\276.html" +++ "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\216\237\345\236\213\345\222\214\345\216\237\345\236\213\351\223\276.html" @@ -81,7 +81,7 @@ // 扩展自己的API } - + diff --git "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\217\230\351\207\217\347\261\273\345\236\213\345\222\214\350\256\241\347\256\227.html" "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\217\230\351\207\217\347\261\273\345\236\213\345\222\214\350\256\241\347\256\227.html" index d635f82..c3cf4e9 100644 --- "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\217\230\351\207\217\347\261\273\345\236\213\345\222\214\350\256\241\347\256\227.html" +++ "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\217\230\351\207\217\347\261\273\345\236\213\345\222\214\350\256\241\347\256\227.html" @@ -90,7 +90,7 @@

  • if语句和逻辑运算里判断的就是是否为truly还是falsely变量，如if(1) if(null)等等

  • js
    10 && 0  //0
 '' || 'abc'  // 'abc'
    • - + diff --git "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\274\202\346\255\245.html" "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\274\202\346\255\245.html" index e5b774b..81288de 100644 --- "a/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\274\202\346\255\245.html" +++ "b/\351\235\242\350\257\225/CZ\345\211\215\347\253\257/JS\345\237\272\347\241\200/\345\274\202\346\255\245.html" @@ -86,7 +86,7 @@ alert('setTimeout') //此时DOM渲染完成 })

  • 从event loop解释，为何微任务执行更早

    • - + diff --git "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/DOM\345\222\214BOM.html" "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/DOM\345\222\214BOM.html" index 2352732..60fd72e 100644 --- "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/DOM\345\222\214BOM.html" +++ "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/DOM\345\222\214BOM.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    DOM和BOM

    JavaScript的结构

    JavaScript = ECMAscript + BOM + DOM

    ECMAscript：JS的标准，规定了各个浏览器如何执行JS的语法。

    DOM：用于操作XML、HTML文档的应用编程接口。给JS提供了访问和操作HTML元素的方法

    BOM：浏览器对象模型，是控制浏览器行为的接口。

    DOM

    DOM树

    HTML元素所构成的树

    DOM操作元素方法

    获取节点的DOM方法：

    1. getElementById(id)：通过元素的id属性获取单个元素节点，返回对象
    2. getElementsByTagName(tagName)：通过元素的标签名获取一组元素节点，返回数组
    3. getElementsByClassName(className)：通过元素的类名获取一组元素节点，返回数组
    4. getElementsByName(name_content)：通过元素的name属性值来获取元素，返回数组
    5. querySelector(selector)：通过选择器获取匹配的第一个元素节点，对象
    6. querySelectorAll(selector)：通过选择器获取匹配的所有元素节点，数组

    获取/设置元素的属性值的DOM方法：

    1. getAttribute(name)：获取元素的指定属性值。
    2. setAttribute(name, value)：设置元素的指定属性值。
    3. removeAttribute(name)：移除元素的指定属性。

    创建节点(Node)的DOM方法：

    1. createElement(tagName)：创建指定标签名的元素节点。
    2. createTextNode(text)：创建包含指定文本内容的文本节点。
    3. createDocumentFragment()：创建一个空的文档片段节点，可以用来存储和操作一组节点。

    增添节点的DOM方法：

    1. appendChild(node)：将一个节点添加到父节点的子节点列表末尾。
    2. insertBefore(newNode, referenceNode)：在父节点的子节点列表中，在指定参考节点之前插入新节点。

    删除节点的DOM方法：

    1. removeChild(node)：从父节点的子节点列表中移除指定节点。
    2. parentNode.removeChild(node)：通过父节点移除指定节点。

    DOM常见的一些属性：

    1. innerHTML：元素的HTML内容。
    2. textContent：元素及其后代节点的文本内容。
    3. className：元素的类名。
    4. id：元素的唯一标识符。
    5. style：元素的行内样式。
    6. parentNode：元素的父节点。
    7. childNodes：元素的子节点列表。
    8. previousSibling：元素的前一个同级节点。
    9. nextSibling：元素的后一个同级节点。

    BOM

    定义

    浏览器对象模型，核心对象window，包含DOM。把浏览器作为对象来看待，顶级对象就是window，由一系列相关对象构成，并为每个对象提供方法和属性。

    document,location,navigation,screen,history

    window对象常见事件

    属性/方法含义
    opener当前窗口的父窗口
    length窗口中的框架数
    document窗口中当前显示的文档对象
    alert(string)创建一个警告对话框，显示一条信息
    close()关闭窗口
    confirm()创建一个需要用户确认的对话框
    open(url,name,[options])打开一个新窗口并返回新 window 对象
    prompt(text,defaultInput)创建一个对话框要求用户输入信息
    setInterval(expression,milliseconds)经过指定时间间隔计算一个表达式
    setInterval(function,millis enconds,[arguments])经过指定时间间隔后调用一个函数
    setTimeout(expression,milli seconds)在定时器超过后计算一个表达式
    setTimeout(expression,milli seconds,[arguments])在定时器超过时后计算一个函数

    location对象

    location用于获取或设置URL，能够解析URL，返回对象

    window.location = location = document.location

    属性/方法内容
    host主机名：端口号
    hostname主机名
    href整个 URL
    pathname路径名
    port端口号
    protocol协议部分
    search查询字符串
    reload()重载当前 URL
    repalce()用新的 URL 替换当前页面

    history对象

    与浏览器历史记录交互，包含用户访问过的URL（窗口打开开始记）

    属性/方法描述
    lengthhistory 对象中的记录数
    back()前往浏览器历史条目前一个 URL，类似后退
    forward()前往浏览器历史条目下一个 URL，类似前进
    go(num)浏览器在 history 对象中向前或向后

    BOM中识别客户端浏览器的一个window属性。

    属性说明
    appName完整的浏览器名称和版本信息
    platform浏览器所在的系统平台
    plugins浏览器中安装的插件信息的数 组
    userAgent浏览器的用户代理字符串
    userLanguage操作系统的默认语言
    - + diff --git "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.html" "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.html" index 56b3c45..8752c01 100644 --- "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.html" +++ "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/new\346\223\215\344\275\234\347\254\246\345\256\236\347\216\260\345\216\237\347\220\206.html" @@ -7,7 +7,7 @@ - + -
    怀谷

    Appearance

    Return to top
    On this page

    new操作符的实现原理

    new操作符的定义

    使用示例（对象类型和对象实例）

    new操作符可以用来创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。（来自MDN的定义）

    简而言之：new可以创建对象实例

    使用场景：

    js
    function newTest(arguments1,arguments2) {	//构造一个函数newTest
+    
    怀谷
    Appearance
     Return to top 
    On this page
    new操作符的实现原理 
    new操作符的定义 
    示例1（对象类型和对象实例） 
    new操作符可以用来创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。（来自MDN的定义）
    简而言之：new可以创建对象实例
    使用场景：
    js
    function newTest(arguments1,arguments2) {	//构造一个函数newTest
     this.arguments1 = arguments1;
     this.arguments2 = arguments2;
 }
@@ -66,7 +66,7 @@
 console.log(test.arguments1);	//'demo1'
 console.log(test.arguments2);	//'demo2'
 
    
-    
+    
     
     
   
diff --git "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\211\213\345\206\231call.html" "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\211\213\345\206\231call.html"
index 662b548..addf316 100644
--- "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\211\213\345\206\231call.html"
+++ "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\211\213\345\206\231call.html"
@@ -92,7 +92,7 @@
   }
 }
    - + diff --git "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\211\213\345\206\231\351\230\262\346\212\226\350\212\202\346\265\201.html" "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\211\213\345\206\231\351\230\262\346\212\226\350\212\202\346\265\201.html" index 1efe788..b853fd8 100644 --- "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\211\213\345\206\231\351\230\262\346\212\226\350\212\202\346\265\201.html" +++ "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\211\213\345\206\231\351\230\262\346\212\226\350\212\202\346\265\201.html" @@ -56,7 +56,7 @@ } } - + diff --git "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\225\260\347\273\204\345\216\237\347\224\237\346\226\271\346\263\225.html" "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\225\260\347\273\204\345\216\237\347\224\237\346\226\271\346\263\225.html" index 508e8f0..c000f3d 100644 --- "a/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\225\260\347\273\204\345\216\237\347\224\237\346\226\271\346\263\225.html" +++ "b/\351\235\242\350\257\225/NONI/JS/JS\345\237\272\347\241\200/\346\225\260\347\273\204\345\216\237\347\224\237\346\226\271\346\263\225.html" @@ -76,7 +76,7 @@ console.log(sum) //10 - + diff --git "a/\351\235\242\350\257\225/NONI/Vue/v-if\345\222\214v-for\345\220\214\346\227\266\344\275\277\347\224\250\351\227\256\351\242\230.html" "b/\351\235\242\350\257\225/NONI/Vue/v-if\345\222\214v-for\345\220\214\346\227\266\344\275\277\347\224\250\351\227\256\351\242\230.html" index 5bd80b4..1b5ee92 100644 --- "a/\351\235\242\350\257\225/NONI/Vue/v-if\345\222\214v-for\345\220\214\346\227\266\344\275\277\347\224\250\351\227\256\351\242\230.html" +++ "b/\351\235\242\350\257\225/NONI/Vue/v-if\345\222\214v-for\345\220\214\346\227\266\344\275\277\347\224\250\351\227\256\351\242\230.html" @@ -58,7 +58,7 @@ </ul>

    适用场景

    该方法避免了渲染本应该被隐藏的列表。如果需要根据某个条件动态渲染一组元素时，可以使用v-if指令。

    优点

    缺点

    总结

    - + diff --git "a/\351\235\242\350\257\225/\345\211\215\347\253\257/HTTP/HTTP\347\232\204\344\274\230\345\205\210\347\272\247.html" "b/\351\235\242\350\257\225/\345\211\215\347\253\257/HTTP/HTTP\347\232\204\344\274\230\345\205\210\347\272\247.html" index 60471d2..e4a1582 100644 --- "a/\351\235\242\350\257\225/\345\211\215\347\253\257/HTTP/HTTP\347\232\204\344\274\230\345\205\210\347\272\247.html" +++ "b/\351\235\242\350\257\225/\345\211\215\347\253\257/HTTP/HTTP\347\232\204\344\274\230\345\205\210\347\272\247.html" @@ -21,7 +21,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    强缓存

    Expires(HTTP/1.0)和Cache-Control(HTTP1.1)，其中Cache-Control优先级高于Expires 位于请求/响应头

    Expires 

    Expires: Wed, 22 Oct 2018 08:41:00 GMT

    由于Expires受制于客户端时间，修改客户端时间可能导致缓存失效

    Cache-Control

    请求/响应头，缓存控制字段，精确控制缓存策略 这里涉及到的字段是max-age,Cache-Control还有其他字段

    协商缓存

    1. 没有 Cache-Control 和 Expires
    2. Cache-Control 和 Expires 过期
    3. 设置了 no-cache

    如果有更新即更新缓存 200 没有缓存则更新浏览器缓存有效期 304

    ETag

    对比HTTP1.x

    使用HTTP/1.x，浏览器可以完全控制资源加载顺序。每个连接一次只能支持一个资源请求，服务器会尽快返回请求的内容。浏览器可以通过决定何时请求资源以及打开多少个并行连接来安排请求

    1.HTTP 协议老的标准是HTTP/1.0，为了提高系统的效率，HTTP 1.0规定浏览器与服务器只保持短暂的连接，浏览器的每次请求都需要与服务器建立一个TCP连接，服务器完成请求处理后立即断开TCP连接，服务器不跟踪每个客户也不记录过去的请求。即无状态，并且HTTP1的连接无法复用导致每一次请求都会经历三次握手和四次挥手

    - + diff --git "a/\351\235\242\350\257\225/\345\211\215\347\253\257/flexandgrid.html" "b/\351\235\242\350\257\225/\345\211\215\347\253\257/flexandgrid.html" index 2cffb56..e232dae 100644 --- "a/\351\235\242\350\257\225/\345\211\215\347\253\257/flexandgrid.html" +++ "b/\351\235\242\350\257\225/\345\211\215\347\253\257/flexandgrid.html" @@ -51,7 +51,7 @@ grid-template-rows: repeat(3, 33.33%); }

    auto-fill

    有时，单元格的大小是固定的，但是容器的大小不确定。如果希望每一行（或每一列）容纳尽可能多的单元格，这时可以使用auto-fill关键字表示自动填充。

    fr 关键字

    为了方便表示比例关系，网格布局提供了fr关键字（fraction 的缩写，意为"片段"）。如果两列的宽度分别为1fr和2fr，就表示后者是前者的两倍。

    间隔

    grid-row-gap属性设置行与行的间隔（行间距），grid-column-gap属性设置列与列的间隔（列间距）。

    - + diff --git "a/\351\235\242\350\257\225/\345\211\215\347\253\257/url\345\210\260\351\241\265\351\235\242/\346\200\273\347\253\240.html" "b/\351\235\242\350\257\225/\345\211\215\347\253\257/url\345\210\260\351\241\265\351\235\242/\346\200\273\347\253\240.html" index 1fb3f18..3214c63 100644 --- "a/\351\235\242\350\257\225/\345\211\215\347\253\257/url\345\210\260\351\241\265\351\235\242/\346\200\273\347\253\240.html" +++ "b/\351\235\242\350\257\225/\345\211\215\347\253\257/url\345\210\260\351\241\265\351\235\242/\346\200\273\347\253\240.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    URL面试题目

    面试中有一个高频的面试题就是当输入URL时会发生什么，越详细越好，ok,接下来我们一起来看看

    DNS域名解析

    在浏览器输入网址后，首先要经过域名解析，因为浏览器并不能直接通过域名(www.baidu.com)找到对应的服务器，而是要通过 IP 地址(220.114.23.56)

    1.1 DNS域名解析

    按照顺序为浏览器缓存，系统缓存，路由器缓存，IPS服务器缓存，根域名服务器缓存，顶级域名服务器缓存，主域名服务器缓存

    - + diff --git "a/\351\235\242\350\257\225/\345\211\215\347\253\257/\344\272\213\344\273\266/\344\272\213\344\273\266\345\276\252\347\216\257.html" "b/\351\235\242\350\257\225/\345\211\215\347\253\257/\344\272\213\344\273\266/\344\272\213\344\273\266\345\276\252\347\216\257.html" index d8ec69a..a53c6a0 100644 --- "a/\351\235\242\350\257\225/\345\211\215\347\253\257/\344\272\213\344\273\266/\344\272\213\344\273\266\345\276\252\347\216\257.html" +++ "b/\351\235\242\350\257\225/\345\211\215\347\253\257/\344\272\213\344\273\266/\344\272\213\344\273\266\345\276\252\347\216\257.html" @@ -34,7 +34,7 @@ console.log(6); //146235 - + diff --git "a/\351\235\242\350\257\225/\345\211\215\347\253\257/\344\272\213\344\273\266/\344\272\213\344\273\266\346\234\272\345\210\266.html" "b/\351\235\242\350\257\225/\345\211\215\347\253\257/\344\272\213\344\273\266/\344\272\213\344\273\266\346\234\272\345\210\266.html" index 52ee741..12004f1 100644 --- "a/\351\235\242\350\257\225/\345\211\215\347\253\257/\344\272\213\344\273\266/\344\272\213\344\273\266\346\234\272\345\210\266.html" +++ "b/\351\235\242\350\257\225/\345\211\215\347\253\257/\344\272\213\344\273\266/\344\272\213\344\273\266\346\234\272\345\210\266.html" @@ -36,7 +36,7 @@ }) </script>

    stopPropagation() 阻止事件冒泡，设置之后，点击该元素时父元素绑定的事件就不会再触发； preventDefault() 阻止默认事件发生； stopImmediatePropagation() 用来阻止监听同一事件的其他事件监听器被调用以及阻止事件冒泡

    - + diff --git "a/\351\235\242\350\257\225/\345\211\215\347\253\257/\345\256\242\346\210\267\347\253\257\345\255\230\345\202\250.html" "b/\351\235\242\350\257\225/\345\211\215\347\253\257/\345\256\242\346\210\267\347\253\257\345\255\230\345\202\250.html" index 47fadee..c018817 100644 --- "a/\351\235\242\350\257\225/\345\211\215\347\253\257/\345\256\242\346\210\267\347\253\257\345\255\230\345\202\250.html" +++ "b/\351\235\242\350\257\225/\345\211\215\347\253\257/\345\256\242\346\210\267\347\253\257\345\255\230\345\202\250.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    cookie 大小(4KB)

    当服务器收到 HTTP 请求时，服务器可以在响应头里设置一个 Set-cookie 选项，浏览器接收到响应后会自动保存下 Cookie，之后浏览器对该服务器的每一次请求中都会通过请求头把 Cookie 信息发送给服务器。通过以下 node 版本代码案例（通过 req.cookie 设置 cookie,而不是设置请求头的 Set-cookie字段）当请求了 '/' 路径 Cookie 就会保存如下图信息。后面请求其他 path （如：/login）时在以下代码中都能通过 'req.headers.cookie' 打印出请求携带的 Cookie 信息（即为浏览器保存的 Cookie）。

    Cookie是保存在客户端磁盘上的，所以不宜占据太多磁盘空间。同时，Cookie是绑定在特定域名上的。当设定了一个Cookie之后，再给创建它的域名发一个请求时，还会包含该Cookie。所以对Cookie的限制是对每个域来说的。但各个浏览器也有不同： IE6及以下每个域名最多包含20个Cookie； IE7及以上每个域名最多50个Cookie； Firefox每个域名最多50个Cookie； Opera下每个域名最多30个Cookie； Sarafi和Chrome对每个域的Cookie数目没有严格限制。

    1.过期时间设置（Expires 字段） 2.设置域（domain），指定 cookie 在哪个域下可以被接受 3.设置路径（path），指定 cookie 在当前主机下哪些路径可以接受 Cookie 4.设置不能通过 javascript 访问 Cookie。（HttpOnly字段） 5.设置一段时间过期。（Max-Age） 6.设置 secure 字段 7.设置 someSite ，它有三个可选值 None、strict、Lax

    session

    session是一种服务度机制，类似散列表结构来存储用户数据 浏览器第一次向客户端发送请求时，服务器会自动生成一个session和sessionid sessionid唯一标识这个session 服务器响应时把sessionid发送给浏览器 浏览器第二次向服务器发送请求时就会携带这个sessionid 服务器通过这个id找到对应的session获取用户数据

    TIP

    session保存在服务器，cookie保存在客户端 session中保存的时对象，cookie保存的是字符串 session不能区分路径，同一个用户访问一个网站期间，所有的session在任何一个地方都可以访问 cookie如果设置路径，则在某些地方不能访问 session需要借助cookie才能正常工作，如果禁用cookie,session则失效 客户端会在发送请求的时候，自动将本地存活的cookie封装在信息头发送给服务器

    localstorage and SessionStorage(5101KB)

    失效时间 sessionStorage的失效时间为当前会话是否被关闭, 如果当前会话中存储有key和value,会话关闭数据则消失,所以我们可以得到结论,sessionStorage的失效取决于会话 localStorage的失效时间为用户手动删除,相比sessionStorage的

    - + diff --git "a/\351\235\242\350\257\225/\345\211\215\347\253\257/\350\267\250\345\237\237.html" "b/\351\235\242\350\257\225/\345\211\215\347\253\257/\350\267\250\345\237\237.html" index 33c93ba..19cf79d 100644 --- "a/\351\235\242\350\257\225/\345\211\215\347\253\257/\350\267\250\345\237\237.html" +++ "b/\351\235\242\350\257\225/\345\211\215\347\253\257/\350\267\250\345\237\237.html" @@ -20,7 +20,7 @@
    怀谷

    Appearance

    Return to top
    On this page

    跨域

    跨域，是指浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的

    解决方案如下

    jsonp

    利用了 script 不受同源策略的限制

    缺点：只能 get 方式，易受到 XSS攻击

    CORS（Cross-Origin Resource Sharing）,跨域资源共享

    当使用XMLHttpRequest发送请求时，如果浏览器发现违反了同源策略就会自动加上一个请求头 origin；

    后端在接受到请求后确定响应后会在 Response Headers 中加入一个属性 Access-Control-Allow-Origin；

    浏览器判断响应中的 Access-Control-Allow-Origin 值是否和当前的地址相同，匹配成功后才继续响应处理，否则报错

    缺点：忽略 cookie，浏览器版本有一定要求

    代理跨域请求(Nginx)

    前端向发送请求，经过代理，请求需要的服务器资源

    缺点：需要额外的代理服务器

    基于websocket

    websocket 是 Html5 一种新的协议，基于该协议可以做到浏览器与服务器全双工通信，允许跨域请求

    缺点：浏览器一定版本要求，服务器需要支持 websocket 协议

    - +