无法读取JavaScript对象的属性

时间:2014-05-10 00:23:02

标签: javascript object properties

我的属性读取值无法正常工作。它将对象名称作为字符串替换为对象的属性。

我正在尝试创建对象并基于对象名称设置其属性。

然后我只是想看看属性但是使用循环。 方法" this.propertyname"工作正常。

    function bulding(buildingType)
{  
    console.log("In main function");
    this.room=2;
    this.clr = "green";
    this.scrn = null ;

    getType();

    function getType()
    {  console.log("In control function");
        switch(buildingType){
            case "home":
            setBuildingas(2,"green",null);
            break;

            case "office":
            setBuildingas(20,"white",null);
            break;

            case "mall":
            setBuildingas(200,"asorted",null);
            break;

            case "theater":
            setBuildingas(20,"white","78cm");
            break;

            default:
            console.log("Please Enter Valid Type");
            break;

        }
    }

    function setBuildingas(noOfRooms,buldingColor,theaterScreen){
        this.room=noOfRooms;
        this.clr=buldingColor;
        this.scrn=theaterScreen;
        valueGetter(buildingType);

    }


}

function valueGetter(obj){
  for(var key in obj)
  {     
    console.log(key + " has value of "+obj[key]);       


  }
} 


console.log("In Script");

var house = new bulding("home");

var house2 = new bulding("mall");

var house3 = new bulding("theater");

基本上是功能价值.Getter并没有给出我所有财产价值的愿望

2 个答案:

答案 0 :(得分:0)

我修改了你的答案,结果如下:

    function bulding(buildingType)
{  
    console.log("In main function");
// Need to declare "this" in global scope (this in function setBuildingas is already something else!)
    var me = this;
// Set everything to variable "me"
    me.room=2;
    me.clr = "green";
    me.scrn = null ;

    getType();

    function getType()
    {  console.log("In control function");
        switch(buildingType){
            case "home":
            setBuildingas(2,"green",null);
            break;

            case "office":
            setBuildingas(20,"white",null);
            break;

            case "mall":
            setBuildingas(200,"asorted",null);
            break;

            case "theater":
            setBuildingas(20,"white","78cm");
            break;

            default:
            console.log("Please Enter Valid Type");
            break;

        }
    }

    function setBuildingas(noOfRooms,buldingColor,theaterScreen){
        me.room=noOfRooms;
        me.clr=buldingColor;
        me.scrn=theaterScreen;
// Call the valueGetter with the local object "me"
        valueGetter(me);

    }


}

function valueGetter(obj){
  for(var key in obj)
  {     
    console.log(key + " has value of "+obj[key]);       


  }
} 


console.log("In Script");

var house = new bulding("home");

var house2 = new bulding("mall");

var house3 = new bulding("theater");

另外,请参阅jsFiddle:http://jsfiddle.net/yWF9B/

答案 1 :(得分:0)

使用ECMA5 Function.prototype.bind

的示例

(和其他一些ECMA5方法只是为了好玩)

了解this关键字。

的Javascript

// Moved here because I like defining things before they are used.
function valueGetter(obj) {
    // Using ECMA5 methods instead, just example
    Object.keys(obj).forEach(function (key) {
        console.log(key + " has value of " + this[key]);
    }, obj);
}

// I like constructors to begin with a capital letter
function Bulding(buildingType) {
    console.log("In main function");
    // Changed to function expression and removed name from function
    var setBuildingas = (function (noOfRooms, buldingColor, theaterScreen) {
        this.room = noOfRooms;
        this.clr = buldingColor;
        this.scrn = theaterScreen;
        // I guess you want to see the contents of 'this' rather than 'buildingType'
        console.log(buildingType);
        valueGetter(this);
    }).bind(this); // added the bind

    this.room = 2;
    this.clr = "green";
    this.scrn = null;
    getType();

    function getType() {
        console.log("In control function");
        switch (buildingType) {
            case "home":
                setBuildingas(2, "green", null);
                break;
            case "office":
                setBuildingas(20, "white", null);
                break;
            case "mall":
                setBuildingas(200, "asorted", null);
                break;
            case "theater":
                setBuildingas(20, "white", "78cm");
                break;
            default:
                console.log("Please Enter Valid Type");
                break;
        }
    }
}

console.log("In Script");
// I like one 'var'
var house = new Bulding("home"),
    house2 = new Bulding("mall"),
    house3 = new Bulding("theater");

输出

In Script
In main function
In control function
home
room has value of 2
clr has value of green
scrn has value of null
In main function
In control function
mall
room has value of 200
clr has value of asorted
scrn has value of null
In main function
In control function
theater
room has value of 20
clr has value of white
scrn has value of 78cm 

jsFiddle

另一种选择是去OO并创建一个prototype

的Javascript

// Moved here because I like defining things before they are used.
function valueGetter(obj) {
    // Using ECMA5 methods instead, just example
    Object.keys(obj).forEach(function (key) {
        console.log(key + " has value of " + this[key]);
    }, obj);
}

// I like constructors to begin with a capital letter
function Building(buildingType) {
    console.log("In main function");    
    this.room = 2;
    this.clr = "green";
    this.scrn = null;
    this.buildingType = buildingType;
    this.getType();
}

Building.prototype = {
    setBuildingas: function (noOfRooms, buldingColor, theaterScreen) {
        this.room = noOfRooms;
        this.clr = buldingColor;
        this.scrn = theaterScreen;
        // I guess you want to see the contents of 'this' rather than 'buildingType'
        console.log(this.buildingType);
        valueGetter(this);

        return this;
    },

    getType: function () {
        console.log("In control function");
        switch (this.buildingType) {
            case "home":
                this.setBuildingas(2, "green", null);
                break;
            case "office":
                this.setBuildingas(20, "white", null);
                break;
            case "mall":
                this.setBuildingas(200, "asorted", null);
                break;
            case "theater":
                this.setBuildingas(20, "white", "78cm");
                break;
            default:
                console.log("Please Enter Valid Type");
        }

        return this;
    }
};

console.log("In Script");
// I like one 'var'
var house = new Building("home"),
    house2 = new Building("mall"),
    house3 = new Building("theater");

jsFiddle

不在ECMA5环境中,MDN上有可用的填充程序,或者您可以使用ES5 shim库。或.bind的功能等价物存在于许多现代JavaScript库中。

例如

  1. lodash / underscore,_.bind()
  2. jQuery.proxy
  3. dojo.hitch
  4. 您也可以使用closure来避免此问题,甚至callapply

    R.Waldron的

    idiomatic.js 6B

      

    作为最后的手段,使用this创建self的别名   标识符。这非常容易出错,每当应该避免   可能的。