QTFYING的博客

概念节流 (throttle) 让一个函数不要执行的太频繁，减少执行过快的调用，叫节流去抖 (debounce) 去抖就是对于一定时间段的连续的函数调用，只让其执行一次throttle 应用场景DOM 元素的拖拽功能实现（mousemove） 射击游戏的 mousedown/keydown 事件（单位时间只能发射一颗子弹） 计算鼠标移动的距离（mousemove） Canva...

 什么是 for…of 循环for...of 语句创建一个循环来迭代可迭代的对象。在 ES6 中引入的 for...of 循环，以替代 for...in 和 forEach() ，并支持新的迭代协议。for...of 允许你遍历 Arrays（数组）, Strings（字符串）, Maps（映射）, Sets（集合）等可迭代的数据结构等。语法for (variable of ...

ES6中新增了Set数据结构，类似于数组，但是 它的成员都是唯一的 ，其构造函数可以接受一个数组作为参数，如： let array = [1, 1, 1, 1, 2, 3, 4, 4, 5, 3]; let set = new Set(array); console.log(set); // => Set {1, 2, 3, 4, 5}ES6中Array新增了一个静态方法A...

最近写一个popover弹窗时，发现这个滚动条是真的丑啊，决定重新撸一个滚动条：首先咱们回顾一下移动端浏览器滚动条特性：滚动条在开始滚动时渐显，滚动结束后渐隐 滚动条不占内容区宽度，悬浮固定 滚动条高度（深灰）和滚动区可视高度（浅灰）比等于滚动区可视高度和滚动目标的高度 当滚动目标的高度小于滚动区可视高度的时候，滚动条不显示，并且无法滚动 只有在滚动滚动目标时，才能触发滚动 当滚...

这两天一直在忙活着搞自己的服务器，想着怎么把用webpack打包的项目部署到服务器上呢，就打算init一个vue的创建示例，当我跑所有人都知道的npm run build的时候，好开心，幸福来得就是这么突然：第一个问题来了：打包部署的时候，index.html空白高兴的我，赶紧把dist代码改了一下名字initApp，扔到服务器上一跑，结果没有出来，然后就直接点击一下dist的inde...

项目源地址源码地址项目中增加Reactotron：使用方法项目中的问题[白图为源码，彩图为修改后的正确代码]：setStateaxios请求回来的数据回填到setState中，应该只调用一次setState一个页面需要调用2次接口才能渲染出时候，应该用回调改为回调axios，同时setState只设置一次个人还是比较崇拜先定义后导出的写法ex...

Javascript不具备原生的模块化技能，因此需要采用第三方开发的模块依赖处理库来实现模块化：AMD、CommonJS、ES6这三种方案的实现对比：AMD: define + requireCMD: exports + requireES6: export + import由于ES6本身是原生语言支持实现的模块化，但是现代浏览器大多都还未支持，因此必须使用相应的tra...

三端开发调研之TaroTaro 是由凹凸实验室打造的一套遵循 React 语法规范的多端统一开发框架。使用 Taro，我们可以只书写一套代码，再通过 Taro 的编译工具，将源代码分别编译出可以在不同端（微信小程序、H5、App 端等）运行的代码。实现 一次编写，多端运行。和JDreact的关系Taro 是基于 Nerv.js 搞的。Nerv 是在 2017 年初就已经开发了的基于 v...

**本人个人交流群：495807302。**前几天做了一个案例—- 狗狗说（慕课网），由于原视频比较采用 react native 0.22 版本，好多东西都不匹配，查阅一下资料，把其中的坑给大家说一下：1. 首先我们来进新建项目由于国内 npm 被墙，所以我们一般都是通过淘宝镜像来进行项目的安装：$ sudo npm install -g cnpm --registry=https://regis

今天遇到一个问题，在用creat-react-app脚手架搭建React项目的时候，我们能不能在index.js这个页面传值或者写其他的函数呢，我一开始以为是不可以的，但是没想到试试后竟然也是OK的，就拿属性延展来举例子吧：原来页面：import React from 'react';import ReactDOM from 'react-dom';import './index.cs...

今天在看js的深浅拷贝的时候，发现一个很好的帖子，神贴，来自作者：一只努力的程序媛为了节省时间，我就直接先复制过来啦，致敬致敬！！！今天，CVTE面试官问了深拷贝和浅拷贝的问题我的回答是：浅拷贝是拷贝了对象的引用，当原对象发生变化的时候，拷贝对象也跟着变化；深拷贝是另外申请了一块内存，内容和原对象一样，更改原对象，拷贝对象不会发生变化；但是面试官给我说：浅拷贝是拷贝一层，深层次的对象级...

// 获取安卓版本号 function getAndroidVersion() { var u = window.navigator.userAgent; if(u.indexOf('Mobile') > -1){ if (u.indexOf('Android') > -1 || u.indexOf('Linux')...

* babel: ES6转义的核心包* babel-cli: 用于在终端使用babel,用命令行转码* babel-core: 如果某些代码需要调用Babel的API进行转码，就要使用`babel-core`模块* babel-loader: 执行转义的核心包* babel-plugin-react-transform: 代替react-hot-loader的插件* babel-pres...

当我们在处理表格的时候，或者是将数组每4个分为一组，进行渲染的时候，也就是分页的时候，我们经常会将一个数组进行一次分割，我接下来就总结一下各种情况下的做法：例如一个数组是var data = [1, 2, 3, 4, 5, 6, 7, 8, 9,10];        var result = []; var data = [1, 2, 3, 4, 5, 6, 7, 8, 9,10...

今天这个问题找了好久，终于找到为什么了，我们在百度上搜这个问题基本上只有一个答案点击打开链接其实不是说人家回答的不对，只是比较含糊，看截图：其实答案就是这样的，当我们在用react-router的时候，react-router的思想就是让我们写成一个单独的组件Navigation.js，然后import进来，通过this.props.children  传递给各路由

这篇文章主要介绍了移动端WebApp隐藏地址栏的方法,本文分别给出了4种方法,适应不同情况下使用,小编推荐最后一个方法,需要的朋友可以参考下1、很多资料说，添加以下代码,可以隐藏地址栏，但我试了很多次，貌似不成功啊。复制代码 代码如下:2、我们可以通过另一种方法来隐藏地址栏。在页面加载完成之后滚动窗口，这个确实有效，唯一要注意的是页面高度必须够高，核心代

/** * Sample React Native App * https://github.com/facebook/react-native * @flow * 2811132560@qq.com * 说明：项目名为Demo1 */import React, { Component } from ‘react’; //注册一下，你要用什么组件 import {

>  2.html lang="zh-CN">  3.head>  4.    meta charset="UTF-8">  5.    title>手机APP下载页面：根据终端辨别下载地址title>  6.    script type="text/javascript">  7.        // 获取终端的相关信息  8.        var Termina

我们这里所说的devicePixelRatio其实指的是window.devicePixelRatio, 被所有WebKit浏览器以及Opera所支持。概念devicePixelRatio ，它是设备上物理像素和设备独立像素( device-independent pixels (dips) )的比例，即 devicePixelRatio = 屏幕物理像素/设备独立像素 例

$.each JSON.parse() JSON.stringify() jQuery.parseJSON(）

1. 介绍在开发react应用时，应该没有人用传统的方法引入react的源文件(js)，然后在html编辑吧。大家都是用webpack + es6来结合react开发前端应用。这个时候，我们可以手动使用npm来安装各种插件，来从头到尾自己搭建环境。比如：npm install react react-dom --savenpm install babel babel-loa...

JavaScript 是如何判断移动设备的类型呢？答案是：User Agent。什么是 User Agent？懂一点网页制作的人应该都明白。简单的说，User Agent 就是用来识别浏览器名称、版本、引擎以及操作系统等信息的内容。 User Agent 的判断是识别浏览器的关键，不仅仅如此，移动互联网开发势头迅猛，通过 User Agent 判断桌面端设备或移动设备就变的很为重要。当然，通过

1. 当渲染的只有一个目标元素的时候可以直接省去 returnfunction FormList({ color = 'blue', text = 'Confirm'}) { return( <button className = {`btn btn-${color}`}> <em>{text}</em> </button> )}const FormList

7. 渲染一个木偶组件import React from 'react';function NotFound(props) { return ( <div>NotFound</div> )}export default NotFound; 8.ES5 的时候，一个页面可以有多个 React.createClass，同理在 class 类中一个页面中也可以有多个 class 类

[https://github.com/QTFYING/douban](https://github.com/QTFYING/douban)

传送门，直达 GitHub 源码

javascript完美模拟marquee效果随着html中的标签marquee不在被W3C作为标准采纳，在可遇见的未来也会慢慢的被各大浏览器抛弃，直至废弃，为什么被废弃呢，经过小雨我不辞辛苦的总结有以下几种原因：marquee这家伙是微软自己创造出来的，现在火狐都支持了，它自己不干了marquee的效果，必须要前一次滚动完成之后，才会接着下一次，会留白很长一段时间，适合无限向上滚动，无限...