hannah1116的博客

原创 使用lerna遇到的问题

当指定的内部依赖版本号跟目标版本号不匹配时，内部依赖无效，将使用npm install的方式来安装外部依赖（持续踩坑，持续更新）

原创 js的.map() 里使用异步方法

.map()里的处理方法是同步的，若想做异步操作，可以这样写。// 使用async await 处理异步操作let results = await Promise.all(arr.map(async (item) => { // 等待异步工作完成 return await asyncWorker(item);}));...

转载 JavaScript 编译器、引擎、作用域

分享一篇文章https://www.jianshu.com/p/36f5bfc6b7e6let c;(function(a, b) { console.log(a); console.log(b); console.log((c = 33)); function a() {} var b = () => {};// const b = () => {}...

转载 彻底理解js执行机制

分享一篇掘金的文章https://juejin.im/post/59e85eebf265da430d571f89 console.log("1");setTimeout(function() { console.log("2"); Promise.resolve().then(() => { console.log("3"); }) new Promi...

原创 使用==引起的类型转换

[] == ![]; //true[] == 0; //true[2] == 2; //true["0"] == false; // true"0" == false; //true[] == false; // true[null] == 0; // truenull == 0; //false[null] == false; //truenull == f...

转载 使用js实现链表

       链表是一种动态的数据结构，不同于数组的是，链表分配内存空间的灵活性，它不会像数组一样被分配一块连续的内存。当你想在数组的任意位置，插入一个新值的时候，必须对数组中的各个元素进行相应的位置移动才能达到目标，开销显然是很大的。然而链表的灵活性在于它的每个元素节点分为两部分，一部分是存储元素本身，另一部分是指向下一个节点元素的引用，也可以称为指针，当你要插入数据时，把上一个节点的向下指针...

转载 React之虚拟DOM

React非常快速是因为它从不直接操作DOM。在React中，render执行的结果得到的并不是真正的DOM节点，而仅仅是JavaScript对象，称之为虚拟DOM。虚拟DOM是在DOM的基础上建立了一个抽象层，对数据和状态所做的任何改动，都会被自动且高效的同步到虚拟DOM，最后再批量同步到DOM中。虚拟DOM具有批处理和高效的Diff算法，可以无需担心性能问题而随时“刷新”整个页面，...

转载 flex布局

摘自阮一峰老师的博客 http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html .box{ display: flex; /* display: inline-flex; */ /* display: -webkit-flex; */}.box { /*垂直居中*/ display: flex; just...

转载 CSS动画

摘自阮一峰老师的博客 http://www.ruanyifeng.com/blog/2014/02/css_transition_and_animation.html transition /**简写**/img1{ transition: 1s 1s height ease;}/**完整写法**/img2{ transition-property: heig...

原创 计算机网络五层模型以及TCP、UDP的区别

转载 数据结构常见的八大排序算法

python实现代码 https://www.cnblogs.com/hokky/p/8529042.html 排序算法：内部排序 + 外部排序内部排序：插入、选择、交换、归并、基数排序插入排序：直接插入排序+希尔排序选择排序：简单选择排序+堆排序交换排序：冒泡排序+快速排序//定义一个公用函数function swap(myArray, p1, p2){ le...

转载 浏览器同源策略和解决办法

摘自阮一峰老师的博客http://www.ruanyifeng.com/blog/2016/04/same-origin-policy.htmlhttp://www.ruanyifeng.com/blog/2016/04/cors.html 同源策略：协议、域名、端口相同若是非同源：Cookie、LocalStorage 和 IndexDB 无法读取； DOM 无法获得；AJA...

转载 http请求方法

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/MethodsGETGET方法请求一个指定资源的表示形式. 使用GET的请求应该只被用于获取数据.HEADHEAD方法请求一个与GET请求的响应相同的响应，但没有响应体.POSTPOST方法用于将实体提交到指定的资源，通常导致状态或服务器上的副作用的更改. PUTPU...

原创 http缓存

分享掘金上关于浏览器缓存机制的一篇文章  https://juejin.im/post/59c602276fb9a00a3d135f2e常见的 HTTP 缓存只能存储 GET 响应HTTP/1.1定义的 Cache-Control 头用来区分对缓存机制的支持情况， 请求头和响应头都支持这个属性。cache-control:no-cache/no-store/must-revalidat...

原创 react子组件与父组件通信

用 function prop 与父组件通信propsprops 本身是不可变的。当我们试图改变 props 的原始值时，React 会报出类型错误的警告，组件的 props 一定来自于默认属性或通过父组件传递而来。refReact提供的这个ref属性，表示为对组件真正实例的引用，其实就是ReactDOM.render()返回的组件实例。在子组件的props里定义fun...

原创 React事件监听相关例子

var TestClickComponent = React.creatsClass({ handleClick: function(event){ //操作DOM节点 var msg = React.findDOMNode(this.refs.tip); if(msg.style.display === 'none'){ ...

原创 React组件的生命周期

var Hello = React.createClass({    getInitialState:function(){        alert('init');        return{            opacity:1.0,            fontSize:'12px'        };    },    render:function(){        retu...

原创 css（知识点）

一、

原创 前端js面试题（高级）

1、ES6模块化如何使用？开发环境如何打包？2、Class和普通构造函数有何区别3、Promise的基本使用和原理4、总结一下ES6其他常用功能5、原型如何实际应用6、原型如何满足扩展7、什么是单线程？和异步有何关系？8、什么是event-loop？9、目前解决JS异步的方案有哪些？10、如果只用jquery如何解决异步11、Promise的标准12、async/await的使用13、什么是vdo...

原创 React和Vue的对比

一、两者的本质区别vue——本质是MVVM框架，由MVC发展而来React——本质是前端组件化框架，由后端组件化发展而来二、模板的区别：模板应该和JS逻辑分离；遵循开放封闭原则vue——使用模板（模板分离上更好）<div>    <h1 v-if="ok">Yes</h1>    <h1 v-else>No</h1></div..

原创 AMD和CommonJS

AMD1、require.js2、全局define函数3、全局require函数4、依赖JS会自动、异步加载CommonJSnodejs模块化规范，现在被大量用于前端的原因：1、前端开发依赖库和插件，都可以从npm中获取2、构建工具的高度自动化，使用npm的成本非常低3、CommonJS不会异步加载JS，而是同步一次性加载出来两者的使用场景1、需要异步加载JS，使用AMD2、使用npm之后建议使用...

原创 前端js面试题（基础）

1、js中使用typeof能得到哪些类型？——undefined、string、number、boolean、object、function2、===和==分别在何时使用？//==的使用情况为以下2种（其他情况下推荐使用===）if(obj.a == null){ //相当于obj.a === null || obj.a === undefined}function fn(a,b){ i...