简单说 通过JS的隐式转换,关键时刻救你一命

JavaScript toString()方法深度解析:从类型转换到自定义对象序列化 在JavaScript开发中,类型转换是基础且核心的概念,它直接影响代码的健壮性和可维护性。toString()方法作为对象到字符串转换的关键机制,其原理基于JavaScript的原型链系统,通过Object.prototype.toString提供默认实现,而内置对象如Array、Date、Number等则重写了该方法以提供更有用的字符串表示。理解toString()的技术价值在于,它不仅是调试和日志输出的重要工具,更是控制对象在字符串上下文中行为的手段,能有效避免常见的隐式转换错误。在实际应用场景中,t 阅读详情

说明

JavaScript在比较的时候,会进行隐式转换,你如果对隐式转换不是特别熟悉,结果往往出乎你的意料。
我们来看看这行代码

(![]+[])[+!![]- -+!![]- -+!![]]+({}+[])[+!![]]+(![]+[])[+!![]- -+!![]- -+!![]]

这行代码的结果可能出乎你的意料,看结果
这里写图片描述

结果居然是sos,这就是为什么会给文章这样一个题目了,这行代码看上去似乎是乱七八糟的,但是相信你看完这篇文章,一定能自己写出这样的代码来。

解释

相信我,这行代码是简单的,它并不复杂,我们先来分解一下这行代码

(![]+[])[+!![]- -+!![]- -+!![]]   //s
+  
({}+[])[+!![]]				      //o
+                
(![]+[])[+!![]- -+!![]- -+!![]]   //s

我们把这一行,分解成了3行了。

先看第一行
(![]+[])[+!![]- -+!![]- -+!![]]
这行还能分成两部分

(![]+[])		
[+!![]- -+!![]- -+!![]]

我们继续看这分开的两部分
(![]+[]) 看看这个是什么意思
友情提示:
[ ] 转为布尔值是 true
[ ] 转为字符串是 ""

如果想知道为什么,推荐看看下面的两篇文章。
简单说 JavaScript中的tostring( ) 与 valueOf( )方法
简单说 !![]==true 与 []==true 引发的思考

![ ] 就是false
(![]+[]) 会转为这个样子 (false+"") 结果就是"false",字符串类型的哦!

[+!![]- -+!![]- -+!![]]这个又是什么意思呢?
我们能看见 +!![] 这个东西是什么,居然出现了三次
+!![],!的优先级最高,先算 !![ ],!![ ] 是对 [ ]进行了布尔值的转换,最后结果就是true,最后在往前面来个+,就成了+true 这样,进行隐式转换,把true转为数字,就是1,好了,+!![] 就是 1 的意思,我们用1来替换一下代码,看看变成了什么样子[1- -1 - -1],我相信大家都能算出这么简单的正数 减 负数 减 负数 的结果来,所有最后的结果是[3]

好的,我们把第一行的这两个部分放在一起看看 "false"[3],这下明显了吧!字符串的第3个字符,这样就有s了

继续看第二行
({}+[]])[+!![]]
我们同样拆成两部分

({}+[]])
[+!![]]

第一部分 ({}+[])
( )里面的{},不是语法上的花括号,不是语句块的意思,而是表示了一个空对象,这里相加的时候会调用对象的toString()方法,所以它会转为"[object Object]",字符串类型的哦!
[ ],它同样也会调用toString()方法,所以[ ],会转为"",也就是一个空字符串。
这两个结果放在一起就是"[object Object]"+"" ,最后结果是"[object Object]"。

第二部分 [+!![]]
上面我们已经知道+!![] 是 1 的意思,所以最后的结果就是[1]
好的,我们把第二行的这两个部分放在一起看看"[object Object]"[1],这样我们就看的很清楚了,o也有了

最后的第三行,和第一行一模一样,好的我们用 + ,把这三行的结果拼接起来就是 “sos” 了。

总结

最后用张图总结一下
这里写图片描述

相信现在,你应该是理解上面的代码了,写这个代码,也主要是想理解理解隐式转换,题目是开玩笑的,希望大家永远不会真的遇到需要这样的代码的关键时刻。
最后推荐两篇相关的文章,希望对大家有所帮助。
简单说 JavaScript中的tostring( ) 与 valueOf( )方法
简单说 !![]==true 与 []==true 引发的思考

新手避坑指南:JS中new Date()时区转换的3个常见错误及正确姿势 本文针对JavaScript中new Date()的时区处理,揭示了新手常见的三个误区:误以为创建的是无时区时间、混淆getTimezoneOffset()返回值、以及在显示与比较中混用时区概念。文章提供了使用明确时间戳、ISO 8601格式以及分离存储与显示时区的正确实践,并附有构建跨时区公平系统的实战指南,帮助开发者避免因时区转换错误导致的业务逻辑故障。 阅读详情

相关推荐

探索Three.js:JavaScript的3D动画世界

三维动画是一种利用计算机软件创造的视觉艺术,通过模拟物体在三维空间中的位置和运动,创建出类似现实世界的动画效果。它使得动画师能够创建出模拟真实世界物理规律的动画场景,包括光照、阴影、反射以及其他视觉效果,从而赋予虚拟世界更为真实的感觉。Three.js是一个轻量级的3D图形库,它抽象了底层的WebGL API,使得开发者能够以更加简洁直观的方式创建和控制3D场景。Three.js的模块化设计是其核心优势之一,它允许开发者只导入所需的组件,而不必加载整个库。

weixin_35879493的博客 1073

最全的js隐式转换

隐式转换 隐式转换介绍 在js中,当运算符在运算时,如果两边数据(这里为啥不写数据类型呢是因为两边的类型不同其实也会发生隐式转换,往下看你会更加了解)不统一,CPU就无法计算,编译器会自动将运算符两边的数据做一个数据类型转换,转成一样的数据类型再计算,这种无需程序员手动转换,而由编译器自动转换的方式就称为隐式转换

vita_min123的博客 5664

Windows环境下Elasticsearch与JDK版本兼容性实战指南

本文详细解析了Windows环境下Elasticsearch与JDK版本的兼容性问题,提供了从版本匹配检查到安装部署的完整实战指南。重点介绍了Elasticsearch 8.x需JDK 17+等关键版本对应关系,并分享多版本JDK共存方案及性能优化技巧,帮助开发者高效避坑。

weixin_29250403的博客 421

【Js】JavaScript数据类型隐式转换

类型相同基本类型,直接比较值引用类型比较指针类型不同,尝试转成number类型,先调用valueOf()转成number不行就再用toString()方法转成stringnull、NaN、undefined单独一套规则。

m0_57135756的博客 1万+

利用HipSTR从二代测序数据中精准解析短串联重复序列(STR)的遗传多态性

本文详细介绍了如何利用HipSTR工具从二代测序(NGS)数据中精准解析短串联重复序列(STR)的遗传多态性。通过三步走策略,HipSTR能够高效识别STR区域、估算重复次数并判定基因型,适用于法医鉴定、疾病研究和细胞系鉴定等多个领域。文章还提供了实战操作指南和常见问题解决方案,帮助研究者充分利用NGS数据开展STR分析。

weixin_28702105的博客 483

【hadoop编译报错】(yarn install) on project hadoop-yarn-applications-catalog-webapp Failed to run task

ambari+bigtop自定义组件集成

TTBIGDATA的博客 1804

JS的隐式转换

JavaScript中的隐式转换是指在运行过程中,代码自动将一个数据类型转换为另一个数据类型,而无需显式地调用转换函数。JavaScript是弱类型语言,这意味着它不像Java,C++一样的强类型语言有预先确定的类型。并且变量的类型是由值的类型来决定的,这导致了一个问题,一个变量可能上一步骤操作中还是String,下一步操作可能立刻变为了Object,为了解决不同类型无法进行计算,JS底层会将不同类型转换为同一类型,由JS运行环境自动帮我们去做的类型转换。

liu62615的博客 1089

21、时间触发以太网:通信、诊断、故障隔离与参数化详解

本文详细解析了时间触发以太网(TTEthernet)的核心机制,包括团检测算法、诊断服务、故障隔离策略、配置服务以及协议参数化等内容。TTEthernet是一种专为超高可靠性系统设计的网络技术,广泛应用于航空航天、工业自动化和汽车电子等领域。文章还探讨了其未来发展趋势,如技术创新与生态建设,为开发者、企业和研究机构提供了应用与发展的方向。

efc12345678的博客 110

【JS】JavaScript的隐式类型转换详解

详解js的隐式转换以及哪些场景下会触发隐式转换,以及一些使用小技巧

owo_ovo的博客 3114

20、微电网系统的系统框架、建模与控制架构解析

本文详细解析了微电网系统的系统框架、建模方法以及控制架构。文章首先介绍了在系统的系统(SoS)框架下,微电网如何通过微控制器(MC)和微电网中央控制器(MGCC)协调运行,并支持并网与孤岛模式下的高效能量管理。随后,针对微电网的关键组件,包括微涡轮机、光伏太阳能电池和风力涡轮机,提供了详细的数学建模分析。最后,探讨了微电网的控制架构设计,涵盖分层控制和共识控制策略,以实现系统的高效、稳定运行,满足日益增长的能源需求与市场要求。

elastic6hunter的博客 206

在 SAP HANA 与 HANA Cloud 中,用 SQL DDL 创建数据库视图:从设计时工件到运行时对象的全链路实践

本文介绍了在SAP HANA中通过HDI容器使用DDL定义视图的方法。主要内容包括:1)采用.hdbview设计时工件存储视图定义,构建时自动转换为运行时视图,实现版本控制和权限隔离;2)开发前需准备HDI容器、MTA项目及配置.hdiconfig文件;3)详细说明.hdbview语法结构,重点讲解WITH READ ONLY和WITH STRUCTURED PRIVILEGE CHECK的使用场景;4)提供了从创建文件到构建验证的完整流程示例;5)强调跨容器访问时需通过.hdbgrants为#OO用户授予

2007 年 ~ 2025 年,深耕 SAP 技术 18 年 275

JS基础语法(05)-隐式数据类型转换

1.为什么要有隐式类型转换? 当运算符在运算时,如果两边数据不统一,CPU就无法计算,这时我们编译器会自动将运算符两边的数据做一个数据类型转换,转成一样的数据类型再计算 2.什么是隐式类型转换:编译器自动转换 本小节知识点 1.转成string类型:+号两边如果有一边是字符串,则会把另一边转换成字符串,然后进行拼接 2.转成number类型:以下几种运算符会将任何数据转换成numb...

坤小的专栏 987

第12步 支持向量机(SVM)

搭建SVM

Jet4505的博客 1051

简单说 !![]==true 与 []==true 引发的思考

说明 直接说出问题 !![] == true //结果是true [] == true //结果是false ![] == [] //结果是true 为什么会出现这种情况 解释 首先说一下,如果你看到这些代码,能想到 相等运算符(== ),两个操作数类型不同时,进行的转换,那么你已经接近答案了。 不要浪费时间,我们需要先知道在JavaScript中...

FEWY的博客 1万+

ssm框架搭建

这个是一个在idea上成功跑起来的ssm框架项目,保存在这里方便以后使用直接下载

STM32F407中文手册

STM32f407中文手册 本参考手册面向应用开发人员,提供有关使用 STM32F405xx/07xx、STM32F415xx/17xx、 STM32F42xxx 和 STM32F43xxx 微控制器存储器与外设的完整信息。STM32F405xx/07xx、STM32F415xx/17xx、STM32F42xxx 和 STM32F43xxx 构成一个微 控制器系列,各产品具有不同的存储器大小、封装和外设。有关订购信息以及器件的机械与电气特性,请参见数据手册。有关 ARM Cortex™-M4F 内核的信息,请参见《Cortex™-M4F 技术参考手册》。

简单说 !![]==true 与 []==true 引发的思考

说明 直接说出问题 !![] == true //结果是true [] == true //结果是false ![] == [] //结果是true 为什么会出现这种情况 解释 首先说一下,如果你看到这些代码,能想到 相等运算符(== ),两个操作数类型不同时,进行的转换,那么你已经接近答案了。 不要浪费时间,我们需...

weixin_34349320的博客 244

pscad IEEE标准系统搭建说明

pscad IEEE标准系统搭建说明,包含典型的IEEE 9节点、14节点、30节点、39节点和118节点系统。内含标准测试系统的原始数据和潮流结果。

JavaScript开发者必看:3种致命错误让你的代码崩溃,90%的开发者都栽过跟头!

JavaScript中的错误类型多种多样,但通过了解和掌握这些常见错误的识别与解决方法,我们可以大大提升代码的健壮性和可靠性。记住,错误不是失败,而是成长的机会。类型转换错误:显式转换 + 类型检查 = 安全数据类型错误:可选链操作符 + 防御性编程 = 可靠通信错误:正确编码 + 完善错误处理 = 稳定在日常开发中,养成良好的错误处理习惯,不仅能减少调试时间,还能提升用户体验。下次当你遇到一个奇怪的错误时,不妨先问问自己:这是类型转换错误?数据类型错误?还是通信错误?

JakeMa1024的博客 961

WINCC7.3破解文件

WINCC7.3硬件够破解文件,有需要的下载!WINCC7.3硬件够破解文件,有需要的下载!

JS浮点数运算陷阱:如何避免小数相加的精度丢失

本文深入剖析了JavaScript中浮点数运算精度丢失的根本原因,即IEEE 754双精度浮点数的二进制存储限制。文章通过电商账单等实际案例,揭示了小数相加等运算的常见陷阱,并提供了核心的“化小为整”解决方案及手写精确计算函数的方法,帮助开发者彻底规避JS精度问题,确保金融计算等场景的数据准确性。

tree的博客 824

JS语言技巧:switch语句

转自:微点阅读(www.weidianyuedu.com)微点阅读 - 范文大全 - 免费学习知识的网站 一、三元运算符 三元运算符也叫三元表达式。是唯一一个涉及3个参数的表达式。 表达式的形式: 1条件表达式 ?值1 :值2; 表示:当条件表达式为真时,取值1; 当条件表达式为假时,取值2。 1var a = (7 > 8) ?8 :7; 2console.log(a); 1var a = (7 < 8) ?8 :7; 2console.log(a...

asd3331380的博客 2274

Stately.js项目实战:构建复杂工作流引擎的完整案例

Stately.js是一个基于JavaScript的有限状态机(FSM)引擎,专为Node.js和浏览器环境设计。这个强大的工具能帮助开发者轻松管理复杂的状态转换逻辑,是构建工作流引擎的理想选择。在前100个字内,我们了解到Stately.js的核心功能是提供清晰、可维护的状态管理方案,让复杂的业务逻辑变得简单可控。 ## 📊 什么是有限状态机(FSM)? 有限状态机是一种数学模型,用于表示

gitblog_00677的博客 175

Python/JS/Go/Java同步学习(第十四篇)四语言“字符串字母大小写转换“对照表: 财务“小南“纸式转换术处理凭证内容崩溃(附源码/截图/参数表/避坑指南)

文章摘要 本文为「冷门但救命」编程技巧系列第14弹,聚焦字符串大小写转换的实战应用,覆盖Python、Java、Go、JS四语言,解决财务、API、国际化等场景的格式问题。核心方法包括upper()(全大写)、lower()(全小写)、title()(词首大写)等,并对比各语言特性:Python原生支持最全,Java/Go/JS需自定义部分功能。避坑指南强调土耳其语等特殊场景的兼容性处理(如casefold()和Locale参数),附代码示例及四语言实战对比表,助你快速统一数据格式,避免审计或系统崩溃风险。

本博客无转载,每一行代码都带药香,每一个概念都经实 战淬练| 初中学历非科班突围路线 从生产线走向全栈开发的实战派,通过: 10年ERP系统实施(服务100+客户,覆盖20行业) 5年医疗仓储物流数字化管理经验 2年生产制造打螺丝一线经验 1507

Stately.js状态机设计模式:7个常见应用场景解析 [特殊字符]

Stately.js是一个强大的JavaScript有限状态机(FSM)引擎,专为Node.js和浏览器环境设计。这个轻量级库让开发者能够轻松管理复杂的应用程序状态,通过状态机设计模式简化状态转换逻辑,提升代码的可维护性和可测试性。在前100个字内,Stately.js状态机设计模式的核心关键词已经自然地融入,为SEO优化奠定基础。 ## 📊 状态机设计模式的核心优势 状态机设计模式是现代W

gitblog_00437的博客 945

JS语言学习之switch语句

财运方面,你的收入水平持续的增长,来自多方面的补益让人羡慕不已。8 alert("已婚者享受着被疼爱的感觉,有了情感的滋润,做事的热情尤为浓厚。③break表示强制跳出该switch语句,如果没有break,语句在匹配完之后,执行了想要的代码部分,不会自动跳出,会继续往下执行代码,哪怕后面的case不匹配,直到遇到一个break,才会跳出。switch语句也是我们条件分支语句,又叫开关语句,允许一个程序去计算一个表达式的值,让这个值去匹配一个case 选项,匹配成功直接执行该case中的结构体。

hdxx2022的博客 4107

JavaScript一些优雅小技巧不得不知

一般这些小技巧都是经常用的,就算你不经常用也要知道,为什么呢,还不是你要看别人的代码呢,总不能看一行百度一下,关键时刻百度可是没啥用的。 1.数字字符串快速转换数字 var a = "3"; console.log(a * 1); // 3 console.log(+a); // 3 这个方法最长用 console.log(a.valueOf()); // 3 有的时候后台来的字...

Army-海军的博客 1万+

轻松学习 JavaScript——第 4 部分:函数中的 arguments 对象

点击上方“程序员大咖”,选择“置顶公众号” 关键时刻,第一时间送达! JavaScript函数具有像数组一样的对象,这些对象称为arguments,与传递给函数的参数相对应。传递给JavaScript函数的所有参数都可以使用arguments对象来引用。 现在我们开始学习,仔细看下面列出的代码: function add(num1, num2) {

<sdffdsfsdfdfs>sfsfsfsdfsdffds</sdfsDS>Fsd 415
上一篇: 简单说 !![]==true 与 []==true 引发的思考
下一篇: 简单说 通过JS控制CSS的各种方式(下)
FEWY
FEWY 领域专家: 前端开发技术领域 领域专家: 前端开发技术领域
博客等级 码龄10年 504粉丝 77原创
评论 10
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值