Month: February 2015

这样的写法 (function(){ /* do something */ })(); 的含义, JavaScript

执行匿名函数，并且匿名函数中的变量不污染全局变量空间。

代码:

  1. <html>
  2. <head>
  3. <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  4. </head>
  5. <body>
  7. <script type="text/javascript">
  9. (function(){
  10.     var inside="inside";
  11.     document.writeln("<p>函数0 无返回值，运行，未污染全局变量空间<br>");
  12.     document.writeln("I am running in a function anonymous.<br>");
  13.     document.writeln("var inside undefined :" + (typeof inside === 'undefined') + "<br>");
  14.     document.writeln("var inside values: " + inside + "<br>");
  15. })();
  17. var res1 = (function () {
  18.     var inside="inside";
  19.     document.writeln("<p>函数1 有返回值，运行，未污染全局变量空间<br>");
  20.     document.writeln("I am running in a function anonymous.<br>");
  21.     document.writeln("var inside undefined :" + (typeof inside === 'undefined') + "<br>");
  22.     document.writeln("var inside values: " + inside + "<br>");
  23.     return 111;
  24. })();
  26. var res2 = function () {
  27.     var inside="inside";
  28.     document.writeln("<p>函数2 有返回值，运行，未污染全局变量空间<br>");
  29.     document.writeln("I am running in a function anonymous.<br>");
  30.     document.writeln("var inside undefined :" + (typeof inside === 'undefined') + "<br>");
  31.     document.writeln("var inside values: " + inside + "<br>");
  32.     return 222;
  33. }();
  35. var res3 = function foo() {
  36.     var inside="inside";
  37.     document.writeln("<p>函数3 有返回值，运行，未污染全局变量空间<br>");
  38.     document.writeln("I am running in a naming function.<br>");
  39.     document.writeln("var inside undefined :" + (typeof inside === 'undefined') + "<br>");
  40.     document.writeln("var inside values: " + inside + "<br>");
  41.     return 333;
  42. }();
  44. function bar() {
  45.     var inside="inside";
  46.     document.writeln("<p>函数4 有返回值，定义未运行，未污染全局变量空间<br>");
  47.     document.writeln("I am running in a naming function.<br>");
  48.     document.writeln("var inside undefined :" + (typeof inside === 'undefined') + "<br>");
  49.     document.writeln("var inside values: " + inside + "<br>");
  50.     return 444;
  51. };
  53. var res4 = bar();  // bar运行
  55. document.writeln("<p>全局，所有匿名函数未污染全局变量空间<br>");
  56. document.writeln("var inside undefined :" + (typeof inside === 'undefined'));
  57. document.writeln("<br>");
  58. document.writeln("function foo undefined :" + (typeof foo === 'undefined'));
  59. document.writeln("<br>");
  60. document.writeln("function bar undefined :" + (typeof bar === 'undefined'));
  61. document.writeln("<br>");
  62. document.writeln("匿名函数1返回值:" + res1);
  63. document.writeln("<br>");
  64. document.writeln("匿名函数2返回值:" + res2);
  65. document.writeln("<br>");
  66. document.writeln("命名函数foo定义并调用的返回值:" + res3);
  67. document.writeln("<br>");
  68. document.writeln("命名函数bar调用的返回值:" + res4);
  69. document.writeln("<br>");
  70. </script>
  73. </body>
  74. </html>

执行结果:

  1. 函数0 无返回值，运行，未污染全局变量空间
  2. I am running in a function anonymous.
  3. var inside undefined :false
  4. var inside values: inside
  6. 函数1 有返回值，运行，未污染全局变量空间
  7. I am running in a function anonymous.
  8. var inside undefined :false
  9. var inside values: inside
  11. 函数2 有返回值，运行，未污染全局变量空间
  12. I am running in a function anonymous.
  13. var inside undefined :false
  14. var inside values: inside
  16. 函数3 有返回值，运行，未污染全局变量空间
  17. I am running in a naming function.
  18. var inside undefined :false
  19. var inside values: inside
  21. 函数4 有返回值，定义未运行，未污染全局变量空间
  22. I am running in a naming function.
  23. var inside undefined :false
  24. var inside values: inside
  26. 全局，所有匿名函数未污染全局变量空间
  27. var inside undefined :true
  28. function foo undefined :true
  29. function bar undefined :false
  30. 匿名函数1返回值:111
  31. 匿名函数2返回值:222
  32. 命名函数foo定义并调用的返回值:333
  33. 命名函数bar调用的返回值:444

JavaScript语言实现类似这样的效果: 3.grams.flour

JavaScript语言实现类似这样的效果: 3.grams.flour

参考 Javascript: The Good Parts，第33页

代码如下:
<html>
<body>

<script type="text/javascript">

// copied from page 33 of Javascript: The Good Parts
Function.prototype.method = function (name, func)
{
this.prototype[name] = func;
return this;
}

Number.method('chi', function() {
return this*0.333;
});

document.writeln( (3).chi());
document.writeln( "<br>" );
document.writeln( (3+1).chi() );
document.writeln( "<br>" );
document.writeln( 3.2.chi() );
document.writeln( "<br>" );
document.writeln( 3.0.chi() );
// document.writeln( 3.chi() );
// SyntaxError: identifier starts immediately after numeric literal

</script>

</body>
</html>

运行结果如下:

0.9990000000000001
1.332
1.0656

0.9990000000000001

努力学习，苦中作乐。

笔记:javascript通过反射和遍历，访问对象的所有属性，及 按引用/按值传递

正读 JavaScript: The Good Parts.

1. 通过反射和遍历，访问对象的所有属性。
<html>
<body>
<script type="text/javascript">
var x = {
"first-name": "Gift",
"last-name" : "Young"
};
x.nickname = 'nick';
for(name in x){
document.writeln(name+":"+x[name]+" "+typeof x[name]+"<br>");
}
</script>
</body>
</html>
上述代码的运行结果是:
first-name:Gift string
last-name:Young string
nickname:nick string

2.  " Objects are passed around by reference. They are never copied. "

下面的试验证实，String是按值复制的。
x与stooge是同一对象的reference，所以它们的属性的值一起变化；
snick和xnick的值“来自”对象的属性，但是snick和xnick的值并不随对象的属性的值的变化而变化。
<html>
<body>
<script type="text/javascript">
var stooge = {
"first-name": "Gift",
"last-name" : "Young"
};
var x = stooge;
x.nickname = 'before';
var snick = stooge.nickname;
var xnick = x.nickname;
document.writeln("nick:"+stooge.nickname+"<br>");
document.writeln("x.nickname:"+x.nickname+"<br>");
document.writeln("xnick:"+xnick+"<br>");
document.writeln("snick:"+snick+"<br>");
document.writeln("<br>");
x.nickname = 'after';
document.writeln("nick:"+stooge.nickname+"<br>");
document.writeln("x.nickname:"+x.nickname+"<br>");
document.writeln("xnick:"+xnick+"<br>");
document.writeln("snick:"+snick+"<br>");
</script>
</body>
</html>

上述代码的运行结果是:
nick:before
x.nickname:before
xnick:before
snick:before
nick:after
x.nickname:after
xnick:before
snick:before

努力学习语法，勿将高塔起浮沙。