zoukankan      html  css  js  c++  java
  • 【JavaScript】Object 实例方法

    以下内容为学习记录,可以参考 MDN 原文。

    环境

    • node v12.18.1
    • npm 6.14.5
    • vscode 1.46
    • Microsoft Edge 83

    概念

    定义在 Object 实例上的方法,称为实例方法(instance method)。
    也是定义在 Object.prototype 原型对象上的方法。

    hasOwnProperty

    hasOwnProperty() 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性(也就是,是否有指定的键)。

    const object1 = {};
    object1.property1 = 42;
    
    console.log(object1.hasOwnProperty('property1'));
    // expected output: true
    
    console.log(object1.hasOwnProperty('toString'));
    // expected output: false
    
    console.log(object1.hasOwnProperty('hasOwnProperty'));
    // expected output: false
    

    isPrototypeOf

    isPrototypeOf() 方法用于测试一个对象是否存在于另一个对象的原型链上。

    function Foo() {}
    function Bar() {}
    function Baz() {}
    
    Bar.prototype = Object.create(Foo.prototype);
    Baz.prototype = Object.create(Bar.prototype);
    
    var baz = new Baz();
    
    console.log(Baz.prototype.isPrototypeOf(baz)); // true
    console.log(Bar.prototype.isPrototypeOf(baz)); // true
    console.log(Foo.prototype.isPrototypeOf(baz)); // true
    console.log(Object.prototype.isPrototypeOf(baz)); // true
    

    propertyIsEnumerable

    propertyIsEnumerable() 方法返回一个布尔值,表示指定的属性是否可枚举。

    const object1 = {};
    const array1 = [];
    object1.property1 = 42;
    array1[0] = 42;
    
    console.log(object1.propertyIsEnumerable('property1'));
    // expected output: true
    
    console.log(array1.propertyIsEnumerable(0));
    // expected output: true
    
    console.log(array1.propertyIsEnumerable('length'));
    // expected output: false
    

    toString

    toString() 方法返回一个表示该对象的字符串。
    toLocaleString 返回调用 toString() 的结果。

    function Dog(name) {
      this.name = name;
    }
    
    const dog1 = new Dog('Gabby');
    
    Dog.prototype.toString = function dogToString() {
      return `${this.name}`;
    };
    
    console.log(dog1.toString());
    // expected output: "Gabby"
    

    valueOf

    valueOf() 方法返回指定对象的原始值。

    // Array:返回数组对象本身
    var array = ["ABC", true, 12, -5];
    console.log(array.valueOf() === array);   // true
    
    // Date:当前时间距1970年1月1日午夜的毫秒数
    var date = new Date(2013, 7, 18, 23, 11, 59, 230);
    console.log(date.valueOf());   // 1376838719230
    
    // Number:返回数字值
    var num =  15.26540;
    console.log(num.valueOf());   // 15.2654
    
    // 布尔:返回布尔值true或false
    var bool = true;
    console.log(bool.valueOf() === bool);   // true
    
    // new一个Boolean对象
    var newBool = new Boolean(true);
    // valueOf()返回的是true,两者的值相等
    console.log(newBool.valueOf() == newBool);   // true
    // 但是不全等,两者类型不相等,前者是boolean类型,后者是object类型
    console.log(newBool.valueOf() === newBool);   // false
    
    // Function:返回函数本身
    function foo(){}
    console.log( foo.valueOf() === foo );   // true
    var foo2 =  new Function("x", "y", "return x + y;");
    console.log( foo2.valueOf() );
    /*
    ƒ anonymous(x,y
    ) {
    return x + y;
    }
    */
    
    // Object:返回对象本身
    var obj = {name: "张三", age: 18};
    console.log( obj.valueOf() === obj );   // true
    
    // String:返回字符串值
    var str = "http://www.xyz.com";
    console.log( str.valueOf() === str );   // true
    
    // new一个字符串对象
    var str2 = new String("http://www.xyz.com");
    // 两者的值相等,但不全等,因为类型不同,前者为string类型,后者为object类型
    console.log( str2.valueOf() === str2 );   // false
    
  • 相关阅读:
    java-Date类,DateFormat类,Calendar类
    vuex
    vue-router学习之二
    Vue-cli2.0
    ES6学习---箭头函数
    【学习】调用iframe中的方法
    【小技巧】只用css实现带小三角的对话框样式
    【转载】实现a元素href URL链接自动刷新或新窗口打开
    【转载】CSS filter:hue-rotate色调旋转滤镜实现按钮批量生产
    【小技巧】object上显示div
  • 原文地址:https://www.cnblogs.com/jiangbo44/p/13507083.html
Copyright © 2011-2022 走看看