Object.prototype.valueOf()和Object.prototype.toString()

valueOf() 方法用来把对象转换成原始类型的值(数值、字符串和布尔值)

toString() 方法返回一个表示该对象的字符串。

  • 原始类型
Number
String
Boolean
Undefined
Null
  • String类型转换
  1. 如果 toString 方法存在并且返回原始类型,返回 toString 的结果。
  2. 如果 toString 方法不存在或者返回的不是原始类型,调用 valueOf 方法,如果 valueOf 方法存在,并且返回原始类型数据,返回 valueOf 的结果。
  3. 其他情况,抛出错误。
var obj = {name: ‘Coco‘};
var str = ‘123‘ + obj;
console.log(str);  // 123[object Object]

上面的代码等价于:

var obj = {name: ‘Coco‘};
var str = ‘123‘ + obj.toString();

假设是数组:

var arr = [1, 2];
var str = ‘123‘ + arr;
console.log(str); // 1231,2

上面 + arr ,由于这里是个字符串加操作,后面的 arr 需要转化为一个字符串类型,所以其实是调用了 + arr.toString() 。

但是,对象的toString和valueOf方法可以自己改写:

var obj = {
    toString: function() {
        console.log(‘调用了 obj.toString‘);
        return {};
    },
    valueOf: function() {
        console.log(‘调用了 obj.valueOf‘)
        return ‘110‘;
    }
}

alert(obj);
// 调用了 obj.toString(toString方法没有返回原始类型,接着调用valueOf方法)
// 调用了 obj.valueOf
// 110

如果valueOf方法也不返回原始类型的话,就会出现下面的情况:

var obj = {
    toString: function() {
        console.log(‘调用了 obj.toString‘);
        return {};
    },
    valueOf: function() {
        console.log(‘调用了 obj.valueOf‘)
        return {};
    }
}

alert(obj);
// 调用了 obj.toString
// 调用了 obj.valueOf
// Uncaught TypeError: Cannot convert object to primitive value
  • Number类型转换
  1. 如果 valueOf 存在,且返回原始类型数据,返回 valueOf 的结果。
  2. 如果 toString 存在,且返回原始类型数据,返回 toString 的结果。
  3. 其他情况,抛出错误。
var obj = {
    valueOf: function() {
        console.log(‘调用 valueOf‘);
        return 5;
    }
}

console.log(obj + 1);
// 调用 valueOf
// 6
var obj = {
    valueOf: function() {
        console.log(‘调用 valueOf‘);
        return {};
    },
    toString: function() {
        console.log(‘调用 toString‘);
        return 10;
    }
}

console.log(obj + 1);
// 调用 valueOf
// 调用 toString
// 11
var obj = {
    valueOf: function() {
        console.log(‘调用 valueOf‘);
        return {};
    },
    toString: function() {
        console.log(‘调用 toString‘);
        return {};
    }
}

console.log(obj + 1);
// 调用 valueOf
// 调用 toString
// Uncaught TypeError: Cannot convert object to primitive value
  • Boolean类型转换

什么时候会进行布尔转换呢:

  1. 布尔比较时
  2. if(obj) , while(obj) 等判断时
简单来说,除了下述 6 个值转换结果为 false,其他全部为 true:

undefined
null
-0
0或+0
NaN
”(空字符串)
Boolean(undefined) // false
Boolean(null) // false
Boolean(0) // false
Boolean(NaN) // false
Boolean(‘‘) // false
  • Function转换
function test() {
    var a = 1;
    console.log(1);
}
test; // 这里其实自行调用了函数的valueOf方法
function test() {
    var a = 1;
    console.log(1);
}
test.valueOf = function() {
    console.log(‘调用 valueOf 方法‘);
    return 2;
}

test;
// 输出如下:
// 调用 valueOf 方法
// 2
test.valueOf = function() {
    console.log(‘调用 valueOf 方法‘);
    return {};
}

test.toString= function() {
    console.log(‘调用 toString 方法‘);
    return 3;
}

test;
// 输出如下:
// 调用 valueOf 方法(不是返回的原始类型,继续寻找toString方法进行调用)
// 调用 toString 方法
// 3
function add () {
    console.log(‘进入add‘);
    var args = Array.prototype.slice.call(arguments);

    var fn = function () {
        var arg_fn = Array.prototype.slice.call(arguments);
        console.log(‘调用fn‘);
        return add.apply(null, args.concat(arg_fn));
    }

    // 此处的valueOf方法也能换成toString方法
    fn.valueOf = function () {
        console.log(‘调用valueOf‘);
        return args.reduce(function(a, b) {
            return a + b;
        })
    }

    return fn;
}

add(1)(2)(3);
// 输出如下:
// 进入add
// 调用fn
// 进入add
// 调用fn
// 进入add
// 调用valueOf
// 6
// 前面都是合并参数,到最后返回fn函数,此时才调用fn.valueOf方法

(转自微信公众号:前端大全)

时间: 2024-11-02 23:36:33

Object.prototype.valueOf()和Object.prototype.toString()的相关文章

Object.prototype.__proto__ 、Object.prototype和 Object.prototype.constructor

Object.prototype.__proto__: 实体对象指向造它的构造函数的 prototype属性所指 的对象 ,实例的__proto__是引用构造函数的prototype属性所指对象, Object.prototype : js规定,构造函数有prototype 属性,指向一个对象,这个对象一般就是构造函数的公有成员. 所以 __proto__  和 prototype 可以指向同一个对象  {key1:value1,key2:value2,......},构造函数的私有和特权函数会

instanceof,Object.getPrototypeOf(),Object.create(),Object.setPrototypeOf(),Object.prototype.isPrototypeOf(),Object.prototype.__proto__

一.instanceof instanceof运算符返回一个布尔值,表示指定对象是否为某个构造函数的实例 var v = new Vehicle(); v instanceof Vehicle // true instanceof对整个原型链上的对象都有效,因此同一个实例对象,可能会对多个构造函数都返回true var d = new Date(); d instanceof Date // true d instanceof Object // true 利用instanceof运算符,还可以

Object.create()和new object()和{}的区别

Object.create()介绍Object.create(null) 创建的对象是一个空对象,在该对象上没有继承 Object.prototype 原型链上的属性或者方法,例如:toString(), hasOwnProperty()等方法 Object.create()方法接受两个参数:Object.create(obj,propertiesObject) ; obj:一个对象,应该是新创建的对象的原型. propertiesObject:可选.该参数对象是一组属性与值,该对象的属性名称将

Object.create(null)、Object.create({})、{} 三者创建对象的区别

参考 1.先看看我们经常使用的{}创建的对象是什么样子的: var o = {a:1}; console.log(o) 从上图可以看到,新创建的对象继承了Object自身的方法,如hasOwnProperty.toString等,在新对象上可以直接使用. 2.再看看使用Object.create()创建对象: var o = Object.create(null,{ a:{ writable:true, configurable:true, value:'1' } }) console.log(

How to cast List<Object> to List<MyClass> Object集合转换成实体集合

List<Object> list = getList(); return (List<Customer>) list; Compiler says: cannot cast List<Object> to List<Customer> 不能将Object集合强制转换成实体集合! you can always cast any object to any type by up-casting it to Object first. in your case:

ES5 对象的扩展(Object.preventExtensions)、密封(Object.seal)和冻结(Object.freeze)

前面提到 ES5 对象属性描述符,这篇看看对象的扩展.密封和冻结. 扩展对象 Object.preventExtensions Object.isExtensible 密封对象 Object.seal Object.isSealed 冻结对象 Object.freeze Object.isFrozen 1. Object.preventExtensions 阻止对象扩展,让一个对象变的不可扩展,也就是永远不能再添加新的属性 ES3 是没有办法阻止对象扩展的,定义对象后可以给对象添加任意属性,如

Intent.putExtra()传递Object对象或者ArrayList&lt;Object&gt; (转)

Intent传递基本类型相信大家都十分熟悉,如何传递Object对象或者ArrayList<Object>对象呢? 可以通过: (1)public Intent putExtra (String name, Serializable value) (2)public Intent putExtra (String name, Parcelable value) public Intent putParcelableArrayListExtra(String name, ArrayList<

ValueOf()和toString()

var colors = ["red", "blue", "green"]; // 创建一个包含3 个字符串的数组 console.log(colors.toString()); // red,blue,green console.log(colors.valueOf()); // red,blue,green console.log(colors); // red,blue,green /*valueOf和toString方法区别*/ var

js函数使用prototype和不适用prototype的区别

js中类定义函数时用prototype与不用的区别 原创 2017年06月05日 12:25:41 标签: 函数 / prototype / class 首先来看一个实例: function ListCommon2(first,second,third) { this.First=function () { alert("first do"+first); } } //不加prototype的情况 ListCommon2.do1=function(first) { // this.Fi