苏雪冷音-CSDN博客

原创监听元素在视图内的可见性

原文链接：https://www.suxuewb.cn/?p=182有个需求，让视频消失在视图中时停止播放，遂研究起了元素在视图内的可见性。技术准备全新的apiwindow.IntersectionObserverEntry可以用于观察元素在视图屏幕区域的可见性，详见MDN。每当元素与屏幕产生区域交叉时，该函数被触发，并返回交叉区域参数。滚动监听技术如果不支持上述的api，就要考虑滚动事件监听实现，每次滚动时就计算元素边缘与视图屏幕的相对关系，以此来判断元素在屏幕上的可视范围。技术实现.

2021-09-10 09:51:11 789

原创 “(a===1 && a===2 && a===3)“ (严格模式) 是否一定为真 (in JavaScript)

原文链接： https://www.suxuewb.cn/?p=196让我们看看如何在对象的get和set的帮助下让a===1 && a===2 && a===3为真。a==1 && a==2 && a==3宽松相等a==1 && a==2 && a==3a==1 && a==2 && a==3可以为真吗？当然可以，你可以这么做：const a = { value .

2021-09-10 09:49:29 144

原创浏览器 Scroll 平滑滚动

原文链接： https://www.suxuewb.cn/?p=278除了用户主动触发的滚动，我们经常需要代码触发滚动。然而浏览器提供的scroll API，并不是完全精确，存在比较多的兼容性。今天我们就来探讨一下，scroll 滚动API 及其兼容性。几个重要的对象和类windowwindow 对象表示浏览器对象模型，即浏览器提供的扩展API能力。大写的Window是构造函数，小写的window是它实例化后的对象。scrollX、scrollY、pageXOffset 和 pageYOffs.

2021-09-10 09:47:30 1822

原创基于webRTC推流的直播方案

直播成熟的直播业务，诸如抖音、快手、斗鱼，多采用自研推流端或者OBS，由于公司人才匮乏和与业务融合的需求，所以使用web端推流的方式。webRTCWebRTC，名称源自网页即时通信（英语：Web Real-Time Communication）的缩写，是一个支持网页浏览器进行实时语音对话或视频对话的API。它于2011年6月1日开源并在Google、Mozilla、Opera支持下被纳入万维网联盟的W3C推荐标准。在我看来，低延迟是webRTC最大的优点，相对来说，图像质量不会太高。当然对于现在的我

2021-09-10 09:32:40 3080

原创 TypeScript中的泛型

原文链接： https://www.suxuewb.cn/?p=276泛型的概念一般的计算机设计语言都有泛型的概念。泛型允许程序员在强类型程序设计语言中编写代码时使用一些以后才指定的类型，在实例化时作为参数指明这些类型。这个“以后”，可以是编译期间，也可以是运行时。一个例子有以下功能函数：function log(data){ console.log(data) return data}log 函数接收数据，打印并返回该数据。当我们使用TS时，需要指定data参数的类型，函数.

2021-09-10 09:30:42 267

翻译 REACTv16.6.0：lazy, memo and contextType

2018年10月23日今天我们发布了React16.6版本，并带来了一些新的实用的特性。更新摘要：为纯函数式组件提供了一种类似React.PureComponent/shouldComponentUpdate的更新模式；提供了一种用Suspense悬停实现代码分离的方式；类组件消费Context将更加简单；React.memo()通过React.PureComponent/s...

2018-11-27 14:52:30 161

原创 vue组件中的.sync修饰符实现父子组件双向通信

我们知道，在vue的组件通信props中，一般情况下，数据都是单向的，即父组件数据的更改会下传到子组件（用了.once除外），子组件对数据无法做出更改（当传递的数据是引用数据类型时，可以更改父组件数据，比如，数组的破坏性方法，push等）。在vue1.x时，提供.sync作为双向传递的关键字，但是2.0删除了该修饰符，但是！！2.3+又恢复了使用，采用的事件机制。下面我就简述一下怎么使用。使用...

2018-10-15 11:28:34 307

原创 HTML元素获取中的静态和动态

原生的js获取元素节点通常返回的都是单个element对象或者一个元素集合，之所以叫集合，是因为，它不是数组，但是和数组有类似的性质。这种元素集合，有两种形式，一种是只包含元素的HTMLcollection元素收集器，另一种是包含文本节点的Nodelist节点列表。HTMLcollection是动态的，即一但文档结构发生了改变，HTMLcollection就会立即更新，使用的时候千万要注意...

2018-10-15 11:15:43 1357

原创 JS原始值转换算法---toPrimitive()

在js中，想要将对象转换成原始值，必然会调用toPrimitive()内部函数，那么它是如何工作的呢？该函数形式如下：toPrimitive(input,preferedType?) input是输入的值，preferedType是期望转换的类型，他可以是字符串，也可以是数字。如果转换的类型是number，会执行以下步骤： 1. 如果in...

2018-09-18 16:47:51 9097 2

原创浅谈js数据动态绑定

最近看到一个解释动态绑定的方案。HTML代码<input type="text" id="aa" />* <input type="text" id="cc" /> <span id="bb">{{hello}}</span>界面如下 js代码

2018-06-12 16:02:48 3023

suxuelengyin的博客