m_review的博客

react 和 vue 为什么要设置key？key的作用主要是为了 虚拟DOM 在执行 diff算法 时更快的找到对应的节点，提高diff速度，高效的更新 Virtual DOM;key值采用index和id的区别？const list 1 = [ { id: 1, name; 'test1' }, { id: 2, name; 'test2' }, { id: 3, nam...

2018-07-03T10:18:58.000Z是什么时间格式UTC：时间标准时间，世界标准时间 ✅GMT：格林尼治时间GST：北京时间js如何处理UTC时间格式遇到问题：用了阿里云的接口，发现传的日期是UTC格式的。需要转换。import moment from 'moment';export default function formatUTC(utc_datetime) {...

遇到类似功能举一反三mobx的store文件读取上下文代码// 新启用方法const context = require.context('./', false, /\.js$/);const keys = context.keys().filter(item => item !== './index.js');const stores = {};for (let i = 0...

前端优化常用技术加载阻塞性优化执行优化作用域优化循环优化避免双重解释最小化语句数性能的其它注意事项数据存储作用域原型和原型链重排 reflow 和重绘 repaint会导致重排重绘的情况：避免或减少发生重排和重绘的方法：算法和流程控制循环条件判断递归利用闭包缓存数据前端优化常用技术从建立 http 连接开始，到页...

flex布局中 justify-content: space-between方法的排版问题flex给我们的布局带来了很大的方便 ，但有时候也会碰到一些问题，比如space-between最后一行元素的排列问题问题：假如我们有8个元素<ul> <li>1</li> <li>2</li> <li>...

window.location.href错误代码：window.location.href = `${window.location.host}/detail`;没有打开相应的路由。 有没有看出来是哪里错了。。。原因就是：没有加协议 ！！！。正确代码：// 1.window.location.href = `http://${window.location.host}/detail...

ajax 请求打开新窗口被拦截解决方法一： 先开始打开一个空的新窗口，然后改变新窗口的 urlfunction demo() { //未请求前打开新窗口 var newPage = window.open(); $.ajax({ url: "", type: "post", data: {}, dataType: "jsonp", suc...

双向绑定原理<input type="text" oninput="evtInput()" id="input"/> <p id="text"></p>// 1、定义对象vue,其中有个属性：namelet vue = { name: "123" };function evtInput() { //

单页应用的原理<a href="#home">首页</a> <a href="#help">帮助中心</a> <h1 id="main"></h1>/** * 单页应用原理: * 只有 # 后面的 fragment 发生改变时，页面不会重新请求，其他参数发

理解正则表达式的全局匹配理解全局匹配：http://bubkoo.com/2014/03/19/understanding-the-flag-g-of-JavaScript’s-regular-expressions/正则RegExp.test()需要注意:不具有可重入性：https://blog.csdn.net/aitangyong/article/details/51470854解...

价格的正则表达式/(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/;解析：价格符合两种格式^ [1-9]\d*(.\d{1,2})?$ ： 1-9 开头，后跟是 0-9，可以跟小数点，但小数点后要带上 1-2 位小数，类似 2,2.0,2.1,2.22 等^ 0(.\d{1,2})?$ ： 0 开头，后可以跟小数点，小数点后要待上 1-2 位...

实现 new 操作符// 实现new操作符 实例化一个对象 原型绑定 this绑定// New(A, 1, 2) <=> new A(1, 2)function Persion(name, age) { this.name = name; this.age = age;}Persion.prototype.getInfo = function() { conso...

构造函数中function Animal(name, age) { this.name = name; this.age = age;}绑定 DOM 元素<input type="button" onclick="showInfo(this);" value="button" />获取 DOM 元素的属性或者值<input id="btn" type="b...

双向绑定的方法KnockoutJS 基于观察者模式(发布-订阅)的双向绑定Ember 基于数据模型的双向绑定Angular 基于脏检查的双向绑定基于数据劫持的双向绑定 (重点讲解)Object.definePropertyProxy数据劫持数据劫持的优点不需要显示的调用比如：Vue 利用数据劫持+发布订阅，可以直接通知变化并且驱动视图可以精确得知变化数据我...

/** * 获取指定个数的随机整数 * n:需要的整数个数 * arr: 返回包含n个整数的数组，如果n不合法，则返回空数组 */ function getRand(min, max) { return parseInt(Math.random()*(max-min) + min); } function isRepeat(...

举例let arr = [23, 2, 14, 7, 30, 4];基本排序冒泡排序function bubleSort(arr) { for (let i = arr.length; i &amp;gt;= 2; i--) { for (let j = 0; j &amp;lt;= i - 2; j++) { if (arr[j] &amp;gt; arr[j + 1]) { ...

跨域请求场景：跨域请求报错：Failed to load http://localhost:3000/crossdomain/cors: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘null’ is therefore not allowed access.jso...

栈结构使用 js 实现一个简单的栈结构function Stack() { let datasource = []; // 进栈 this.push = function(el) { datasource.push(el); }; // 出栈 this.pop = function() { return datasource.pop(); }; ...

iframe 嵌套页面通过 postMessage 通信父页面：file:///Users/yuejingge/Documents/a.html&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&

ant design table 表格 + js拖拽排序columnsp配置如下:{ title: '拖动排序', width: 90, render: (d,a) =&gt; { return ( &lt;span id={`drag&amp;${d.id}`} style={{cursor: 'move'}} ...

九宫格拼图import React, { Component } from 'react';import './index.less';class ViewData extends Component { render() { // 重点是这个数组 const data = [ [0,0,0,0,0,0,0,0,0],...

监听键盘ctrl+c ctrl+v area.onkeydown = (event) => { if (event.ctrlKey) { if (event.keyCode == 67) { alert('ctrl+c复制') event.keyCode = 0; }

js检测对象中是否存在某个属性使用in关键字该方法可以判断对象的自有属性和继承来的属性是否存在。var o={x:1};"x" in o; //true，自有属性存在"y" in o; //false"toString" in o; //true，是一个继承属性使用对象的hasOwnProperty()方法该方法只能判断自有属性是否存

/*** randomWord 产生任意长度随机字母数字组合** randomFlag 是否任意长度 min 任意长度最小位[固定位数] max 任意长度最大位** yuejingge 2017/11/8*/function randomWord(randomFlag, min, max) { let str = "", range = min, arr = ['0',

方法/(A)|(B)/.test(str)例子let str = '发布成功，审批通过'/(成功)|(通过)/.test(str) // true

直接上方法function formatSearch(se) { if (typeof se !== "undefined") { se = se.substr(1); var arr = se.split("&amp;"), obj = {}, newarr = []; $.each(arr, function(i, v) { ...

数组的深浅拷贝问题数组的直接赋值数组的直接赋值属于数组的浅拷贝，JS 存储对象都是存内存地址的，所以浅拷贝会导致新数组和旧数组共用同一块内存地址，其中一个数组变化，另一个数组也会相应的变化。数组内部不含有引用类型，使用 slice() 、concat() 和 assign() 方法都属于数组的深拷贝，一个数组变化，另一个数组不受影响。let arr = [1, 2, 3...

本文讲的是： iframe 嵌套不同源页面通过 postMessage 通信直接上代码：自己拿去尝试一下。父页面可以是本地的一个html文件；子页面是用node写的一张html页面。父页面&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt;...

懒加载什么是懒加载懒加载也叫做延迟加载。当访问一个页面的时候，先把 img 元素或者其他元素的背景图片换成一张大小为 1*1 的图片的路径（俗称：占位符），只有当图片出现在浏览器的可视区域内的时候，才设置图片真正的路径，让图片显示出来。为什么要使用懒加载很多页面，内容丰富，页面很长，图片较多。比如各种商城页面，这些页面图片数量多，而且比较大，少说百来 k，多则上兆，要是页面...

高阶函数函数可以作为参数被传递函数可以作为返回值输出高阶函数实现 AOPAOP(面向切面编程) 的主要作用是把一些跟核心业务逻辑无关的功能抽离出来，这些跟业务逻辑无关的功能通常包括：日志统计，安全控制，异常处理等。抽离出来之后，再通过‘动态织入’的方式渗入到业务模块中。这样做的好处首先是可以保持业务逻辑模块的纯净和高内聚性，其次是可以很方便地复用日志统计等功能模块。...

第一种下面这段代码想要循环延时输出结果 0 1 2 3 4,请问输出结果是否正确,如果不正确,请说明为什么,并修改循环内的代码使其输出正确结果for (var i = 0; i &lt; 5; ++i) { setTimeout(function() { console.log(i + " "); }, 100);}输出结果为 5 5 5 5 5答案：不能...

方法/*** 入参* html 需要转义的字符串* 返回* 转义过后的字符串*/function decodeHtml(html) { let txt = document.createElement('textarea'); txt.innerHTML = html; return txt.value;}使用decodeHtml('&amp;lt; he...

举例说明问题：描述场景： 有两个变量arg1 ，arg2，只要其中一个为true，就输出‘yes’let arg1 = true;let arg2 = false;console.log(arg1 === true || arg2 === true &amp;&amp; 'yes')// 结果输出 true 原因是：&amp;&amp;　符号的优先级高于 || 符号很显然：...

深入理解 js 引擎的执行机制首先，请牢记 2 点：js 是单线程语言js 中的 event loop 是 js 的执行机制。深入了解 js 的执行，就等于深入了解 js 里的 event loopjs 为什么是单线程的？js 最初被设计用在浏览器中，那么想象一下，如果浏览器中的 js 是多线程的。场景描述：那么现在有 2 个进程，process1 process2，...