理想国 第一卷
...
TS 基础中的基础
对于前端小伙伴来说,TypeScript 肯定都不陌生,但本人之前一直对 TS 了解的不多,这次决定全面学习一下 TS 并总结成博客文章 废话不多说,咱直接就开始吧 👊 TypeScript 概览 TypeScript 是什么? 简单理解就是 TypeScript 是增加了类型约束的 JavaScript,并且可以被编译成原生 JavaScript。 为什么需要 TypeScript? a. 与弱类型的 JS 结合,在编译期间增强类型检查,提前发现可能的缺陷 b. 通过强类型约束可以放心地进行多人协作开发,保证项目的可维护性 c. 与代码编辑器集成,提供自动补全、引用跳转等实用功能,提升开发效率 基本用法下面来看看 TypeScript 的基本用法 基本类型简单类型介绍对于简单类型呢,就是 string、number、boolean、symbol、undefined 和 null,比较基础: 12345const str: string = 'hello';const num: number = 1;const isAfternoon:...
canvas VS WebGL
在介绍WebGL和Canvas的区别和联系之前,需要先s了解它们各自的定义和特点。 WebGL是一种基于标准HTML5的技术,用于在Web浏览器中实时渲染3D图形。它是由Khronos Group开发的一套API(Application Programming Interface),允许开发者使用JavaScript等脚本语言来操作计算机的显卡,并利用其强大的图形处理能力进行高性能的3D渲染。 Canvas是一个HTML5元素,提供了一个可以通过JavaScript脚本来绘制图像、图形、动画等的空白区域。它可以看作是一个画布,开发者可以借助Canvas...
素书
...
来处一个老程序员的忠告
吉日噶拉(在外企、上市公司工作过,自己也创业失败过,遇到过很多失败挫折,甚至露宿街头,但是最后还是挺过来了),是一个十几年的程序员了,里面介绍了他的相关经历,以及他的一下经验,无论是对刚入门的程序员,还是工作了十年八年的程序员都有一些经验值得借鉴学习。这里我也把这本书中的部分精华分享给大家,希望对大家有帮助! 程序员你伤不起...
ts objecy[key] 报错
原文: https://fettblog.eu/typescript-better-object-keys/ 译文: 注意:要非常小心使用这个技术。最好查看我的新方法。 TypeScript在lib.d.ts中的预定义类型通常是非常良好类型化的,并提供了大量关于如何使用内置功能以及提供额外类型安全性的信息。直到它们不是。考虑以下带有对象类型Person的示例: 123456789type Person = { name: string, age: number, id: number,}declare const me: Person;Object.keys(me).forEach(key => { // 💥 下一行在我们这里抛出了红色波浪线 console.log(me[key])}) 我们有一个类型为Person的对象,我们想使用Object.keys获取所有键作为字符串,然后使用这些键在映射或forEach循环中访问每个属性,以在严格模式下对其进行某些操作,但是我们得到了红色波浪线。这是错误消息: “Element...
ts 问题
原文链接:How not to learn TypeScript 全文 7747 字,大约 15 分钟。 译者注:这篇文章对于初学 TypeScript 的同学应该是有帮助的,但是要注意,本文更多关注于初学,其中的建议在实际工作中不一定有用,甚至是不对的。但是,在初学 TypeScript 时,这些内容,还是有一定帮助的。同时我也相信,只要读者坚持搞下去,不用多长时间,应该也能明白这些问题。 “我和 TypeScript 永远不是好朋友!“哎,我经常能听到这样的抱怨。学习 TypeScript,即便是在 2022 年,看起来也不是件容易的事儿。因为很多原因,尤其是有 Java 和 C# 经验的人会发现,在 TypeScript 中,和他们的预期是不一样的。经常写 JavaScript 的人又会被 TypeScript 的编译器搞的崩溃。这里是,我发现的一些新手开始学 TypeScript ,经常会犯的问题。我希望他们能帮助到你。 这篇文章深受 Deny 的如果学习错误的 Rust的影响,我也推荐你们看看这篇文章。 错误1: 忽视 JavaScript从一开始,...
js 数据结构
一、前言首先,为什么我会学习数据结构与算法呢,其实主要是有两方面 第一,是我在今年的flag里明确说到我会学这个东西 第二,学了这些,对自己以后在工作或者面试也会带来许多好处 然后,本文是最近学习的一个总结文章,文中的算法题,大部分都是leetcode中的,如不太理解题意,可直接去leetcode中找到对应的题。 二、基本概念常常听到算法的时候,就会有人说到 时间复杂度, 空间复杂度。那么这俩玩意是啥呢,下面我们就来一一解释 1. 时间复杂度其实就是一个函数,用大 O 表示, 比如 O(1)、 O(n)… 它的作用就是用来定义描述算法的运行时间 O(1) 12let i = 0i += 1 O(n): 如果是 O(1) + O(n) 则还是 O(n) 123for (let i = 0; i < n; i += 1) { console.log(i)} O(n^2): O(n) * O(n), 也就是双层循环,自此类推:O(n^3)… 12345for (let i = 0; i < n; i += 1) { ...
前端工程化解决方案
引言在大前端的趋势下,传统的前端开发模式已经不能很好地承载实际的项目需求。因此,我们需要一系列解决方案来使项目变得规范、可配置、易于优化等。 本文将针对这个问题进行简单分析,讲解前端工程化的概念、落地实践,并给出一系列解决方案。 本篇文章是本人在 2020年时推进公司内部前端工程化所写,在原文的基础上对详细细节、业务场景以及缘由进行了缩减,对于不了解前端工程化的前端开发可进行阅读,从而达到了解工程化的目的,更加详细的内容需要自行查阅资料并学习。 一、什么是前端工程化前端工程化是将软件工程相关的方法和思想应用到前端开发中,从而提升前端开发效率、提高产品质量、降低开发难度、减少公司成本的方法和工具。 前端工程化贯穿整个前端项目各个阶段,包括代码规范、流程规范、分支管理、程序开发、前后端联调、自动化测试、应用构建、系统部署和监控、运维等。 二、为什么要使用前端工程化随着近些年来前端技术的不断发展,越来越多复杂的业务放在了前端,前端不再是简单的 HTML + CSS + JavaScript...
vue 常见的坑
Vue 3已经稳定了相当长一段时间了。许多代码库都在生产环境中使用它,其他人最终都将不得不迁移到Vue 3。我现在有机会使用它并记录了我的错误,下面这些错误你可能想要避免。 使用Reactive声明原始值数据声明在过去都是非常直接的,但是现在有很多帮助函数供我们使用。目前的规则是: 使用reactive声明Object, Array, Map, Set 使用ref声明String, Number, Boolean 为一个原始值使用reactive会返回一个警告,并且该值不会成为可响应式数据。 123456/* DOES NOT WORK AS EXPECTED */<script setup>import { reactive } from "vue";const count = reactive(0);</script> [Vue warn]: value cannot be made...