qq_29311189-CSDN博客

原创如何解决 1px 问题？

1px 问题指的是:在一些 Retina 屏幕的机型上，移动端页面的 1px 会变得很粗，呈现出不止 1px 的效果。原因很简单——CSS 中的 1px并不能和移动设备上的 1px 划等号。打开 Chrome 浏览器，启动移动端调试模式，在控制台去输出这个 devicePixelRatio 的值。这就意味着设置的 1px CSS 像素，在这个设备上实际会用 2 个物理像素单元来进行渲染，所以实际看到的一定会比 1px 粗一些。思路一:直接写 0.5px。思路二:伪元素先放大后缩小。

2024-10-25 10:17:32 158

原创 js长轮询和短轮询

客户端向服务器发送请求，服务器如果没有新数据可返回则会等待，直到有新数据可以返回，然后返回响应并关闭连接。客户端接收到响应后立即再次发起新的长轮询请求。在实现长轮询时，服务器端需要支持长时间保持连接的能力，例如使用HTTP流或WebSockets。长轮询和短轮询通常用于服务器端推送数据到客户端，特别是在需要实时或者近实时获取数据的场景。客户端定时向服务器发送请求，服务器接收到请求后立即返回响应，无论是否有新数据。

2024-10-18 09:38:55 148

原创 js 设计模式-策略模式

定义：定义一系列的算法，把它们一个个封装起来，并且使它们可以相互替换。目的：就是将算法的使用和实现分离开来。除了封装算法，还可以封装业务规则以下为js简单的实现：// 选择不同交通方式去计算需要花费的总价var Strategies = { "ship": function(num) { return 500 * num }, "plane": function(num) { return 1000 * num },

2021-08-14 21:47:53 77

原创 js 设计模式-单例模式

定义保证一个类仅有一个实例，并提供一个访问它的全局访问点简单实现单例模式// 不透明性的实现方式var Singleton = function(className) { this.className = className}Singleton.prototype.getClassName = function() { return this.className}Singleton.getInstance = (function(){ var insta

2021-08-14 21:04:14 115

原创 let、const和var命令

一、let 命令变量的声明作用域只是在所命令所在的代码块内有效{ let a = 111 var b = 1}console.log(a) // ReferenceError: a is not definedconsole.log(b) // 1可以看出来，let和var声明变量在块级作用域内，在外部var可以证明访问，而let就会报错。比如在for循环中的各种应用：let在for循环里应用for(let i = 0; i< 6; i ++) {

2021-08-13 21:12:11 132

原创 js 原生实现call、apply、bind

一、实现callFunction.prototype.myCall = function(context, ...args) { if(typeof this !=='function') { throw new TypeError('不是函数') } context = context || window context.fn = this const res = context.fn(...args) delete context.f

2021-08-12 18:16:57 76

原创 js 实现map、foreach、filter、find、findIndex

一、实现map方法，map会返回一个新的数组Array.prototype.myMap = function (callback) { if (typeof callback !== 'function' || Array.isArray(this) || !this.length) { throw new TypeError('报错了'); } let res = [] for (let i=0; i < this.length; i++) {

2021-08-12 18:00:25 244

原创 redux源码二：applyMiddleware

export default function applyMiddleware( ...middlewares: Middleware[]): StoreEnhancer<any> { return (createStore: StoreEnhancerStoreCreator) => <S, A extends AnyAction>( reducer: Reducer<S, A>, preloadedState?: Pr.

2021-08-06 14:24:43 101

原创理解redux源码一

redux提供了createStore,combineReducers,bindActionCreators,applyMiddleware,compose等这几个API.一、下面首先说createStorecreateStore函数传入参数有reducer、preloadedState、enhancer，经常可能只传入reducer、enhancer，流程如下：1）getState执行返回currentState，也就是当前的state2）subscribe 增加一个订阅者，nex

2021-07-27 19:14:56 71

原创 vue之VNode

export interface VNode< HostNode = RendererNode, HostElement = RendererElement, ExtraProps = { [key: string]: any }> { /** * @internal */ __v_isVNode: true /** * @internal */ [ReactiveFlags.SKIP]: true type: VNodeTypes .

2021-05-03 15:23:25 666

原创 react children提供的5个API

react children提供的5个API：forEach、map、count、only、toArray核心实现函数源码：function mapIntoArray( children: ?ReactNodeList, array: Array<React$Node>, escapedPrefix: string, nameSoFar: string, callback: (?React$Node) => ?ReactNodeList,): number

2021-04-18 19:11:20 289

原创 react之ReactBaseClasses

react之ReactBaseClasses定义了Component、PureComponent，PureComponent继承了Component。Component源码：import ReactNoopUpdateQueue from './ReactNoopUpdateQueue';const emptyObject = {};/** * Base class helpers for the updating state of a component. */function Com

2021-04-18 17:25:47 171 1

原创 createContext 创建上下文

react createContext 创建上下文源码：export type ReactContext<T> = { $$typeof: Symbol | number, Consumer: ReactContext<T>, Provider: ReactProviderType<T>, _currentValue: T, _currentValue2: T, _threadCount: number, // DEV only...

2021-04-18 17:07:06 191

转载 CSRF跨站请求伪造

CSRF（Cross-site request forgery，中文为跨站请求伪造）是一种利用网站可信用户的权限去执行未授权的命令的一种恶意攻击。通过伪装可信用户的请求来利用信任该用户的网站，这种攻击方式虽然不是很流行，但是却难以防范，其危害也不比其他安全漏洞小。本文将简要介绍CSRF产生的原因以及利用方式，然后对如何避免这种攻击方式提供一些可供参考的方案，希望广大程序猿们都能够对这种攻击方式...

2019-08-09 14:16:19 161

qq_29311189的博客