11.JavaScript 中如何进行隐式类型转换?

首先要介绍ToPrimitive方法,这是 JavaScript 中每个值隐含的自带的方法,用来将值 (无论是基本类型值还是对象)转换为基本类型值。如果值为基本类型,则直接返回值本身;如果值为对象,其看起来大概是这样:

/**
* @obj 需要转换的对象
* @type 期望的结果类型
*/
ToPrimitive(obj,type)

type的值为number或者string

(1)当typenumber时规则如下:

  • 调用objvalueOf方法,如果为原始值,则返回,否则下一步;
  • 调用objtoString方法,后续同上;
  • 抛出TypeError 异常。

(2)当typestring时规则如下:

  • 调用objtoString方法,如果为原始值,则返回,否则下一步;
  • 调用objvalueOf方法,后续同上;
  • 抛出TypeError 异常。

可以看出两者的主要区别在于调用toStringvalueOf的先后顺序。默认情况下:

  • 如果对象为 Date 对象,则type默认为string
  • 其他情况下,type默认为number

总结上面的规则,对于 Date 以外的对象,转换为基本类型的大概规则可以概括为一个函数:

var objToNumber = value => Number(value.valueOf().toString())
objToNumber([]) === 0
objToNumber({}) === NaN

JavaScript 中的隐式类型转换主要发生在+、-、*、/以及==、>、<这些运算符之间。而这些运算符只能操作基本类型值,所以在进行这些运算前的第一步就是将两边的值用ToPrimitive转换成基本类型,再进行操作。

以下是基本类型的值在不同操作符的情况下隐式转换的规则 (对于对象,其会被ToPrimitive转换成基本类型,所以最终还是要应用基本类型转换规则):

  1. +操作符 +操作符的两边有至少一个string类型变量时,两边的变量都会被隐式转换为字符串;其他情况下两边的变量都会被转换为数字。
1 + '23' // '123'1 + false // 1 1 + Symbol() // Uncaught TypeError: Cannot convert a Symbol value to a number'1' + false // '1false'false + true // 1
  1. -*\操作符

NaN也是一个数字

1 * '23' // 231 * false // 01 / 'aa' // NaN
  1. 对于==操作符

操作符两边的值都尽量转成number

3 == true // false, 3 转为number为3,true转为number为1
'0' == false //true, '0'转为number为0,false转为number为0
'0' == 0 // '0'转为number为0
  1. 对于<>比较符

如果两边都是字符串,则比较字母表顺序:

'ca' < 'bd' // false
'a' < 'b' // true

其他情况下,转换为数字再比较:

'12' < 13 // true
false > -1 // true

以上说的是基本类型的隐式转换,而对象会被ToPrimitive转换为基本类型再进行转换:

var a = {}
a > 2 // false

其对比过程如下:

a.valueOf() // {}, 上面提到过,ToPrimitive默认type为number,所以先valueOf,结果还是个对象,下一步
a.toString() // "[object Object]",现在是一个字符串了
Number(a.toString()) // NaN,根据上面 < 和 > 操作符的规则,要转换成数字
NaN > 2 //false,得出比较结果

又比如:

var a = {name:'Jack'}
var b = {age: 18}
a + b // "[object Object][object Object]"

运算过程如下:

a.valueOf() // {},上面提到过,ToPrimitive默认type为number,所以先valueOf,结果还是个对象,下一步
a.toString() // "[object Object]"
b.valueOf() // 同理
b.toString() // "[object Object]"
a + b // "[object Object][object Object]"

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

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

相关文章

vivado HDL编码技术

HDL编码技术 介绍 硬件描述语言&#xff08;HDL&#xff09;编码技术使您能够&#xff1a; •描述数字逻辑电路中最常见的功能。 •充分利用AMD设备的体系结构功能。 •模板可从AMD Vivado™设计套件集成设计环境中获得&#xff08;侧面&#xff09;。要访问模板&#xff…

机器学习系列——(二十一)神经网络

引言 在当今数字化时代&#xff0c;机器学习技术正日益成为各行各业的核心。而在机器学习领域中&#xff0c;神经网络是一种备受瞩目的模型&#xff0c;因其出色的性能和广泛的应用而备受关注。本文将深入介绍神经网络&#xff0c;探讨其原理、结构以及应用。 一、简介 神经网…

Python socket库 基础概念

socket库是Python中用于网络编程的标准库之一&#xff0c;它提供了创建套接字&#xff08;socket&#xff09;对象、绑定地址和端口、监听连接、接受连接、发送和接收数据等功能。 套接字是网络通信的基础&#xff0c;它允许程序之间进行数据传输和通信。 套接字类型&#xf…

【碎片知识点】安装Linux系统 VMware与kali

天命&#xff1a;VMware就是可以运行操作系统的载体&#xff0c;kali就是Linux的其中一个分支 天命&#xff1a;Linux有两个分支版本&#xff1a;centos与ubuntu&#xff0c;kali底层就是ubuntu&#xff08;所有Linux用起来都差不多&#xff0c;没啥区别&#xff09; 天命&…

CSS之选择器、优先级、继承

1.CSS选择器 常用的选择器 <body><div class"parent"><div id"one" style"background: blue" class"child">1<div class"one_one">11</div><div style"background-color: blueviole…

一个页面需要加载大量的图片,如何提升用户体验?

当网站页面需要加载大量图片时&#xff0c;优化用户体验非常关键&#xff0c;以下是一些方法来提升用户体验&#xff1a; 图片懒加载&#xff08;Lazy Loading&#xff09;&#xff1a;只加载用户可以看到的图片&#xff0c;当用户向下滚动页面时&#xff0c;再加载其他图片。这…

假期2.14

1、选择题 1.1、若有下面的变量定义&#xff0c;以下语句中合法的是&#xff08; A &#xff09;。 int i&#xff0c;a[10]&#xff0c;*p&#xff1b; A&#xff09; pa2; B&#xff09; pa[5]; C&#xff09; pa[2]2; D&#xff09; p&(i2); 1.2、…

2024LeetCode分类刷题

一、数组 88. 合并两个有序数组 public void merge(int[] nums1, int m, int[] nums2, int n) {int p1 0, p2 0;int[] sorted new int[m n];while (p1 < m || p2 < n) {int current;if (p1 m) {current nums2[p2];} else if (p2 n) {current nums1[p1];} else i…

每日一题——数字翻转

题目; 这道题看似是很简单的回文数 实则就是很简单的回文数 但是需要注意的一点是负数 可以在开头就进行判断&#xff0c;如果N<0的话就令N-N&#xff0c;将所有数都转成正数就好办了 上代码&#xff1a; #include <iostream> #include<string> #include<…

Linux 目录结构结构

Linux 目录结构结构 概念 Linux 没有 C、D、E...盘符&#xff0c;只有一个目录树。通过挂载&#xff0c;将不同的磁盘挂载到目录树下&#xff0c;通过目录访问磁盘。 ‍ 不同目录的作用 目录存放内容/作用​/​根目录&#xff0c;目录树的起点&#xff0c;存放所有文件。​…

4核16G服务器价格腾讯云PK阿里云

4核16G服务器租用优惠价格26元1个月&#xff0c;腾讯云轻量4核16G12M服务器32元1个月、96元3个月、156元6个月、312元一年&#xff0c;阿腾云atengyun.com分享4核16服务器租用费用价格表&#xff0c;阿里云和腾讯云详细配置报价和性能参数表&#xff1a; 腾讯云4核16G服务器价…

【前端工程化面试题】简单说一下 vite 的原理

Vite 是一种新一代的前端构建工具&#xff0c;它的原理主要基于两个核心概念&#xff1a;ES 模块和服务器端模块打包&#xff08;Server-Side Module Bundling&#xff0c;简称 SSMB&#xff09;。 ES 模块&#xff08;ES Modules&#xff09;&#xff1a;Vite 利用了现代浏览器…

蓝桥杯基础知识8 list

蓝桥杯基础知识8 list 01 list 的定义和结构 lits使用频率较低&#xff0c;是一种双向链表容器&#xff0c;是标准模板库&#xff08;STL&#xff09;提供的一种序列容器&#xff0c;lsit容器以节点&#xff08;node&#xff09;的形式存储元素&#xff0c;使用指针将这些节点链…

如何优化覆盖索引

覆盖索引&#xff08;Covering Index&#xff09;是指一个索引包含了查询中所需的所有字段的索引。这意味着查询可以仅通过索引来获取数据&#xff0c;而无需访问数据表中的行。当数据库执行查询时&#xff0c;如果可以直接在索引中找到需要的所有信息&#xff0c;那么就能显著…

计算机网络概述习题拾遗

学习目标&#xff1a; 自下而上第一个提供端到端服务的层次 路由器、交换机、集线器实现的功能层 TCP/IP体系结构的网络接口层对应OSI体系结构的哪两个层次 分组数量对总时延的影响 如果这篇文章对您有帮助&#xff0c;麻烦点赞关注支持一下动力猿吧&#xff01; 学习内容…

4核16g云服务器多少钱?

4核16G服务器租用优惠价格26元1个月&#xff0c;腾讯云轻量4核16G12M服务器32元1个月、96元3个月、156元6个月、312元一年&#xff0c;阿腾云atengyun.com分享4核16服务器租用费用价格表&#xff0c;阿里云和腾讯云详细配置报价和性能参数表&#xff1a; 腾讯云4核16G服务器价…

倒计时55天

(0条未读通知) 牛客竞赛_ACM/NOI/CSP/CCPC/ICPC算法编程高难度练习赛_牛客竞赛OJ (nowcoder.com) a. #include<bits/stdc.h> using namespace std; #define int long long const int N2e56; const int inf0x3f3f3f3f; void solve() {int n,cn10,cn20;string s,str1"…

MyBatisPlus - 润物无声、效率至上、丰富功能

目录 一、简介 1.1、为什么要使用 MybatisPlus 二、使用指南 2.1、依赖 2.2、配置 2.3、常用注解 2.4、BaseMapper 的使用 2.4.1、定义 Mapper 接口 2.4.2、基于 QueryWrapper 的查询&#xff08;不推荐&#xff09; 2.4.3、基于 UpdateWrapper 的修改&#xff08;不…

Sentinel 流控-链路模式

链路模式 A B C 三个服务 A 调用 C B 调用 C C 设置流控 ->链路模式 -> 入口资源是 A A、B 服务 package com.learning.springcloud.order.controller;import com.learning.springcloud.order.service.BaseService; import org.springframework.beans.factory.annotatio…

腾讯云4核8G服务器3年600元?

腾讯云4核8G服务器3年600元&#xff1f;目前的价格是轻量应用服务器4核8G12M带宽一年446元、646元15个月&#xff0c;云服务器CVM标准型S5实例4核8G配置价格15个月1437.3元&#xff0c;5年6490.44元&#xff0c;标准型SA2服务器1444.8元一年&#xff0c;在txy.wiki可以查询详细…