js基础问题

Question

刚开始JS开发学习（富客户端），有点疑问想确认下：1、JS逻辑（不含框架）会被分散到多个JS文件中？一般一个JS文件代表一个大的模块？2、JS模块一般以什么开头（只是想看看主流是什么样的）？是直接的全局变量定义方法还是自执行方法里面定义？var module = function(){
  //module content
  //return content;
}(function(){})();
或
$(function(){});3、不同的JS文件之间如何交互，例如JS1里在全局里加了个test变量，JS2中要怎么拿？直接取？如果是直接取，感觉要事先知道变量名称，并且阅读JS2的代码，突然冒出个变量，感觉会使代码阅读困难。4、JS文件中如何取dom对象（在HTML文件中）？直接在JS里用document.getElementById("")取？与上面相似，id难道要事先知道？并且这样也会不通用。 是把dom对象通过方法参数传递到模块中吗？PS：本人菜鸟，勿喷~~

Answer 1

1.JS分不分由你自己定，当然不同的功能最好是写在不同的JS文件中
2.JS本身没有什么模块的概念，如果不依赖于框架的话。不同的框架在写模块的时候，会有不同写法
(function(){
    //类似这样的结构，叫做闭包，很多框架都用到
})();
而$这个东西应该是一个框架所定义的东西，它本身其实就是一个变量，跟 a，b，c 一样，javascript本来就没有定义这它3.不同的JS之间，只要加载到同一个页面，所定义的变量就可以直接使用，比如a.js定义了 a=100; 之后b.js就可以直接alert(a)了。所以全局变量的写法，通常不可取，所以闭包就防止了这种全局变量的污染4.document.getElementById("mydom")，这跟silverlight也差不多吧，要使用某个控件，也得给这个控件加上个ID啊。只是如果html文档没有加载完的话，可能mydom会找不到。
所以这样的代码你要确定HTML代码加载完了以后再运行比较好，比如放在window.onload事件中

Answer 2

1、JS逻辑（不含框架）会被分散到多个JS文件中？一般一个JS文件代表一个大的模块？
//关于这个疑问，可以专门把一系列相关的内容放在一个文件，如ajax的处理，放在一个模块，当然，一般一个js文件表示一个模块，如针对表单(form)处理的js文件可以放在一起2.可以用函数或 构造函数+原型对象如一个form.js文件里
about <input type="radio"/>
function et_radio_value(radio_name){
var radio_arr = document.getElementsByName(radio_name);
if(!radio_arr || !radio_arr.length){return null;}
for(var i = 0; i < radio_arr.length; i++)
{
if(radio_arr[i].checked)
{
return radio_arr[i].value;
}
}
return null;
}另一种可以用构造函数+原型对象
function TestObject(name) { 
this.m_Name = name; 
} TestObject.prototype.ShowName = function() { 
alert(this.m_Name); 
}; peopleName = new TestObject('john');peopleName.ShowName();

Answer 3

1、JS逻辑（不含框架）会被分散到多个JS文件中？一般一个JS文件代表一个大的模块？
--------------------------------------
可以分散也可以不分散，这个都是根据个人习惯与爱好来的。
2、JS模块一般以什么开头（只是想看看主流是什么样的）？是直接的全局变量定义方法还是自执行方法里面定义？var module = function(){
  //module content
  //return content;
}(function(){})();
或
$(function(){});
--------------------------------------
模块开头也是个人喜欢和喜好。后面的写法可以搜索一下js闭包。
3、不同的JS文件之间如何交互，例如JS1里在全局里加了个test变量，JS2中要怎么拿？直接取？如果是直接取，感觉要事先知道变量名称，并且阅读JS2的代码，突然冒出个变量，感觉会使代码阅读困难。
--------------------------------------
不同的js文件交互，是需要知道变量名称，在命名时尽量取有意义的名字，如果要知道某个变量是否定义了可以用typeof来判断“typeof 运算符把类型信息当作字符串返回。typeof 返回值有六种可能： "number," "string," "boolean," "object," "function," 和 "undefined."”
4、JS文件中如何取dom对象（在HTML文件中）？直接在JS里用document.getElementById("")取？与上面相似，id难道要事先知道？并且这样也会不通用。 是把dom对象通过方法参数传递到模块中吗？
--------------------------------------
获取dom对象直接用document.getElementById(id),id是需要事先知道的，否则怎么知道你要获取哪个？可以直接传递对象也可以传递对象的id给模块。

Answer 4

不同的js文件之间如何交互，要是交互就用全局变量，或者传值过去function test1(){
var test = 'test';
return test;
}function test2(){
var t2 =  test1();
alert(t2);
}、JS文件中如何取dom对象（在HTML文件中）？直接在JS里用document.getElementById("")取？与上面相似，id难道要事先知道？并且这样也会不通用。 是把dom对象通过方法参数传递到模块中吗？
用getElementById这个属性就是要让id事先知道的，用这个效率高getElementByNames(name)  //来获取一个包含页面中所有指定Name元素的对象数组。

Answer 5

1.通常一个页面只加载需要的JS方法就可以了，如果一个JS文件很大，可考虑将常用的给分出来
2.  $(function(){});
   这种是Jquery的写法吧

Answer 6

1.在开发过程中一般是一个类一个文件，发布的时候再通过压缩合并到一个文件当中，当然如果文件过大可以分成几个小文件，一般一个文件200k左右为宜。
2.做js开发，尽量避免对全局变量的使用，所以一般开头是这样写的：
var myProject = (function(){
var namespace = {
// ...
}
namespace.global = { }
return namespace;
})；
3.上面已经说过了，应尽量避免使用全局变量，非用不可的全局变量应集中保存在一个global对象里，并优先加载以保证随后加载的js文件可以引用(可以直接引用)。
4.js操作dom是通过getELementById,getElementsByTagName,getElementsByName,getElementsByClass,querySelector,querySelectorAll等来获取的，具体看浏览器支持，当然你也可以利用现成的js框架，比如jquery.如果你觉得操作dom要事先知道id是件不能忍受的事情的话，你可以通过配置文件来告诉js所有相关的id或其他信息，当然你要先实现一个配置文件的解析器。上面是本人的个人见解，希望对你有所帮助。

Answer 7

几个 js 文件导入一个页面，和一个ｊｓ文件没有区别。
逻辑复杂的，会分开写，但是所有的时候，通常会合并压缩成一个文件，在被调用。js 多了，全局变量多了，可能会有冲突，所以会封装成对象，尽量少用全局变量，通过全局变量的对象来访问成员变量和方法。像jquery  就2个全局变量 $ 和 Jquery 通过他们可以调用很多方法。获取dom  肯定是 document.getElementById("") document.getElementsByTagName("")
document.getElementsByName("")
这些方法。
当然 ID，name 可以作为参数，调用时在传参就可以。 像 jquery  的选择器函数 $();

Answer 8

我现在也在学习js。
---------------------------------------------------
JS文件中如何取dom对象（在HTML文件中）？直接在JS里用document.getElementById("")取？与上面相似，id难道要事先知道？并且这样也会不通用。 是把dom对象通过方法参数传递到模块中吗？
-------------------------------------------------------------------
看看这本书，javascript DOM 高级程序设计。这本书对dom讲的很详细。

Answer 9

感谢大家的回复，现在看下来，我是不是可以理解为：1、在一个JS文件不是太大的情况下，基本上一个页面只用一个JS文件（里面会定义多个类），除非是可以被多个页面共用的部分才另外独立到其它JS文件中；2、还是不知道主流的是什么样的，不过猜测$(function(){});应该比较多吧（JQuery）；3、不同的JS文件之间的类、变量调用，只能直接使用，为了避免类或变量突然冒出的情况，只能多用typeof判断和多些注释；4、同3，直接在JS文件中通过document.getElementById("XXid")获取DOM对象，事先要知道DOM对象的ID。另外还有个小问题：
$(function(){
  var test;//这里的test变量到底属于哪个对象的？直接在该处声明变量，会否造成变量污染？我自己试下来好像其它的$(function(){});区域取不到test属性。})

Answer 10

<html>
    <head>
        <title></title>
    </head>
    <body>
        <script type="text/javascript" language="javascript">
            var a="全局变量a";
            
            (function(){
                var a="在一个闭包中的a";
                alert("测试点1:"+a);
                a="修改一下？";
            })();
            
            (function(){
                var a="另一个闭包中的a";
                alert("测试点2:"+a);
            })();
            
            alert("测试点3:"+a);
        </script>
    </body>
</html>
运行一下吧，这三个变量a都是互不影响的。
所以这种情况下，全局变量的a会被任意其它的js代码修改其值，同样也会影响其它js的a
但闭包中的变量a，与其它任何地方都变量都不相干，也没有任何其它的JS代码能影响到闭包中的变量

Answer 11

关于 js 的变量
凡未加 var 修饰的变量，都是全局变量
有 var 修饰的变量的作用于在其声明的范围内

Answer 12

好像也不大对吧。。如果都没用var申明，比方在function里的变量和在function外的全局变量同名，function里调用的则是全局变量?  那function里的变量如何理解

Answer 13

如果这样解释是否能帮到楼主？
一个html文档可以引入多个js文件，引入过后，所有js文件中定义的变量或函数都在这个html文档中(除开局部变量或作用域内部变量)，举个例子：js文件1：假定文件名为js1.jsvar a_global='全局的a，在js1中定义';
var a_js1='js1中的a';
js文件2：假定文件名为js2.jsvar a_global='全局的a，在js2中定义';
var a_js2='js2中的a';<html>
    <head>
        <script type='text/javascript' src='js1.js'></script>
        <script type='text/javascript' src='js2.js'></script>
        <script>
            alert(a_js1);
            alert(a_js2);
            alert(a_global);//请把js1和js2加载的顺序改变一下再看看。
        </script>
    </head>
</html>
以上代码最终的结果等价于：(注：两种方式是截然不同的，涉及到到服务器的连接个数)<html>
    <head>
        <script>
            var a_global='全局的a，在js1中定义';
            var a_js1='js1中的a';
            var a_global='全局的a，在js2中定义';
            var a_js2='js2中的a';
            alert(a_js1);
            alert(a_js2);
            alert(a_global);
        </script>
    </head>
</html>从这个角度来看，不管你分多少js，如果是同一个html来引用，那么最终js中外层定义的变量或方法都属于该html。关于作用域后期再看吧。注：只供参考。

Answer 14

PS：如果一个js文件中用到了另外一个js文件中定义的变量，需要定义变量的js文件先加载。