经典面试题第十一更---类型转换

前言:
    🤡 作者简介:我是Morning,计算机的打工人,想要翻身做主人 🙈 🙈 🙈
    🏠 个人主页:  Morning的主页
    📕系列专栏:前端面试备战  https://blog.csdn.net/m0_72154565/category_12458506.html?spm=1001.2014.3001.5482
    📞 如果小编的内容有欠缺或者有改进,请指正拙著。期待与大家的交流
    🔥如果感觉博主的文章还不错的话,👍点赞👍 + 👀关注👀 + 🤏收藏🤏

 

原先我以为类型转换并没有多少知识点,题什么的应该也是手拿把掐,但是在做过一道大厂笔试题后,💩💩💩💩就是此篇中的5关系运算符的例子。很有意思,大家可以好好看看

目录

1.转Boolean

 2.对象转原始类型

3.四则运算符

4.比较运算符

5.关系运算符


首先要知道在JS中的类型转换只存在三种,转换成Boolean数字字符串

1.转Boolean

在条件判断时,undefined、null、0、-0、false、NaN、' '  这7中数据类型都会转为false

其余的所有值都转为true,包括对象(空数组、函数等等)

 2.对象转原始类型

在对象转换原始类型时会调用内置函数toPrimitive(input, PreferredType)

  • 参数input是要被转换的对象,
  • 参数PreferredType期望返回的结果类型(可选,默认为number  弱指定,不会影响原本的结果)

如果转换的类型是number,ToPrimitive函数会执行以下步骤:

1. 如果input是原始值,直接返回这个值;

2. 否则,如果input是对象,调用input.valueOf(),如果结果是原始值,返回结果;

3. 否则,调用input.toString()。如果结果是原始值,返回结果;

4. 否则,抛出错误。

如果转换的类型是String,2和3会交换执行,即先执行toString()方法。

😡😡😡

读起来真的很晦涩难懂,我就按照自己理解(在没有指定PreferredType的情况下我是不是就可以理解为,都是默认想要先转为number类型。)总结了这个toPrimitive算法逻辑:

  • 如果是原始数据类型,就不需要转换了
  • 调用x.valueOf(),如果转换为基础类型,就返回转换的值
  • 调用x.toString(),如果转换为基础类型,就返回转换的值
  • 没有返回原始数据类型,报错

而且可以重写Symbol.toPrimitive,该方法在转换原始类型时优先级最高

let a={valueOf(){return 0},toString(){return '1'},[Symbol.toPrimitive](){return 2}
}
console.log(1+a);//1+2=3

3.四则运算符

  • 运算中其中一方为字符串,那么另外一方也会转换成字符串
  • 如果有一方不是字符串也不是数字,那么会将它转换为数字或者字符串
  • 对于除了加法的运算符来说,只要其中一方是数字,另外一方就会变成数字
console.log(1+'1');//'11'  特点一
console.log(true+true);//2  特点二
console.log(4+[1,2,3]);//'41,2,3'  特点二 数组通过toString转换成字符串'1,2,3'
console.log([1,2,3]+4);//'1,2,34'  与上同理
console.log(1+'true');//'1true'   特点一
console.log(1+true);//2    特点二  true变成数字为1
console.log(1+undefined);//NaN    特点一 undefined为未定义,强转数值的话返回NaN,在+1还是NaN
console.log(1+null);//1  特点一  null会转为数字0console.log('a'+ +'b');//'aNaN'  

最后一例,+'b' 等于NaN,再结合特点一,所以结果为'aNaN' 

4.比较运算符

  • 如果是对象,就通过toPrimitive转换对象
  • 如果有一边是字符串,将数据类型转换为数字
  • 如果两边都是字符串,就通过字符串的unicode编码来比较(可以通过charCodeAt()来查看)
    1. 如果是数字型的字符串,直接比较unicode编码
    2. 如果是字母型的字符串,会从左到右进行比较

补充:unicode编码  A~Z :65~90       a~z:97~122

console.log('2'>10);//false  Number('2')=2
console.log('2'>'10');//true '2'.charCodeAt()=50  '10'.charCodeAt()=49
console.log('abc'>'b');//false 'a'.charCodeAt()=97  'b'.charCodeAt()=98
console.log('abc'>'aad');//true 比较第二位97 = 97 比较第二位 98>97 
//还有这些特殊的undefined和null 要记清楚
console.log(undefined==undefined);//true
console.log(null==null);//true
console.log(undefined==null);//true
console.log(NaN==NaN);//false

5.关系运算符

关系运算符:将其他数据类型转换成数字  如果是复杂数据类型,对其转换成基本类型,再使用Number

逻辑非:将其他数据类型用Boolean转换

console.log([]==0);//true Number([].valueOf().toString())=Number('')=0      0=0
console.log(![]==0);//true !Boolean([])=false Number(false)=0       0=0
console.log([]==![]);//true Number('')=0  Number(false)=0       0=0
console.log([]==[]);//false 两个不同的空间,不会相等
console.log({}=={});//false 两个不同的空间,不会相等console.log({}==!{});//false
//{}.valueOf().toString()=[object Object]  [object Object]肯定不等于false

注意:

        [ ].valueOf().toString() =‘ ’

        { }.valueOf().toString()=[object Object]

valueOf()与toString()方法我决定在之后的作品中再进行解释,就不增加此篇的压力了 

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

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

相关文章

CSS图文悬停翻转效果完整源码附注释

实现效果截图 HTML页面源码 <!DOCTYPE html> <html><head><meta http-equiv="content-type

M4Singer Ubuntu 4060ti16G 笔记

显卡 (venv3712) (python3.7.12) yeqiangyeqiang-Default-string:~/Downloads/ai/M4Singer/code$ nvidia-smi Mon Oct 9 12:09:50 2023 --------------------------------------------------------------------------------------- | NVIDIA-SMI 535.113.01 …

一站式数据可视化与分析平台JVS智能BI强大的数据节点功能

在商业智能&#xff08;BI&#xff09;中&#xff0c;数据集是数据的集合&#xff0c;用于分析和报告。数据节点是数据集中的一个重要组成部分&#xff0c;它代表数据集中的一个特定数据点或数据元素。通过使用数据节点&#xff0c;可以对数据进行过滤、分组和计算&#xff0c;…

「Qt中文教程指南」如何创建基于Qt Widget的应用程序(二)

Qt 是目前最先进、最完整的跨平台C开发工具。它不仅完全实现了一次编写&#xff0c;所有平台无差别运行&#xff0c;更提供了几乎所有开发过程中需要用到的工具。如今&#xff0c;Qt已被运用于超过70个行业、数千家企业&#xff0c;支持数百万设备及应用。 本文描述了如何使用…

RK3568平台开发系列讲解(驱动篇)RK3568 PWM详解

🚀返回专栏总目录 文章目录 一、什么是PWM二、RK3568 PWM2.1、PWM 通道与引脚2.2、PWM 简介2.3、PWM 设备节点沉淀、分享、成长,让自己和他人都能有所收获!😄 📢 PWM 是很常用到功能,我们可以通过 PWM 来控制电机速度,也可以使用 PWM 来控制 LCD 的背光亮度。 一、什…

用C++写个示例 linux WebAssembly技术支持的js调用串行通信

C在Linux上通过WebAssembly实现串行通信 以下是一个示例&#xff0c;展示了如何使用C在Linux上通过WebAssembly实现串行通信。这个示例假设你已经安装了Emscripten工具链&#xff0c;并正确配置了你的系统。 首先&#xff0c;创建一个名为serial_communication.cpp的C源文件&…

实验1机器学习之线性回归实验

一、实验目的&#xff1a; &#xff08;1&#xff09;理解一元线性回归和多元线性回归的数学原理&#xff0c;能够利用sklearn中相关库解决现实世界中的各类回归问题&#xff1b; &#xff08;2&#xff09;掌握利用matplotlib对一元线性回归模型进行可视化的方法&#xff0c…

软件测试/测试开发丨为什么接口自动化测试是提升职业技能的关键?

接口测试背景和必要性 接口测试是测试系统组件间接口&#xff08;API&#xff09;的一种测试&#xff0c;主要用于检测内部与外部系统、内部子系统之间的交互质量&#xff0c;其测试重点是检查数据交换、传递的准确性&#xff0c;控制和交互管理过程&#xff0c;以及系统间相互…

HttpServletResponse对象

1.介绍 在Servlet API中&#xff0c;定义了一个HttpServletResponse接口&#xff0c;它继承自ServletResponse接口&#xff0c;专门用来封装HTTP响应消息。由于HTTP响应消息分为状态行、响应消息头、消息体三部分&#xff0c;因此&#xff0c;在HttpServletResponse接口中定义…

Android 面经总结分享(相当走心)

背景描述 这是来自一位粉丝朋友的面经分享&#xff0c;他在 「Android 开发行业」 摸爬滚打5年多的开发&#xff0c;呆过的互联网公司有三家&#xff0c;均从事的Android 开发的工作。最后离职的一家公司也是做的最久的一家&#xff0c;工作了将近3年多时光。 废话不多说了&a…

vscode更改为中文版本

方式一 在扩展里安装chinese插件 方式二 1.Ctrl&#xff0b; Shift &#xff0b;P&#xff08;commandshiftP&#xff09; 2.输入Configure display Language 3.选择zh-cn 这时候vscode会提示需要重启&#xff0c;点击restart重启vscode&#xff0c;重启后vscode就会显示中…

React18学习

17、React_JSX的注意事项 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>JSX的注意</title><script src"./script/react.development.js"></script><script src"…

【Mybatis】动态 SQL

动态 SQL \<if>标签\<trim>标签\<where>标签\<set>标签\<foreach>标签 动态 sql 是 Mybatis 的强⼤特性之⼀&#xff0c;能够完成不同条件下不同的 sql 拼接。 <if>标签 前端用户输入时有些选项是非必填的, 那么此时传到后端的参数是不确…

【eNSP】VLAN基础配置

一、基于接口划分VLAN&#xff08;Access接口和Trunk接口&#xff09; 1、创建VLAN LSW1 [LSW1]vlan batch 10 20 Info: This operation may take a few seconds. Please wait for a moment...done.LSW2 [LSW2]vlan batch 10 20 Info: This operation may take a few second…

【手写数字识别】数据挖掘实验二

文章目录 Ⅰ、项目任务要求任务描述&#xff1a;主要任务要求(必须完成以下内容但不限于这些内容)&#xff1a; II、实现过程数据集描述实验运行环境描述KNN模型决策树模型朴素贝叶斯模型SVM模型不同方法对MNIST数据集分类识别结果分析(不同方法识别对比率表及结果分析) 完整代…

32、Flink table api和SQL 之用户自定义 Sources Sinks实现及详细示例

Flink 系列文章 1、Flink 部署、概念介绍、source、transformation、sink使用示例、四大基石介绍和示例等系列综合文章链接 13、Flink 的table api与sql的基本概念、通用api介绍及入门示例 14、Flink 的table api与sql之数据类型: 内置数据类型以及它们的属性 15、Flink 的ta…

Edge 无法登录/同步问题【一招搞定】

目录 前言 一、打开 Edge 浏览器显示未同步&#xff0c;点击同步无效 二、Edge 登录报错 0x801901f4 或 0x80190001 解决方法 2.1 报错 0x801901f4 解决方法 2.1.0 Edge 登陆报错图示 2.1.1 添加 Edge 推荐的 DNS 地址 2.1.2 重新登录 Edge 账号成功 2.2 报错 0x801…

【Ubuntu虚拟机】

Ubuntu虚拟机配置samba 转载知乎 samba: 安装samba服务 sudo apt-get install samba 2.确定是否确实安装了 samba --version 输入这个命令&#xff0c;确实安装的话&#xff0c;会打印出samba的版本 3.创建一个samba服务的共享目录&#xff0c;并配置该目录为最高权限 sudo …

多个git提交,只推送其中一个到远程该如何处理

用新分支去拉取当前分支的指定commit记录&#xff0c;之后推送到当前分支远程仓库实现推送指定历史提交的功能 1.查看当前分支最近五次提交日志 git log --oneline -5 2.拉取远程分支创建临时本地分支 localbranch 为本地分支名 origin/dev 为远程目标分支 git checkout …

数据库中查询所有表信息,查询所有字段信息

MYSQL中 所有表信息 information_schema.tables表 SELECT * FROM information_schema.tables -- TABLE_NAME 表名 -- TABLE_COMMENT 表中文名所有字段信息 information_schema.COLUMNS表 SELECT * FROM information_schema.tables -- TABLE_SCHEMA 数据库名 -- COLUMN…