【Javascript修炼篇】你一天会犯几次低级错误

最近,尝试出一个javascript修炼篇,让编程技术更上一层楼。如果你对Javascript有兴趣,或者想要提供自己的编程技术,那么这个系列就很适合你。欢迎关注,持续更新中…

新手:作为人类,犯错实在太常见了,每天可能会有超过50个错误。

进阶者:同样是人类,但我们能够减少错误,每天的错误量控制在50个以内。

高手:我们依然是人类,但几乎能用 JavaScript 来“说话”,每日错误少于5个。

挺有意思的,对吧?从上面的描述就能看出,错误无处不在。那么,高手一般是怎么做的呢?

他们能预判结果,并据此调整,而新手往往是在编码过程中不断尝试和纠错。

如果你对病症了如指掌,自然能对症下药,不必把整个药店都吞下去。

虽然网上可能有现成的谚语,但这句突然浮现在我脑海里,希望你能理解其意。

我不喜欢拐弯抹角,咱们直入主题:

我想分享一些超棒的技巧,帮助大家减少错误,提高编码效率。

技巧1:扎实基础

每次编程时,我们都会把功能分解成尽可能小的部分,然后逐一编码。

编码过程中,我们总免不了要处理那些想展示在浏览器上的数据。

示例:
假设你需要在应用里显示员工名单,并在用户添加新员工时立即更新列表。

// 初始名单
let employeeList = ['james', 'peter', 'roy', 'garreth'];// 你知道可以用 push 向现有数组添加新员工
employeeList = employeeList.push('new james');// 但你不确定这样做会怎样
console.log(employeeList);
// 输出 5,因为 push 返回的是数组的新长度,而非更新后的数组

因此,熟练掌握基础对于避免错误至关重要,也能帮你跳出试错循环。

这可以说是编程过程中犯错的主要原因。

技巧2:先学后用

没错,你不会一直用到基础的 JS 方法,因为有时需要依赖特定库(比如针对实时 Web 应用场景编写的封装)。

举例: moment.js 是一个处理日期时间非常出色的 JavaScript 库。

直接引入它,就能做时间转换等操作。

这些库提供了不同方法来应对不同需求,别总去 StackOverflow 上复制粘贴代码。

每个库都有清晰的文档介绍各自特性,多读读文档,试试它们提供的例子,了解优缺点后再动手用。

这不仅能防错,还能避免将来出现 bug。

技巧3:理解执行流程

脚本通常从上到下执行,不过有些情况下流程会有所变动。

异步 JS:
JavaScript 支持异步操作,比如 Promises、setTimeout 和 setInterval,使用它们会改变执行流。

示例:

console.log('第一条消息');setTimeout(() => {console.log('异步消息');
}, 0);console.log('最后一条消息');// 输出:
// 第一条消息
// 最后一条消息
// 异步消息

运算符优先级: 它决定了运算符之间的解析顺序。

console.log(5 + 10 * 3 - 2); // 33
console.log(5 + 10 * (3 - 2)); // 15
console.log((5 + 10) * 3 - 2); // 43

第一种情况,乘法优先级更高,

5 + 10 * 3 - 2 变为 5 + 30 - 2 再变为 35 - 2 得到 33

第二种情况,括号优先级最高,

5 + 10 * (3 - 2) 变为 5 + 10 * 1 再变为 5 + 10 结果为 15

第三种情况就很明显了。

所以,执行顺序会影响结果。

虽然优先级规则很多,但不用死记硬背,收藏这个页面就行:MDN运算符优先级文档

记住,调试不是用来应对错误的。

我会在另一篇文章中详述如何高效利用调试,包括何时、何处以及如何使用。

总结一下收获:

  • 错误少了,编码效率自然提升。
  • 避免错误,就是学习的过程,知识就是力量。
  • 当你开始“说”JavaScript,就离顶尖程序员不远了。🤩

以上建议均来自我的经验。欢迎留言分享你最常使用的技巧,或者你自己的心得。

感谢阅读!😊

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/17535.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

echarts地图下钻+地图遮盖物散点

一、下载工具 npm i echarts echarts-gl axios -S -S是生产依赖默认是-S不写也可以 -D是开发依赖 二、引入工具 import * as echarts from "echarts"; import "echarts-gl"; import axios from "axios"; 三、HTML部分代码 <div class&…

【代码随想录】【算法训练营】【第21天】 [530]二叉搜索树的最小绝对差 [501]二叉搜索树的众数 [236]二叉树的最近公共祖先

前言 思路及算法思维&#xff0c;指路 代码随想录。 题目来自 LeetCode。 day 21&#xff0c;天气不错的周二~ 题目详情 [530] 二叉搜索树的最小绝对差 题目描述 530 二叉搜索树的最小绝对差 解题思路 前提&#xff1a;二叉搜索树 思路&#xff1a;根据二叉搜索树的中…

长安链使用Golang编写智能合约教程(二)

本篇说的是长安链2.3.的版本的智能合约&#xff0c;虽然不知道两者有什么区别&#xff0c;但是编译器区分。 教程三会写一些&#xff0c;其他比较常用SDK方法的解释和使用方法 编写前的注意事项&#xff1a; 1、运行一条带有Doker_GoVM的链 2、建议直接用官方的在线IDE去写合…

公钥,私钥,数字签名,证书

公钥和私钥是一对&#xff0c;公钥是公开的&#xff0c;比如服务器持有公钥&#xff0c;对数据进行加密&#xff0c;接收端只有有对应的私钥才能对数据进行解密&#xff0c;私钥是不公开私自的。 数字签名跟上面是反过来的过程&#xff0c;客户端发送给服务器之前&#xff0c;…

奥枫软件Java要个16K遇到地狱级难度,醉了。。。

我只能说地狱难度&#xff0c;没绝对把握就别去了。我凭借前辈的经验&#xff0c;和当时天时地利人和&#xff0c;六道题答得很不错&#xff0c;但还是没通过。我有备而来都没过&#xff0c;现场写那些应该都是白忙活了。 一面 1&#xff0c;分割一个整数。如123&#xff0c;结…

Blender 学习笔记(一)快捷键记录

Blender 的快捷键映射非常强大&#xff0c;如果学会将会快速提高工作效率&#xff0c;本文抄自 Blender 4.1 Manual&#xff0c;基于 Blender 4.1&#xff0c;因为自己使用 Windows&#xff0c;所以只记录 Windows 相关快捷键。 全局快捷键 键位作用ctrl0打开文件ctrls保存文…

前端RN是什么:深入解析React Native的前端革命

前端RN是什么&#xff1a;深入解析React Native的前端革命 在前端技术的飞速发展中&#xff0c;一个新的名词逐渐崭露头角——前端RN。对于许多初学者和开发者来说&#xff0c;这个术语可能充满了神秘与困惑。那么&#xff0c;前端RN究竟是什么呢&#xff1f;本文将从四个方面…

Llama3大模型原理代码精讲与部署微调评估实战

课程链接&#xff1a;Llama3大模型原理代码精讲与部署微调评估实战_在线视频教程-CSDN程序员研修院 本课程首先讲述了有关Transformer和大语言模型(LLM)的关键前置知识, 包括注意力机制、多头注意力、编码器-解码器结构等Transformer原理, 以及LLM的文本生成和LLM微调技术原理…

抖音本地生活服务商入驻指南分享!

当前&#xff0c;各大平台的团购外卖业务持续火爆&#xff0c;并逐渐成为众多创业赛道中的大热门。其中&#xff0c;本地生活服务更是在短时间内杀出重围&#xff0c;成为创业者们的首选。 根据抖音生活服务近日发布的《2023年度数据报告》&#xff0c;2023年&#xff0c;抖音生…

2024年湖北水平能力测试能搞定吗?

武汉中级职称报名正式高一段落&#xff0c;意味着今年武汉市中级职称报名除开东湖高新区之外&#xff0c;其余地方都已经正式截止了&#xff0c;那么接下来大家都在准备6月中下旬的水平能力测试考试。 水平能力测试分为两种&#xff1a;面试答辩或者笔试机考试卷&#xff0c;面…

vue脚手架与创建vue项目

一、前言 vue脚手架的安装与创建vue项目需要先行安装配置node与npm&#xff0c;详情可以看node、npm的下载、安装、配置_node 下载安装-CSDN博客 二、vue脚手架的使用 1、vue与vue脚手架的版本 Vue脚手架&#xff08;Vue CLI&#xff09;是Vue.js官方提供的一个命令行工具&…

超级好用的C++实用库之套接字

&#x1f4a1; 需要该C实用库源码的大佬们&#xff0c;可搜索微信公众号“希望睿智”。添加关注后&#xff0c;输入消息“超级好用的C实用库”&#xff0c;即可获得源码的下载链接。 概述 C中的Socket编程是实现网络通信的基础&#xff0c;允许程序通过网络与其他程序交换数据。…

【基础篇-Day8:JAVA字符串的学习】

目录 1、常用API2、String类2.1 String类的特点2.2 String类的常见构造方法2.3 String类的常见面试题&#xff1a;2.3.1 面试题一&#xff1a;2.3.2 面试题二&#xff1a;2.3.3 面试题三&#xff1a;2.3.4 面试题四&#xff1a; 2.4 String类字符串用于比较的方法2.5 String类字…

埃隆·马斯克的 xAI 募集 60 亿美元,瞄准 AI 超级计算机|TodayAI

埃隆马斯克&#xff08;Elon Musk&#xff09;创立的人工智能公司 xAI 宣布成功募集了 60 亿美元的资金&#xff0c;用于推动其“首批产品推向市场&#xff0c;建立先进的基础设施&#xff0c;并加速未来技术的研发”。马斯克透露&#xff0c;xAI 目前的估值已达到 180 亿美元&…

css 中box-shadow使用总结

还记得我之前还是 ie 时代的时候我们如果遇到有投影&#xff0c;阴影的设计稿&#xff0c;一般的做法就是使用图片作为背景实现&#xff0c;如果要是做自适应宽高还需要利用好几个元素拼接起来设置图片背景实现&#xff0c;而现在我们想要实现投影只需要一个 css 属性 box-shad…

如何简化不同网间文件摆渡的操作流程,降低IT人员工作量?

为了保护内部核心数据不被泄露&#xff0c;同时有效屏蔽外部网络攻击的风险&#xff0c;企业大多会选择实施网络隔离。将“自己人”与“外人”隔离&#xff0c;具有较强的安全敏感性。有些企业还会在内部网络中进一步划分&#xff0c;比如划分为研发网、办公网、生产网等&#…

PaliGemma – 谷歌的最新开源视觉语言模型(一)

引言 PaliGemma 是谷歌推出的一款全新视觉语言模型。该模型能够处理图像和文本输入并生成文本输出。谷歌团队发布了三种类型的模型&#xff1a;预训练&#xff08;PT&#xff09;模型、混合&#xff08;Mix&#xff09;模型和微调&#xff08;FT&#xff09;模型&#xff0c;每…

Vue3实战笔记(48)— reactive大揭秘:Vue 3中复杂数据结构的响应式处理

文章目录 前言reactive 的基本用法1、创建响应式对象&#xff1a;2、在模板中使用响应式对象&#xff1a;3、响应式对象的嵌套&#xff1a; 总结 前言 前些天了解了ref&#xff0c;开发时候大部分时候都是直接用ref&#xff0c;其实还有reactive这玩意&#xff0c;有时候用起来…

C语言实现正弦信号扫频

C语言实现正弦信号扫频 包含必要的头文件:首先,你需要包含 <stdio.h> 和 <math.h> 头文件,分别用于输入输出和数学函数的使用。 定义扫频参数:定义正弦扫频的参数,例如起始频率、结束频率、扫频时间等。 生成正弦波信号:使用正弦函数生成扫频信号,可以根…

【Django】从零开始学Django【2】

五. CBV视图 Django植入了视图类这一功能&#xff0c;该功能封装了视图开发常用的代码&#xff0c;无须编写大量代码即可快速完成数据视图的开发&#xff0c;这种以类的形式实现响应与请求处理称为CBV(Class Base Views)。 1. 数据显示视图 数据显示视图是将后台的数据展示…