系统学习 TypeScript(六)——认识接口

2022-03-05
阅读 2 分钟
1.1k
将一类具体事务抽象成单一的对象方法,使用者不必关心内部的实现逻辑,只需要按照要求传入对应的参数即可得到预期的结果输出,从很大程度上减轻了使用者的心智负担。
封面图

开发提效小技巧分享(二)

2022-03-04
阅读 2 分钟
856
Github 可以说是我辈程序员打交道最广的平台之一了,甚至被称为“全球最大的tongxing交流平台”,但是限于国内的特殊性,想要从 Github 上拉取项目真是一件痛苦的事。
封面图

不联网的情况下,使用 electron-builder 快速打包全平台应用

2022-03-03
阅读 4 分钟
2k
前言Electron 之所以能够日益风靡,是因为其简单易用且对各个操作平台具有良好的支持。今天我就来分享一下怎么使用一套代码,快速打包生成各主流平台安装包的经验。项目安装首先,使用我前面介绍的提效小技巧,设置:NPM 源为淘宝镜像源;Electron 源为中国镜像网站中的 Electron 源地址。然后依次执行以下指令: {代码....
封面图

开发提效小技巧分享(一)

2022-03-02
阅读 2 分钟
1.1k
前言在日常开发中,影响我们开发效率的因素很多,有时候不仅仅会影响开发效率,还会搞崩我们的心态。为了提高工作效率,保持愉悦心情,腾出更多的时间来进行摸鱼大业,前辈们折腾出了很多有用的小技巧,我在这里记录一下自己常用的几个小技巧。NPM 设置淘宝镜像源如果要进行 Node 包管理,那 NPM 就是绕不过的坎,必须把...
封面图

系统学习 TypeScript(五)——联合类型

2022-03-01
阅读 2 分钟
1.4k
在初步学习了 TypeScript 的变量声明后,对它的静态类型检查功能简直是爱不释手,但同时也发现一个问题:在正常的开发中,一个变量的类型有时可能不仅仅只限于 number 或者 string 中的一种,有可能是两种类型或者更多,比如:
封面图

迭代器总结

2022-02-26
阅读 4 分钟
1.2k
数据遍历是我们日常开发中经常用到的逻辑,除了最常见的 for、while、forEach 外,迭代器也提供了数据遍历的接口,了解迭代器有助于我们更好地进行数据处理。
封面图

系统学习 TypeScript(四)——变量声明的初步学习

2022-02-25
阅读 2 分钟
1.5k
前言认识了 TypeScript 中的基础类型,接下来当然是变量声明的相关学习了。声明多维数组假如有这么一个声明: {代码...} 想要知道 arr3 的具体类型,其分析步骤如下:可以看到,类型拆解是从右向左的,对应到具体变量值上就是从外向内一层层拆解的。这里只是举个例子,稍微有点经验的人一眼就能判断出 arr3 是一个三维数...
封面图

系统学习 TypeScript(三)——基础类型

2022-02-24
阅读 3 分钟
1.2k
前言TypeScript 包含的基础类型总结起来有:布尔值数字字符串数组元组枚举任意值空值Null 和 undefinedNeverObject今天,我们就来详细了解一下各个类型所代表的含义及表示方法。布尔值 → boolean它只有两个值——true 和 false。 {代码...} 数字 → numberTypeScript 中的整形和浮点数类型都是 number,这点和 JavaScript ...
封面图

uni-app 模拟机调试环境搭建

2022-02-23
阅读 2 分钟
1.7k
最近接手了一份使用 uni-app 进行开发的工作,今天才有时间正式开始,在这里记录一下使用 HBuilderX 进行 uni-app 开发的调试环境搭建过程。

系统学习 TypeScript(二)——开发流程和语法规则

2022-02-22
阅读 2 分钟
1.3k
原始的 TypeScript 文件以 .ts 结尾,它不能被直接使用到页面中,需要经过编译,转换成 JavaScript (.js)文件才行。

系统学习 TypeScript(一)——认识 TypeScript

2022-02-21
阅读 2 分钟
1.4k
TypeScript 是由微软开发的自由和开源的编程语言。通过在 JavaScript的 基础上添加静态类型定义构建而成。TypeScript 通过 TypeScript 编译器或 Babel 转译为 JavaScript 代码,可运行在任何浏览器,任何操作系统。

DOM 精通了?请问 Node 和 Element 有何区别?

2022-02-20
阅读 4 分钟
1.4k
相信我们很多同学都经常会使用到 Node(节点)和 Element(节点)的概念,那么这两者到底有何区别,不知道有多少人能够答得上来这个问题?
封面图

DOM 节点的克隆和导入

2022-02-19
阅读 4 分钟
1.4k
前言在使用 JS 操作 DOM 节点的时候,我们常常会用到克隆(或导入)节点的操作,那到底有哪些方法可以实现节点克隆(或导入)的效果呢?今天,我们就来总结一下能实现节点克隆(或导入)效果的方法。node.cloneNode()提到克隆节点,我们最先能想到的肯定是 node.cloneNode() 方法。语法其语法如下: {代码...} cloneNode...
封面图

Web Components 系列(十一)—— 实现 MyCard 的可复用

2022-02-18
阅读 7 分钟
1.5k
因为每一个人的各项信息都不尽相同,而对应到 Templates 中,就是所有 className 为 .info-content 的 div 中的内容都是可变的,所有可变值总结一下就是:
封面图

Web Components 系列(十)—— 实现 MyCard 的基本布局

2022-02-17
阅读 5 分钟
1.2k
前言前面针对 Web Components 学习了一些基本的理论知识,我们了解到的概念有:Custom ElementsShadow DOMTemplatesSlots以及和这些概念相关的子知识点。理论知识基本上够用了,从现在开始我们需要将理论运用到实践中,让理论为实践服务。今天,我们就使用 Web Components 的相关知识来实现 MyCard 的制作,原型呢就以我...
封面图

Web_Components 系列(九)—— Shadow Host 的 CSS 选择器

2022-02-16
阅读 5 分钟
2.1k
如果能够在自定义组件内部控制自定义标签的样式,那样的话会相对灵活,而且也算是实现了”封装、相互隔离“的组件原则。今天,我们就来学习一下如何在自定义组件内部实现自定义标签的样式控制。
封面图

Web Components 系列(八)—— 自定义组件的样式设置

2022-02-15
阅读 5 分钟
1.6k
前言通过前面的学习,对自定义组件的相关概念和知识点也有了一定了解,今天我们就来学习一下给自定义元素及其子元素设置样式的几种方法。直接给自定义标签添加样式index.html: {代码...} index.js: {代码...} 结果样式生效:需要注意的是:继承自 HTMLElement 的自定义元素,其 style.display 默认为 inline。由以上结...
封面图

今天踩了一个基础坑

2022-02-14
阅读 2 分钟
719
我今天就踩了一个坑:我的印象中一直以来记得 setInterval 在定义好之后会立即执行一次里面的逻辑,所以在实现下图的逻辑时,我将第二步(”立即执行逻辑 a“)给省去了,这一省却给我带来了了一个bug,汗~

Web Components系列(七) ——自定义组件的生命周期

2022-02-13
阅读 4 分钟
4k
我们在使用前端组件框架的时候,都知道每个组件都有各自的生命周期,明确了组件生命周期后,开发者就可以在组件的不同生命周期执行不同的代码逻辑,从而达到管理组件的作用。

Web Components 系列(五)—— 详解 Slots

2022-02-12
阅读 6 分钟
1.6k
前言熟悉 Vue 的同学应该都知道”插槽(slot)“的概念,通过使用插槽可以让页面内容的组织更加灵活。在 Web Components 体系中也有插槽的概念,今天我们就来具体了解一下 Slots,本文主要包括以下内容:为什么要用 Slots ?Slots 的相关特性Slots 的作用我们首先来看一个模板元素: {代码...} 既然是模板,那就意味着在很...
封面图

Web Components 系列(五)—— 关于 Templates

2022-02-11
阅读 3 分钟
2k
在之前介绍创建 Custom Elements 的代码中,有一个地方是比较繁琐的:Shadow DOM 中的每个子元素都是通过 document.createElement 方法创建的。就像下面这样的:
封面图

Web Components系列(四) —— 认识 Shadow DOM

2022-02-10
阅读 3 分钟
968
前言在初涉前端之时,我就一直在好奇一个问题,为什么像:<input/><select></select><audio></audio><video></video>……等等这些标签,看起来似乎很简单,可为什么可以展现出那么丰富复杂的布局?当时我给自己的解释是:这些标签都是系统控制渲染的。现在想想,那么解释好像有...
封面图

Web Components系列(三) —— 创建 Custom Elements

2022-02-09
阅读 5 分钟
1.4k
前言根据前面的介绍,我们知道根据是否继承基本 HTML 元素,可以将自定义元素分为两类“Autonomous custom elements 自主定制元素Customized built-in elements 自定义内置元素由此产生了一个疑问:这两者在使用上到底有何区别?且让我通过本篇文章试着解释一下这个问题。Autonomous custom elements自主定制元素,是独立...
封面图

Web Components 系列(二)—— 关于 Custom Elements

2022-02-08
阅读 4 分钟
1.6k
前言在上一篇文章中介绍了 Web Components 的相关概念,知道它是浏览器用来原生支持“组件化”的方法,并且知晓它的技术组成为:Custom ElementsShadow DOMHTML templates今天,我们就来学习它的技术之一——Custom Element 的部分相关知识。Custom Elements 的意义Web Components 标准非常重要的一个特性是,它使开发者能够...
封面图

Web Components系列(一) —— 概述

2022-02-07
阅读 2 分钟
1.2k
前言如果我们选择不使用任何框架的情况下来进行前端开发,那么针对一个完整的网页,我们需要开发以下代码:HTML 代码CSS 代码JavaScript 代码就几年之前来说,HTML 部分的代码基本不存在复用的可能,这就导致我们可能需要开发大量重复的 HTML 代码,即使使用 CV 法,代码的冗余却是不可避免的。Web Components 诞生的背...
封面图

JavaScript 数组常见操作 (二)

2022-02-06
阅读 3 分钟
1.3k
前言数组是 JavaScript 中常见数据类型之一,关于它的一些操作方法,我在这里做一下简单记录和总结。今天主要介绍:如何找出数组中的重复/非重复元素数组扁平化方法找出数组中的重复元素或非重复元素双重循环 + slice,找出重复的元素。虽然只要求找出重复元素,但应该注意要顺便去重,否则外循环还是会对重复元素进行一...
封面图

JavaScript 数组常见操作(一)

2022-02-05
阅读 3 分钟
1.4k
前言数组是 JavaScript 中常见数据类型之一,关于它的一些操作方法,我在这里做一下简单记录和总结。本文主要包括:创建数组判断是不是数组类数组和数组的转换数组去重各位看官可根据自身需求选择食用。创建数组创建数组是基本功,其方法主要包括以下几种: {代码...} 其中,我们一般最常用的是数组字面量法。判断是不是...
封面图

HTTP 缓存

2022-02-04
阅读 3 分钟
1.3k
我们使用 HTTP 缓存,通过复用缓存资源,减少了客户端等待时间和网络流量,同时也能缓解服务器端的压力。可以显著的提升我们网站和应用的性能。
封面图

精度丢失问题

2022-02-03
阅读 3 分钟
1.3k
存储二进制时小数点的偏移量最大为52位,计算机存储的为二进制,而能存储的二进制为62位,超出就会有舍入操作,因此 JS 中能精准表示的最大整数是 Math.pow(2, 53),十进制即9007199254740992大于 9007199254740992 的可能会丢失精度参考:[链接]
封面图

再解 JavaScript 原型与原型链

2022-02-02
阅读 2 分钟
1.8k
前言JavaScript 原型与原型链虽然是一个老生常谈的话题,但依然困惑着很多人,今天我再来从另一个角度谈谈这个问题。两个疑问先看这样一段代码: {代码...} 运行一下上面的代码,输出结果为 gogo。针对这个结果,有以下疑问:obj 哪来的 __proto__属性?为什么添加到 __proto__上的属性,可以直接通过 obj 拿到?第一个...
封面图