webForumDet fria alternativet

förklaring till koden, tack

7 svar · 358 visningar · startad av plelkes

plelkesMedlem sedan mars 2002823 inlägg
#1

Snälla Jojoxx eller andra js guru:
skulle ni kunna - så grundligt och pedagogiskt som möjligt - förklara koden på http://www.jojoxx.net/jscript/archive/show.asp?id=107

nitro2k01Medlem sedan aug. 20039 342 inlägg
#2
 
<h4>Konvertera längder</h4>
<style type="text/css">
.convert { font-family: Arial; font-size:12px; border: solid gray 1px; }
#convert_ab { border: dotted gray 1px; text-align:center; }
#convert_a {  }
#convert_b {  }
</style>
<form name="convertform">
<table class="convert"><tr>
<td id="convert_a"><input type="text" name="a" style="width:150px;"><select name="aenhet"></select></td>
<td id="convert_ab">Konvertera<br/><input type="button" value="&lt;&lt;" onclick="convert('b','a');"> <input type="button" value="&gt;&gt;" onclick="convert('a','b');"></td>
<td id="convert_b"><input type="text" name="b" style="width:150px;"><select name="benhet"></select></td>
</tr></table>
</form>
<script type="text/javascript">
/* Referera obj till document.convertform. Från och med nu kan
 * obj användas istället för document.convertform */
obj=document.convertform;
/* Deklaration av en array 
 * Läs först [url=http://www.webforum.nu/showthread.php?s=&postid=856744#post856744]detta[/url] om arrayer.
 * Detta är en deklaration av en array som är likvärdigt med:
 * var lengths = [];
 *  lengths["meter"] = 1;
 *  lengths["kilometer"] = 1000;
 *  lengths["mil"] = 1000000;
 * osv...
 * lengths innehåller längdfaktorer som används för att 
 * konvertera mellan dem.
 */
var lengths={
meter:1,
kilometer:1000,
mil:1000000,
fot:0.3048,
tum:0.0254,
millimeter:0.001,
mikrometer:0.000001,
mile:1609,
yard:0.9144
}
// Skapa en ny array
var a=new Array();
// Gå igenom varje element n i lengths
for(var n in lengths){
   /* Metoden a[a.length]= vadsomhelst;
    * .length har här ingenting att gör med lengths utan .length visar 
    * bara längden på en array
    * används för att lägga till et element i slutet av en array.
    * Här läggs namnet på varje enhet till a */
   a[a.length]=n 
}

// Sortera a och gå igenom varje element.
for(var n in a.sort()){
   // Lägg till element i de båda optionlistorna.
   obj.aenhet[obj.aenhet.length]=new Option(a[n],a[n]); 
   obj.benhet[obj.benhet.length]=new Option(a[n],a[n]);
   // Se till att markera meter som default i optionlistan.
   if(a[n]=='meter'){ 
      obj.aenhet.selectedIndex=obj.benhet.selectedIndex=n; 
   }
}

/* Konvertera mätetalet i den inputbox vars namn finns i 
 * variabel a till enheten i dropdownlistan vars namn finns 
 * i variabel b */
function convert(a,b){
   /* Kolla värdet i inputbox a evalueras till NaN (Not a number)
    * Gör det det så är det inget nummer. */
   if(isNaN(parseFloat(obj[a].value))){ 
      // Gör det det, så lämna rutinen.
      return; 
   }
   // Sätt inputbox b till...
   obj[b].value=
   // talet i a gånger...
   parseFloat(obj[a].value)*
   // faktorn för längden i...
   lengths[
   // dropdownen med namn i variablen a...
   obj[a+'enhet']
   // och det valda elementet, som fås med hjälp av index...
   [obj[a+'enhet'].selectedIndex].value]/
   // Och dela med faktrn för destinationsenheten.
   lengths[obj[b+'enhet'][obj[b+'enhet'].selectedIndex].value];
}
</script>

Så förväntar jag mig ett tack och ett accepterat svar! :e

dectgapMedlem sedan sep. 20021 655 inlägg
#3

nitro2k01 skrev:

/* Referera obj till document.convertform. Från och med nu kan
 * obj användas istället för document.convertform */
obj=document.convertform;
/* Deklaration av en array 
 * Läs först detta om arrayer.
 * Detta är en deklaration av en array som är likvärdigt med:
 * var lengths = [];
 *  lengths["meter"] = 1;
 *  lengths["kilometer"] = 1000;
 *  lengths["mil"] = 1000000;
 * osv...
 * lengths innehåller längdfaktorer som används för att 
 * konvertera mellan dem.
 */
var lengths={
meter:1,
kilometer:1000,
mil:1000000,
fot:0.3048,
tum:0.0254,
millimeter:0.001,
mikrometer:0.000001,
mile:1609,
yard:0.9144
}

Även om det i praktiken inte spelar så stor roll, så är lengths inte en array utan ett objekt a typen Object. Man kan därför t ex inte använda array-metoder på lengths.

Jämför

var o = {}; // var o = new Object();
o.push("abc");

med

var o = []; // var o = new Array();
o.push("abc");

Eftersom push() är en metod till Array, inte Object, blir det första exemplet fel.

nitro2k01Medlem sedan aug. 20039 342 inlägg
#4

Tänkte jag faktiskt inte på...
Lustigt, när jag skrev förklaringen ovan, så funderade jag faktiskt på hur jag skulle skriva en egen stack-rutin, eftersom jag inte visste att man kunde kunde push'a och pop'a på en Array. Stort tack dectgap!

plelkesMedlem sedan mars 2002823 inlägg
#5

jätte tack för svaren :h Men har ytterligare frågor:
Hittade denna lösning med

<head>
<title>General Unit Conversion</title>
</head>
<body topmargin="0" bottommargin="0" rightmargin="0" leftmargin="0"><div align="center">
<table><tr><td><img src="img/cover_small.gif" align="middle" /></td><td><h2 align="left">Length Converter</h2></td></tr></table>
<form name="1"><div bgcolor="#BBBBBB"><span color="blue"><b>INPUT :</b></span> <input type="text" size="8" name="inp" /></div><br /><div align="right"><input type="button" value="Convert" name="button2" onclick="form.out.value= form.inp.value*form.unit.value" />
    <select name="select">
      <option value="0.3937" selected="1">centimeters to inches</option>
      <option value="2.54">inches to centimeters</option>
      <option value="0.083333">inches to feet</option>
      <option value="12">feet to inches</option>
      <option value="0.3333">feet to yards</option>
      <option value="3">yards to feet</option>
      <option value="3.28084">meters to feet</option>
      <option value="0.3048">Feet to Meters</option>
      <option value="1.609344">Miles to Kilometers</option>
      <option value="0.621371">Kilometers to miles</option>
    </select>
</div>
<br /><div bgcolor="#BBBBBB"><span color="red"><b>OUTPUT :</b></span><input type="text" name="out" size="8" readonly="1" /></div></form><mbp:pagebreak /><a name="2" /><table><tr><td><img src="img/cover_small.gif" align="middle" /></td><td><h2 align="left">Weight Converter</h2></td></tr></table><form name="2"><div bgcolor="#BBBBBB"><span color="blue"><b>INPUT :</b></span> <input type="text" size="8" name="inp" /></div><br /><div align="right"><input type="button" value="Convert" name="button2" onclick="form.out.value= form.inp.value*form.unit.value" /><select name="unit">
 <option value="0.035273" selected="1">Grams to Ounces</option>
      <option value="28.35">Ounces to Grams</option>
      <option value="16">Pounds to Ounces</option>
      <option value="0.0625">Ounces to Pounds</option>
      <option value="2.2046">Kilograms to Pounds</option>
      <option value="0.4536">Pounds to Kilograms</option>
	</select></div><br><div bgcolor="#BBBBBB"><span color="red"><b>OUTPUT :</b></span><input type="text" name="out" size="8" readonly="1"></div></form><mbp:pagebreak /><a name="3" /><table><tr><td><img src="img/cover_small.gif" align="middle" /></td><td><h2 align="left">Volume Converter</h2></td></tr></table><form name="3"><div bgcolor="#BBBBBB"><span color="blue"><b>INPUT :</b></span> <input type="text" size="8" name="inp" /></div><br /><div align="right"><input type="button" value="Convert" name="button2" onclick="form.out.value= form.inp.value*form.unit.value" /><select name="unit">
 <option value="0.125" selected="1">fl Ounces to Cups</option>
      <option value="8">Cups to fl Ounces</option>
      <option value="0.0625">fl Ounces to Pints</option>
      <option value="16">Pints to fl Ounces</option>
      <option value="0.5">Pints to Quarts</option>
      <option value="2">Quarts to Pints</option>
      <option value="0.125">Liters to Quarts</option>
      <option value="8">Quarts to Liters</option>
      <option value="0.25">Quarts to Gallons</option>
      <option value="4">Gallons to Quarts</option>
</select></div><br><div bgcolor="#BBBBBB"><span color="red"><b>OUTPUT :</b></span><input type="text" name="out" size="8" readonly="1" /></div></form><mbp:pagebreak /><a name="4" /><table><tr><td><img src="img/cover_small.gif" align="middle" /></td><td><h2 align="left">Temperature Converter</h2></td></tr></table><form name="4"><div bgcolor="#BBBBBB"><span color="blue"><b>INPUT :</b></span> <input type="text" size="8" name="inp" /></div><br /><div align="right"><input type="button" value="Convert" name="button2" onclick="form.out.value= (form.inp.value*9/5+32)*(form.unit.value==1) + (form.inp.value-32)*5/9*(form.unit.value==2) + (form.inp.value*1+273.15)*(form.unit.value==3) + (form.inp.value-273.15)*(form.unit.value==4) + ((form.inp.value-32)*5/9+273.15)*(form.unit.value==5) + ((form.inp.value-273.15)*9/5+32)*(form.unit.value==6)" /><select name="unit">
      <option value="1" selected="1">Celsius to Fahrenheit</option>
      <option value="2">Fahrenheit to Celsius</option>
      <option value="3">Celsius to Kelvin</option>
      <option value="4">Kelvin to Celsius</option>
      <option value="5">Fahrenheit to Kelvin</option>
      <option value="6">Kelvin to Fahrenheit</option>

	</select></div><br /><div bgcolor="#BBBBBB"><span color="red"><b>OUTPUT :</b></span><input type="text" name="out" size="8" readonly="1" /></div></form></body></html>
  1. för-/nackdelar med att skriva på det senaste sättet?
  2. längd konvertionen verkar inte funka i senaste exemplet -ngn av er kanske hittar felet?
JojoxxMedlem sedan juni 20004 308 inlägg
#6
  1. Fördelar: Fler storheter än längd är inlagt. Nackdelar: Eftersom både in och ut-enhet anges i samma lista blir det extremt många val (^2) för varje ny enhet du vill konvertera mellan.

  2. Det första formuläret skall heta "form" (istället för "1") och listan skall heta "unit" (istället för "select").

plelkesMedlem sedan mars 2002823 inlägg
#7

Jojoxx skrev:

Nackdelar: Eftersom både in och ut-enhet anges i samma lista blir det extremt många val (^2) för varje ny enhet du vill konvertera mellan.

kan du utveckla detta lite?

JojoxxMedlem sedan juni 20004 308 inlägg
#8

Har du 2 enheter blir det 2 val:
a->b
b->a
Har du 3 enheter blir det 6 val:
a->b
a->c
b->a
b->c
c->a
c->b
Har du 4 enheter blir det 12 val:
a->b
a->c
a->d
b->a
b->c
d->d
c->a
c->b
c->d
d->a
d->b
d->c

Har du 10 enheter blir det 90 val i din dropdownlista om du skall kunna konvertera mellan alla.

127 ms totalt · 3 externa anrop · v20260731065814-full.102f7fcd
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
125 ms — hämta tråd, inlägg och bilagor (db)