欢迎访问 生活随笔!

生活随笔

当前位置: 首页 > 前端技术 > javascript >内容正文

javascript

js date转string_JS之你到底是什么类型?

发布时间:2024/9/18 javascript 43 豆豆
生活随笔 收集整理的这篇文章主要介绍了 js date转string_JS之你到底是什么类型? 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

我们都知道JS中包含两种数据类型:基本数据类型和引用数据类型。

基本数据类型:String、Number、Boolean、Null、Undefined、Symbol(ES6新增,表示独一无二的值)

引用数据类型:Object(包含Array、Function、Date、RegExp)

基本数据类型保存的值是直接存储在栈(stack)内存中,而引用数据类型存储在栈内存的是指向堆(heap)内存的引用(或者说指针,而真正的数据是保存在堆内存中的)

从一个变量向另一个变量复制基本数据类型时: 复制的是值本身

var number = 5; var number_copy = number; /*number和number_copy中的值是相互独立的,两个变量可以任意操作而不互相影响 */

从一个变量向另一个变量复制引用数据类型时:复制的是引用

var object = {name: 'ckn', age: 18}; var object_copy = object; object_copy.name = 'lxh'; /*复制的是引用,复制结束后,两个变量实际上引用的还是同一个对象修改其中任何一个变量,都会影响另外一个变量 */

我们在日常开发中会经常判断一个数据的类型,是数组类型还是对象类型还是undefined或者null这种特殊的类型

判断基本数据类型,我们可以使用 typeof 很容易得到基本数据类型是什么数据类型,null除外,因为一些js历史遗留问题,null被视为object

function log(target){return console.log(target); } log(typeof 110); // number log(typeof 'hello world'); // string log(typeof true); // boolean log(typeof undefined); // undefined log(typeof null); // object log(typeof {name: 'ckn', age: 18}); // object log(typeof [1,2,3,4]); // object 我们其实期望得到的是array log(typeof function() {log(1)}) // function // 我们可以通过 Array.isArray()来判断其是否是数组 // 或者我们也可以 instanceof 来判断属于哪一类对象 log([1,2,3,4] instanceof Array); // true

其实无论用typeof 还是 instanceof 或者是 Array.isArray判断数据的具体类型,都有一定的局限性,很繁琐。让人不禁想问就没有更通用的方法来一次就判断出该数据到底属于什么类型吗?

当然是有这样的方法了,请看下面的代码:

function log(target){return console.log(target); } function whatType(target){return Object.prototype.toString.call(target).slice(8, -1); } log(whatType(110)); // Number log(whatType('hello world')); // String log(whatType(true)); // Boolean log(whatType({name: 'ckn',age: 18})); // Object log(whatType([1,2,3,4])); // Array log(whatType(function(){log(1)})); // Function log(whatType(undefined)); // Undefined log(whatType(null)); // Null log(whatType(/z-Z/)); RegExp log(whatType(new Date())); // Date

我一开始很不理解为什么调用Object.prototype.toString方法就可以得到某个数据的具体类型,我们来先看下Object.prototype.toString方法 :

MDN :每个对象都有一个toString()方法,当该对象被表示为一个文本值时,或者一个对象以预期的字符串方式引用时自动调用。默认情况下,toString()方法被每个Object对象继承。如果此方法在自定义对象中未被覆盖,toString() 返回 "[object type]",其中type是对象的类型。let obj = {name: 'ckn', age: 18} /*obj是Object构造函数的实例对象 obj.toString方法是继承自Objectconsole.log(obj.toString === Object.prototype.toString); true */ console.log(obj.toString()); // 这个很重要 它打印出的是[object Object] /*arr是Array构造函数的实例对象 arr.toString方法是继承自Arrayconsole.log(arr.toString === Array.prototype.toString); true */ let arr = [1,2,3]; console.log(array.toString()); // "1,2,3,4" 字符串形式 /*bar是Function构造函数的实例对象 bar.toString方法是继承自Functionconsole.log(bar.toString === Function.prototype.toString); true */ let bar = function() { console.log('hello world') } console.log(bar.toString()); // "function() { console.log('hello world') }"// 其实根据MDN的解释,我们还可以自定义obj的toString方法 这样就不会继承来自Object的toString方法了 obj.prototype.toString = function toStringSelf() {return `your name is ${this.name}, your age is ${this.age}` } obj.toString(); // your name is ckn, your age is 18/* console.log(bar.toString); ƒ (){return"function"==typeof this&&this.__raven__?t._originalFunctionToString.apply(this.__orig__,arguments):t._originalFunctionToString.apply(this,arguments)} */

我们知道了Object对象的toString方法调用后可以打印出 "[object Object]" 这个奇怪的东西,Array对象的toString方法调用后是得到字符串形式的每项的值,Function对象的toString方法调用后得到的是该函数对象的整体语句内容和结构

接下来我们分析:

Object.prototype.toString.call(target)

我们知道call方法可以修改函数执行时的上下文对象this指向,此时Object.prototype.toString方法内部的this指的就是传进来的target对象

通过上面的分析,我们发现toString方法除了Object内部实现了,Array、Function、String、Number、Boolean、RegExp、Symbol等构造函数都对其进行了实现 (在各自原型上都有toString方法的实现)

其中有区别的是: Function、Number、String、Date的toString方法规定了函数内部的this指向必须分别是function、number、string、date类型,否则将会报错,例如:

Function.prototype.toString.call({name:'ckn', age:18}); // Uncaught TypeError:Function.prototype.toString requires that 'this' be a FunctionFunction.prototype.toString.call(function() {}); // "function() {}"Number.prototype.toString.call({name:'ckn', age:18}); // Uncaught TypeError:Number.prototype.toString requires that 'this' be a Number Number.prototype.toString.call(101); // "101"

而Array的toString方法内部并没有明确规定函数内部this指向必须是数组类型,可以是任意类型,是数组类型的时候返回的是遍历数组的每一项然后调用toString方法的返回值,但当是null和undefined的时候则会报错

Array.prototype.toString.call(function(){}); // "[object Function]" Array.prototype.toString.call({name: 'ckn',age: 18}); // "[object Object]" Array.prototype.toString.call(new Date); // "[object Date]" Array.prototype.toString.call([1,function(){},{}]); // "1,function(){},[object Object]"Array.prototype.toString.call(undefiend); // Uncaught TypeError: Cannot convert undefined or null to objectArray.prototype.toString.call(null); // Uncaught TypeError: Cannot convert undefined or null to object

同样Obiect的toString方法内部也没有明确规定函数内部this指向必须是对象类型,可以是任意数据类型,而且当是null和undefined时也不会报错

Object.prototype.toString.call(undefined); // "[object Undefined]" Object.prototype.toString.call(null); // "[object Null]"Object.prototype.toString.call(function(){}); // "[object Function]" Object.prototype.toString.call({name: 'ckn',age: 18}); // "[object Object]" Object.prototype.toString.call(new Date); // "[object Date]" Object.prototype.toString.call([1,function(){},{}]); // "[object Array]" Object.prototype.toString.call(/z-Z/); // "[object RegExp]"

ok,到此我们发现了Object的toString方法最牛掰,可以分辨出任何数据类型

function whatType(target) {reutnr Object.prototype.toString.call(target).slice(8, -1); }

总结

以上是生活随笔为你收集整理的js date转string_JS之你到底是什么类型?的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。