【JS经验分享】你真的会写JS吗?满满干货,建议读三遍(1)

news2024/11/15 0:00:28

大家好,最近准备总结一下JS的经验,分享分享,有不对的欢迎讨论哈~

JS作为前端的基础技能,每一位前端开发都要运用熟练,但你真的会写JS吗?js全称JavaScript,是运行在浏览器上的脚本语言,连续多年被评为全球最受欢迎的编程语言。

不是说你对js的函数有多熟,更不是问你英文打次拼写的问题。而是,天天写JS,你有想过怎么让JS写的更优吗?除了codeclean,还有些小技巧和经验可以总结来看看。站在别人的肩膀上,你可以看的更远!~

目录

1.includes判断多条件

2. if-else 条件换成三目运算简写

3.Null, Undefined,空检查等假值判断

 4.将值分配给多个变量

 5.赋值运算符简写

6.如果仅在变量为 true 的情况下才调用函数,则可以使用 && 运算符

7.return全集返回值

8.使用箭头函数

9.短函数调用

10.Switch简写


【以下例子中图片是not good,代码里是good的,方便区分】

1.includes判断多条件

 当if的条件很多,不如用数组的includes来判断

if (['a', 'b', 'c', 'd'].includes(x)) {
  //logic
}

2. if-else 条件换成三目运算简写

如图,可以写成:

let test = (x > 50) ? true : false;

// 更短的方式:
let test = x > 50;

 又比如嵌套了多条件时:

 可以简写成:

let x = 300,
test2 = (x > 100) ? 'greater 100' : (x < 50) ? 'less 50' : 'between 50 and 100';
console.log(test2); // "greater 100"

3.Null, Undefined,空检查等假值判断

我们可以用更简短的方式来排除假值

let test2 = test1 || '';

或者这种场景下:

if (test1) {
    //logic
}

 4.将值分配给多个变量

一行就可以解决:

let [test1, test2, test3] = [1, 2, 3];

 甚至遇到对象,也可能用这样方法:

let {num1:test1, num2:test2, num3:test3} = {num1: 1, num2: 2, num3: 3};

 5.赋值运算符简写

 

test1++;
test2--;
test3 *= 20;

6.如果仅在变量为 true 的情况下才调用函数,则可以使用 && 运算符

 

test && oneMethod();

7.return全集返回值

function checkReturn() {
    return test || callMe('test');
}

8.使用箭头函数

单行返回省略return

 

const add = (a, b) => a + b;

单个参数省略括号

 

callName = name => console.log('Hello', name);

9.短函数调用

用三元运算符来实现 

(test3 === 1? test1:test2)();

10.Switch简写

 

多条件触发用对象存储,再调用:

var data = {
  1: test1,
  2: test2,
  3: test
};
data[something] && data[something]();

其他奇技淫巧,当有一个参数时,需要返回结果时,字典的键值对取代switch语句

let data = ({
    1: test1(),
    2: () => { return 0 },
    3: test2(),
    4: () => { return 1 }
})[ num || 0 ]()

细节很多,干货满满,建议读三遍。每次分享10个小技巧,欢迎关注我持续更新这个专题哦~~

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

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

相关文章

SAP MM 物料主数据配置

物料主数据的管理不仅仅需要引起MM顾问的重视&#xff0c;同样也需要SAP的客户足够重视。 在SAP的实施过程中。客户通常需要将一个或多个历史系统的数据根据规则转换成SAP的主数据 一个实施项目的成功与否的基本就是&#xff0c;数据是否被正确的导入 1.配置一个新的物料类型…

三个美观的个人博客网站源码

怎么让源码更适合你&#xff1f;改造&#xff01; 名称&#xff1a; 二开版UI漂亮的PHP博客论坛网站源码 介绍&#xff1a;可切换皮肤界面 下载&#xff1a;https://wwwf.lanzout.com/ihLNM10bfgnc 二、名称&#xff1a;Emlog Pro博客管理系统源码绿色版下载 介绍&#xff1…

【模拟CMOS集成电路设计】带隙基准(Bandgap)设计与仿真

【模拟CMOS集成电路设计】带隙基准&#xff08;Bandgap&#xff09;设计与仿真 前言一、 设计指标二、 电路分析三、 仿真测试3.1测试电路图3.2测试结果(1)基准温度系数仿真(2)瞬态启动仿真(3)静态电流仿真(4)线性调整率仿真(5)电源抑制PSR仿真 四、测试结果五、总结附录MOS器件…

地埋式积水监测系统在城市道路中的应用

伴随着汛期的到来&#xff0c;多地遭到大雨及暴雨的袭击&#xff0c;导致城市内涝现象频繁发生&#xff0c;使整个城市陷入瘫痪状态&#xff1b;交通道路受阻&#xff0c;严重影响了市民的生活&#xff0c;国家有关部门也因此出台了不少相关防涝政策。 积水监测系统可以加强城…

《WebGIS快速开发教程第二版》完成修订了

端午节过后各位小伙伴可能也要慢慢回归工作了&#xff0c;尽管不想工作不想烧脑但是没有办法&#xff0c;该干的活一样也少不了是吧&#x1f92a;。 趁着空闲时间我完成了《WebGIS快速开发教程》这本书 的修改工作。相对于第一版&#xff0c;第二版进行了如下改动&#xff1a;…

加密与解密 调试篇 静态分析技术 (三)枚举/IDC/插件

目录 1.枚举类型 2.FLIRT 1.应用FLIRT签名 3.IDC脚本 IDC分析加密代码 4.插件 5.IDA调试器 1.加载目标文件 2.调试器界面 ​编辑 3.调试跟踪 4.断点 5.跟踪 1.枚举类型 这是一段c语言源代码 #include <stdio.h> int main(void) {enum weekday { MONDAY, TUE…

Redis入门(6)-ZSet

Redis中的Zset是有序的、可重复的&#xff08;元素不能重但score可重&#xff09;&#xff0c;其中每个元素都有一个分值score&#xff0c;Redis会根据其score对其进行从小到大的排序。 1.zadd key score member [score member] 添加元素 zadd subject 3 JAVA 2 C 1 mysql…

操作系统——磁盘调度算法的模拟与实现

一、实验题目 磁盘调度算法的模拟与实现 二、实验目的 (1) 了解磁盘结构以及磁盘上数据的组织方式。 (2) 掌握磁盘访问时间的计算方式。 (3) 掌握常用磁盘调度算法及其相关特性。 三、总体设计&#xff08;含背景知识或基本原理与算法、或模块介绍、设计步骤等&#xf…

计算机网络--网络编程(1)

简单认识一下传输层中的UDP和TCP&#xff1a; TCP&#xff1a;有链接&#xff0c;可靠传输&#xff0c;面向字节流&#xff0c;全双工 UDP&#xff1a;无连接&#xff0c;不可靠传输&#xff0c;面向数据报&#xff0c;全双工 有链接类似于打电话&#xff0c;通了就是有链接。…

软件测试项目中如何做好单元测试

前言 如《Unit Testing》书里提到&#xff0c;学习单元测试不应该仅仅停留在技术层面&#xff0c;比如你喜欢的测试框架&#xff0c;mocking 库等等&#xff0c;单元测试远远不止「写测试」这件事&#xff0c;你需要一直努力在单元测试中投入的时间回报最大化&#xff0c;尽量…

kotlin Flow系列之-SharedFlow

文章目录 前言SharedFlow之创建SharedFlow之缓存系统buffer&Slots SharedFlow源码发送数据接收数据SharedFlow存在的bug 前言 Kotlin中Flow被分为冷流 热流 两大类。比如经常被使用的flow{}函数就可以创建一个冷流。而本文的主角SharedFlow就是一个热流。冷流需要调用Flow…

Makefile基本原理详解及使用

1、什么是 Makefile 一个企业级项目&#xff0c;通常会有很多源文件&#xff0c;有时也会按功能、类型、模块分门别类的放在不同的目录中&#xff0c;有时候也会在一个目录里存放了多个程序的源代码。 这时&#xff0c;如何对这些代码的编译就成了个问题。Makefile 就是为这个问…

电路图中常见符号总结

前辈说不会FPGA电路原理图&#xff0c;就不能知道如何去控制、如何去实现 因此本篇记录看的原理图中见到的符号&#xff0c;虽然都很基础&#xff0c;但我都不会&#xff0c;难受&#xff0c;因此只能看一点记一点 >_< >_< >_< >_< >_&…

如何学习和提升软件测试与调试的能力?

要学习和提升软件测试和调试能力&#xff0c;可以考虑以下方法&#xff1a; 学习软件测试基础知识&#xff1a; 了解软件测试的基本概念、原则和方法。可以通过阅读相关书籍、参加在线课程或培训来学习软件测试的基础知识。 掌握测试技术和工具&#xff1a; 了解各种测试技术…

南卡OE Pro新品上线即刻售罄:秒空背后的热潮是什么?

近日&#xff0c;南卡OE Pro品牌的最新产品上线&#xff0c;却在瞬间被抢购一空&#xff0c;引起了广大耳机爱好者的热烈关注和激烈讨论。这一现象再次展示了南卡OE Pro在耳机市场的强劲号召力和深受用户喜爱的地位。让我们一起揭开这场秒空背后的热潮&#xff0c;探究引发如此…

全网首个Ozon选品数据分析软件重磅上线!

【萌啦OZON数据】分析工具重磅上线&#xff01;在线解析俄罗斯市场、开启热销选品新玩法&#xff01;1对1免费指导&#xff0c;详细演示软件选品&#xff0c;快速上手&#xff01; 欧洲第四大电商市场OZON 近日&#xff0c;俄罗斯电商平台Ozon2023年Q1业绩新鲜出炉。数据显示&a…

OpenStack(T版)基础环境准备

文章目录 OpenStack(T版)基础环境准备centos硬件安装版本安装两台centos7服务器虚拟网络编辑器配置网络修改主机名主机名映射关闭防火墙和SElinux配置时间服务器安装openstack(T版)包安装SQL数据库(controller)安装消息队列rabbitmq(controller)安装分布式内存对象缓存系统memc…

代码随想录算法训练营第46天 | 139.单词拆分 + 多重背包理论基础 + 背包问题总结

今日任务 目录 139.单词拆分 - Medium 多重背包理论基础 背包问题总结 递推公式 遍历顺序 139.单词拆分 - Medium 题目链接&#xff1a;力扣-139. 单词拆分 给你一个字符串 s 和一个字符串列表 wordDict 作为字典。请你判断是否可以利用字典中出现的单词拼接出 s 。 注意…

操作系统——实现一个简单的 shell 命令行解释器

一&#xff1a;实验题目 实现一个简单的 shell 命令行解释器 二&#xff1a;实验目的 本实验主要目的在于进一步学会如何在 Linux 系统下使用进程相关的系统调用&#xff0c;了解 shell 工作 的基本原理&#xff0c;自己动手为 Linux 操作系统设计一个命令接口。 三&…

WebSocket是什么,怎么用

74. WebSocket是什么&#xff0c;怎么用 当涉及到实时通信和即时更新的需求时&#xff0c;WebSocket 是一种强大且常用的解决方案。 1. 什么是 WebSocket&#xff1f; WebSocket 是一种在客户端和服务器之间实现双向通信的协议。它允许服务器主动向客户端推送数据&#xff0…