ECMAScript (Objekte)

An welchen Objekt-Kontext wird this gebunden?

<script>
var name = "aussen", 
    obj0 = {
        name : "innen",
        getName : function() {
           return function() { return this.name; };
        }
    }, 
    x = obj0.name,
    y = obj0.getName()();
</script>

Nachfolgend sind 2 Beispiele ( Methoden a, b ): Die Ergebnisse werden in den Array sum geschrieben. Bei der Methode a wird eine globale Funktion Fn() definiert, die eine inneren this.add - Funktion hat. Bei der Methode b wird ein Objekt r3 angelegt. Das Objekt r4 erbt r3. Richtige Antworten bitte ankreuzen.

var r1, r2, r3, r4, sum = [ ];

// Methode a:
function Fn(a, b){ this.a = a; this.b = b;
  this.add = function() { return this.a + this.b; };
}
r1 = new Fn(4,1);  
r2 = new Fn(47,11);
sum[1] = r1.add(); sum[2] = r2.add();

// Methode b:
var r3 = {a:4, b:1, add:function(){return this.a + this.b;}}; 
r4 = Object.create(r3); 
r4.a = 47; 
r4.b = 11; sum[3] = r3.add(); sum[4] = r4.add();

Es geht um das nachfolgend deklarierte Objekt-Literal obj, das fünf key-value-Paare (Properties) hat. Es gibt die key's a, 'd', add, s, x. Die zugehörigen Werte sind in der obj-Deklaration ersichtlich. Ein Zugriff auf den Wert des obj-key a erfolgt mit obj.a

<script>
var obj = { 
  a:  'A',
 'd': '64',
 add: function(x, y) { var r = x + y; return r; },
 s:'',
 x: 12
}; 

var v1 = obj.add(4,40);
var v2 = window.parseInt(obj.d, 16);
var v3 = v1 + v2; 
var v4 = obj.add(v3/obj.x,obj.add(-2,-6));

document.write('v1='+v1+
  '<br \/>v2='+v2+
  '<br \/>v3='+v3+
  '<br \/>v4='+v4
);
</script>

Es geht um die Funkton extend_obj(), die als Parameter mehrere Objekte haben kann. In das erste (Parameter-) Objekt werden die key-value-Paare der nachfolgenden Objekte geschrieben. Unten sind zu extend_obj() mehrere Test-Aufrufe angegeben. Bitte richtige Aussagen ankreuzen.

<script>
function extend_obj(){ 
  var i, key, a = arguments;
  for( i=1; i < a.length; i += 1 ) {
    for( key in a[i] ){
      if( a[i].hasOwnProperty(key) ) {
          a[0][key] = a[i][key];
      }
     }
  } return a[0];
}

var obj1 = extend_obj( {      },  { a:"A" } ); 
var obj2 = extend_obj( { bb: 22 },  { "22": "CC",  dd:"DD" } ); 
var obj3 = extend_obj( Object.create(null), {eee:"EEE", fff:333} ); 
</script>

Es geht um objekt-gebundene Namespaces. Die folgenden Funktionen "fn_..." beziehen sich auf unterschiedliche Objekte. Richtige Antworten bitte ankreuzen

this.str = "this (Window-Namespace)";/*this.str*/

var arr = [ ], 
    str = "this ( glob Window-Objekt )";

arr.push( this.str );                /* 1 */ 

var modul = { // modul mit inneren Variablen
   str: "this ( Modul-Objekt )",
   fn: function() { return this.str; }
};

arr.push( modul.fn() );              /* 2  */ 

var fn_von_modul = modul.fn;
arr.push( fn_von_modul() );          /* 3 */ 

var fn_gebunden_an_modul = modul.fn.bind(modul);
arr.push( fn_gebunden_an_modul() );  /* 4 */ 

// Anzeige: alert( arr.join("\n") );

Es geht um unterschiedliche Möglichkeit, wie nachfolgend deklarierte Objekt-Literale und Property-Zugriffe geschrieben werden können. Richtige Antworten bitte ankreuzen.

<script>
/*1*/ var add = function (x, y) { var r = x + y; return r; };

/*2*/ function mul (x, y) { var r = x * y; return r; }

/*3*/ 
var myobj = { };
    myobj.add = add;
    myobj.mul = mul;

/*4*/
var obj = { add: function(x, y) { var r = x + y; return r; },
            sub: function(x, y) { var r = x - y; return r; }
          };
/*5*/
var wert2 = add(1,1), wert6 = myobj.add(3,3), wert8 = obj.add(4,4);
/*6*/
var sum_num    =       wert2 + wert6 + wert8;
var sum_string = " " + wert2 + wert6 + wert8;
document.write(sum_num + sum_string);
</script>

Es werden die Property-Werte eines Objekt-Literals obj werden in den Array arr 'gepushed' und mit arr.join(separator-String) zu einem String verkettet. Bitte richtige Aussagen ankreuzen.

<div id="my_test_div">/*1*/</div>
<script>
/*2*/ 
var ss = '',
  obj = { a:'A', 
         'b': 'B', 
         'c-char': 'C', 
         '1': 123
  }, arr = [ ]; 
/*3*/ 
    arr.push(obj.a);
    arr.push(obj.b);
    arr.push(obj['a']);
    arr.push(obj['c-char']); 
    ss = arr.join(' | ');

window.onload = function() { /*4*/ 
  document.getElementById('my_test_div').innerHTML = ss;
};
</script>

An welchen Objekt-Kontext wird this gebunden?

<script>
var name = "aussen", 
    obj1 = {
        name : "innen",
        getName : function() { var that = this;
           return function() { return that.name; };
        }
    }, 
    x = obj1.name, 
    y = obj1.getName()();
</script>

Bei ECMAScript ist this ein Schlüsselwort. An welches Objekt ist in einer HTML-Seite this gebunden, wenn die funktion setze_gelb()

<body>
 <script>
 function setze_gelb() { 
   this.document.body.style.backgroundColor = '#cc0'; 
 }
 setze_gelb();
 </script>
</body>

im globalen body-Bereich der Seite steht? Richtige Aussagen bitte ankreuzen.

Das folgende Objekt obj hat die Properties add1, add2, add3.
Die Funktion add1 verwendet this.x,
die Funktion add2 verwendet obj.x,
die Funktion add3 verwendet x.
Welche Aussagen sind richtig?

<script>
var obj = {  
    add1: function(num) { 
            this.x += num; 
            this.arr.push(this.x); return this; },
    add2: function(num) { 
            obj.x += num; 
            obj.arr.push(obj.x); return obj; },

    add3: function(num) { 
            try { x += num; 
            } catch(e) { this.arr.push(e); 
            } return obj; }, 
    x: 4711, arr:[ ]
}; 

obj.add1(-4700).add2(-2).add3(-2);

document.write(  obj.arr.join('<br />') );
</script>

11
9
ReferenceError: Undefined variable: x

Die folgende Funktion arr_to_obj() gibt ein Objekt zurück. Richtige Antworten bitte ankreuzen.

<script>
function arr_to_obj(arr, val) {
  var i, a, obj = {};
  for(i = 0; a = arr[i]; i += 1){
    obj[a] =   val + '=' +a;
  } return obj;
}

var obj = arr_to_obj(['0', 'a', "2", 1, 0], "key");

</script>

Das folgende Codefragment ist zu durchdenken. Welche Aussagen sind richtig?

<script>
function test(obj) {
  return (obj && obj.length === +obj.length);
}

var a = [ ];
a.push( test( [ 0, 1, 2, 3, 4 ] ));
a.push( test( "abcdefghijklmno" ));
a.push( test( { a:'A', b:'B' }  ));
a.push( test(   123456789       ));
a.push( test(   document        ));
alert('erg1 = [' + a.join(', ') + '];' );

a[0] = test( [ 0, 1, 2, 3, 4 ] );
a[1] = test( "abcdefghijklmno" );
a[2] = test( { a:'A', b:'B' }  );
a[3] = test(   123456789       );
a[4] = test(   document        );
alert('erg2 = [' + a.join(', ') + '];' );
</script>

Es geht um ein Objekt erde, das den Erd-Radius und Formeln zur Berechnung des Erd-Umfanges enthält.

<script>
var erde = { 
  radius          :  6373,
  umfang_return   : 'return ( 2*r*Math.PI ).toFixed( 1 )',
  umfang_new_fn   : new Function( 'r', 'return ( 2*r*Math.PI ).toFixed( 1 );'),
  umfang_anonym_fn: function( r ) {return ( 2*r*Math.PI ).toFixed( 1 );}
};
/* 1 */
</script>

Hier geht es um 2 unterschiedliche Möglichkeiten, ein Objekt von einem Objekt zu erben. Die obere Form verwendet .prototype und new und die nachfolgende Form verwendet Object.create(). Beide Formen sind zu durchdenken. Achtung! Bitte groß O bzw. klein o bei Obj0 bzw obj0 unterscheiden. Richtige Antworten bitte ankreuzen.

<script>
//=== ECMAScript 3.x mit .prototype und new: 
var Obj0 = function ( ) { };
    Obj0.prototype = { wert: null, 
         set_wert: function (wert) { this.wert = wert; }
    };
var Obj1 = function ( ) { }; Obj1.prototype = new Obj0( );
var Obj1 = new Obj1( );      Obj1.set_wert(4711);

//=== uebersichtlicher mit Object.create():
var obj0 = Object.create({ wert: null,
             set_wert: function(wert){ this.wert = wert; }
           });
var obj1 = Object.create( obj0 ); obj1.set_wert(4712);
</script>

Nachfolgend wird eine eigene Funktion Object.my_keys(obj) betrachtet, die für das Argument obj ein einfaches Daten-Objekt, wie z.B. { a : "A", 'b' : "B"} verwenden kann.

<script>
if(!Object.my_keys) {
  Object.my_keys = (function(o) { 'use strict';
    return function (o) { var r = [ ], p;
      for (p in o) {
        if( o.hasOwnProperty(p) ) { 
            r.push(p);// +' '+typeof p); 
        }
    } return r;
  };
}());
}
var r = [ ],
  obj = { 65 : "A0",  'b' : "B1",  "" : "C2" },
  arr = [      "u0",        "v1",       "w2" ];
</script>

Hinweis zu ECMAScript 5. ECMAScript 5 kennt die Funktion Object.keys( ), die die Key-Strings als Array zurück gibt. Object.keys( ) ist bei älteren Browsern nicht verfügbar. [mehr]

Die Strings str1 str2 sollen in die Objekte gaia1, gaia2 umgewandelt werden. Zum Testen werden hierzu JSON.parse() und eval() verwendet. Bitte sorgsam durchdenken. Richtige Antworten ankreuzen.

<script>
var str1 = '{"radius":6373,"umfang_return":"return (2*r*Math.PI).toFixed(1)"}',
    str2 = '{"radius":"6373","umfang_return":"return (2*r*Math.PI).toFixed(1);"}',
    str3 = '{radius:6373,umfang_anonym_fn:function(r){return (2*r*Math.PI).toFixed(1);} }',
    a = 3, b = "4", c = a * b, werte, typs,
 
    gaia1 = JSON.parse(str1),
    gaia2 = JSON.parse(str2),
    gaia3 = eval("(" + str3 + ")"), 

    fn1 = new Function("r",gaia1["umfang_return"]), 
    fn2 = new Function("r",gaia2["umfang_return"]),
    fn3 = gaia3['umfang_anonym_fn'];//,

  werte = [  a * b, 
             gaia1.radius, 
             gaia2['radius'],
            +gaia2.radius  ]; 

  typs = [ typeof  gaia1.radius, 
           typeof  gaia2['radius'], 
           typeof +gaia2['radius'] ],

  fn_werte = [ fn1(gaia1['radius']), 
               fn2(gaia2['radius']), 
               fn3(gaia3['radius'])  ]; /* 1 */
</script>