一，效果图。

二，代码。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>JavaScript 类型转换</title>

</head>

<body>

    <!--typeof操作符-->

    <p> typeof 操作符返回变量、对象、函数、表达式的类型。</p>

    <p id="demo"></p>

    <script>

    document.getElementById("demo").innerHTML =

        typeof "john" + "<br>" +

        typeof 3.14 + "<br>" +

        typeof NaN + "<br>" +

        typeof false + "<br>" +

        typeof [1, 2, 3, 4] + "<br>" +

        typeof {

            name: 'john',

            age: 34

        } + "<br>" +

        typeof new Date() + "<br>" +

        typeof

    function() {} + "<br>" +

    typeof myCar + "<br>" +

        typeof null;

    </script>

    <!--constructor 属性-->

    <p>constructor属性返回变量或对象的构造函数.</p>

    <p id="demo1"></p>

    <script>

    document.getElementById("demo1").innerHTML = "john".constructor + "<br>" + (3.14).constructor + "<br>" + false.constructor + "<br>" + [1, 2, 3, 4].constructor + "<br>" + {

        name: "john",

        age: 34

    }.constructor + "<br>" + new Date().constructor + "<br>" + function() {}.constructor;

    </script>

    <!--constructor 属性-->

    <p>判断是否为数组。</p>

    <p id="demo2"></p>

    <script>

    var fruits = ["Banana", "Orange", "Apple", "Mango"];

    document.getElementById("demo2").innerHTML = isArray(fruits);

    function isArray(myArray) {

        return myArray.constructor.toString().indexOf("Array") > -1;

    }

    </script>

    <p>判断是否为日期。</p>

    <p id="demo3"></p>

    <script>

    var myDate = new Date();

    document.getElementById("demo3").innerHTML = isDate(myDate);

    function isDate(myDate) {

        return myDate.constructor.toString().indexOf("Date") > -1;

    }

    </script>

    <p>String()方法可以将数字转换为字符串</p>

    <p id="demo4"></p>

    <script>

    var x = 123;

    document.getElementById("demo4").innerHTML = String(x) + "<br>" + String(123) + "<br>" + String(100 + 23);

    </script>

    <p>toString()方法将数字转为字符串</p>

    <p id="demo5"></p>

    <script>

    var x = 123;

    document.getElementById("demo5").innerHTML = x.toString() + "<br>" + (123).toString() + "<br>" + (100 + 23).toString();

    </script>

    <p> typeof 操作符返回变量或表达式的类型。</p>

    <button onclick="myFunction()">点我</button>

    <p id="demo6"></p>

    <script>

    function myFunction() {

        var y = "5";

        var x = +y;

        document.getElementById("demo6").innerHTML =

            typeof y + "<br>" + typeof x;

    }

    </script>

    <p>typeof操作符返回变量或表达式的类型</p>

    <button onclick="myFunction()">点我</button>

    <p id="demo7"></p>

    <script>

    function myFunction() {

        var y = "john";

        var x = +y;

        document.getElementById("demo7").innerHTML = typeof + "<br>" + x;

    }

    </script>

</body>

</html>

参考资料：《菜鸟教程》

【代码笔记】Web-JavaScript-JavaScript 类型转换的更多相关文章

  1. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  2. WEB前端--JavaScript

    JavaScript JavaScript基础 一.JavaScript简介 JavaScript是一种嵌入到HTML文件中的描述性语言,由浏览器的解释器将其动态地处理成可执行的代码,能独立地完成与客 ...

  3. Web Worker javascript多线程编程（一）

    什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...

  4. Web Worker javascript多线程编程（二）

    Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...

  5. 2015年10个最佳Web开发JavaScript库

    2015年10个最佳Web开发JavaScript库 现在的互联网可谓是无所不有,有大量的JavaScript项目开发工具充斥于网络中.我们可以参考网上的指导来获取构建代码项目的各种必要信息.如果你是 ...

  6. WEB 技术分类 Javascript DOM(Element Node) BOM

    Web technology for developers   Web 技术文档 备注:本文介绍web technology的分类,各自职责,因为之前一直就没有搞明白各种技术.各种名词究竟是属于哪个范 ...

  7. 前端笔记 （3.JavaScript 1）

    JavaScript 是属于网络的脚本语言! JavaScript 是一种轻量级的编程语言. JavaScript 是可插入 HTML 页面的编程代码. JavaScript 插入 HTML 页面后, ...

  8. 【Web】JavaScript 语法入门

    一. 简介 动态性和交互性 1.由浏览器解释执行 2.常见的脚本语言:JavaScript和VBScript P.S. Node.js 是使用JavaScript编写的服务器端框架. 二. JavaS ...

  9. 【转】Web Worker javascript多线程编程（一）

    原文:https://www.cnblogs.com/peakleo/p/6218823.html -------------------------------------------------- ...

  10. Web前端-JavaScript基础教程下

    Web前端-JavaScript基础教程下 <script>有6个属性: async对外部脚本有效,可以用来异步操作,下载东西,不妨碍其他操作. charset为src属性指定字符集. d ...

随机推荐

  1. C语言中指针中的值赋值给数组

    如果把各种语言做个冷兵器类比的话,C语言一定是刀客的最佳工具．入门很简单,但是要是能把它熟练运用,那就是顶尖级别的高手了． 用了那么多年的C语言,发现自己还是仅仅处于熟练的操作工．今天遇到了一个bug ...

  2. HTML百宝箱（1从0开始）

    标准格式(XHTML) l   元素必须正确嵌套 l   元素必须始终关闭 l   元素名和属性名必须小写 l   文档必须有且仅有一个根元素 l   属性值必须使用双引号括起来 l   声明文档为标 ...

  3. iOS学习——（转）iOS中关于通知的使用

    在移动端开打过程中,经常会用到通知和推送,例如有短信来了需要通知提示,手机横屏了需要通知提示,插上耳机了需要通知提示等等,我们可以根据这些通知采取对应的动作.iOS系统自身定义了很对通知,但是在开发过 ...

  4. python(leetcode)-14最长公共前缀

    编写一个函数来查找字符串数组中的最长公共前缀. 如果不存在公共前缀,返回空字符串 "". 示例 1: 输入: ["flower","flow" ...

  5. (转)db2top详解

    原文:https://blog.csdn.net/lyjiau/article/details/47804001 https://www.ibm.com/support/knowledgecenter ...

  6. [python]使用virtualenvWrapper

    什么是virtualenv virtualenv是python的环境管理工具,用于隔离python的运行环境.也就是说,一个项目可以有一个属于这个项目的运行环境,从而避免了因为依赖不同的模块而产生的错 ...

  7. priority_queue的用法

    priority_queue本质是一个堆. 1. 头文件是#include<queue> 2. 关于priority_queue中元素的比较 模板申明带3个参数:priority_queu ...

  8. secureCRT常见命令

    一.ls 只列出文件名 (相当于dir,dir也可以使用) -A:列出所有文件,包含隐藏文件. -l:列表形式,包含文件的绝大部分属性. -R:递归显示. --help:此命令的帮助. 二.cd 改变 ...

  9. Dubbo 入门之二 ——- 项目结构解析

    本文主要说明点 概述 背景 需求 架构 Dubbo源代码项目结构 概述 分享 Dubbo 的项目结构 ,通过本文可以大致了解到Dubbo整个项目的结构 背景 将一个项目进行拆分, 进行分布式架构. 需 ...

  10. The 2018 ACM-ICPC Asia Qingdao Regional Contest（部分题解）

    摘要: 本文是The 2018 ACM-ICPC Asia Qingdao Regional Contest(青岛现场赛)的部分解题报告,给出了出题率较高的几道题的题解,希望熟悉区域赛的题型,进而对其 ...