大型应用的文体问题 [英] Stylistic concerns for large application
问题描述
''早上好，
在接下来的几个月内，我将开始使用相当多的b $ b基础的JavaScript代码来从网络浏览器调用
环境。不是太大，但可能在10K到15K之间
LoC。我只看过支持交互式网页的各种脚本页面，我很害怕尝试拉伸JavaScript。有没有人在这里完成这样的事情，想分享一些经验？
在我的微弱经历中，我采用了一些风格倾向，我想b $ b想要有经验丰富的人经营，看看你是否预计会遇到问题。这里有几个问题：
1.我看到的JavaScript书籍似乎都将对象方法定义为具有全局名称的
函数，然后将它们作为
函数分配给对象。我担心这会导致很多全球名字。我已经一直在寻找使用匿名函数作为替代方案，例如：
/ *构造函数* /
功能Foo（）
{
/ *方法* /
this.foo = function（）
{
...
}
this.bar = function（baz）
$
...
}
/ * fields * /
这个。 kazoo = this.foo（）;
this.kazam = null;
}
这样，我只定义一个全局名称，并且最终不会丑陋
临时名称只能用于对象的分配
方法。
2.您通常使用的方法仅用于对象内部使用的
内部使用，而不是从外部调用
世界？你是否以某种方式标记它们（我一直在看一个领先的
下划线...我一般不喜欢这些标识符标签，但在
中缺少语言支持可见性，我可能会相信
采用一个），或者只是为每个对象提供publis
接口的单独文档而不包含在那里？
3.如何将大量JavaScript源文件合并到一个网页
页面中。有数以万计的脚本标签似乎很好，但我找不到一个
方式来包含一个来自另一个的JavaScript源文件，所以看起来好像
一切都需要直接包含在HTML源代码中。任何
其他解决方案？这是否意味着在完成自己的加载之前页面将等待加载这个大量JavaScript的
？
我在考虑解决方案比如在框架集中有零大小的框架
加载其中包含JavaScript代码的页面，以避免支持功能页面的加载。还有其他想法吗？
-
www。 designacourse.com
培训任何人的最简单方法......无处不在。
Chris Smith - 首席软件开发人员/技术培训师
MindIQ公司
''Morning,
Within the next few months, I''m going to embark upon a comparatively
rather large base of JavaScript code to be called from a web browser
environment. Not too awfully huge, but probably between 10K and 15K
LoC. Having seen only the kinds of scripts that support interactive web
pages, I''m dreading trying to stretch JavaScript that far. Has anyone
here done something like this, and want to share some experience?
In my feeble experience, I''ve adopted a few stylistic tendencies that I
wanted to run by those of you with more experience, to see if you
foresee problems. Here are a few questions:
1. JavaScript books I''ve seen all seem to define object methods as
functions with a global name, and then assign them into an object as a
function. I''m concerned that this leads to a lot of global names. I''ve
been looking at using anonymous functions as an alternative, as in:
/* constructor */
function Foo()
{
/* methods */
this.foo = function()
{
...
}
this.bar = function(baz)
{
...
}
/* fields */
this.kazoo = this.foo();
this.kazam = null;
}
That way, I only define one global name, and don''t end up with ugly
temporary names that only exist to be used in assignments for object
methods.
2. What do you normally do with methods that are only intended for
internal use within an object, and not to be called from the outside
world? Do you tag them somehow (I''ve been looking at a leading
underscore... I generally dislike these kinds of identifier tags, but in
the absence of language support for visibility, I might be convinced to
adopt one), or merely provide separate documentation of publis
interfaces for each object and don''t include them there?
3. How do I combine lots of JavaScript source files into a single web
page. Having zillions of script tags seems hokey, but I can''t find a
way to include one JavaScript source file from another, so it looks like
everything does need to be included directly from the HTML source. Any
other solution? Does this mean that the page will wait on the loading
of this large amount of JavaScript before it finished its own loading?
I''m considering solutions like having zero-size frames in a frameset
that load other pages with JavaScript code in them, to avoid holding up
the loading of functional pages. Any other ideas?
--
www.designacourse.com
The Easiest Way to Train Anyone... Anywhere.
Chris Smith - Lead Software Developer/Technical Trainer
MindIQ Corporation
推荐答案
" Chris Smith" < CD ***** @ twu.net>在留言中写道
新闻：MP ************************ @ news.altopia.com ..
< snip>
"Chris Smith" <cd*****@twu.net> wrote in message
news:MP************************@news.altopia.com.. .
<snip>
....我一直在寻找使用匿名
函数作为替代方案，如：
/ *构造函数* /
函数Foo（）
{
/ *方法* /
this.foo = function（）
{
...
}
this.bar = function（baz）
{
...
}
/ * fields * /
this.kazoo = this.foo（）;
this.kazam = null;
}
另外： -
/ *构造函数* /
函数Foo（）
{
/ * fields * /
this.kazoo = this.foo（）;
this.kazam = null;
}
Foo.prototype.foo = function（）{
...
}
Foo.prototype.bar = function（）{
...
}
- 分配的功能原型成为对象的方法。
它们不在全局命名空间中创建命名函数，只创建了一个
函数对象（而不是一个函数）对于每个方法，每个
内部函数在构造函数中为每个方法的每个
调用指定一个方法。
< snip> 2.您通常使用的方法仅用于在对象内部使用，而不是从外部世界调用？
让他们成为私人会员： -
< URL： http://www.crockford.com/javascript/private.html >
（还可以使用groups.google.com找到一个clj主题，主题是
" closures，它们有什么用？对于私有静态成员来说。）
（并在 www.crockford.com 上找到并阅读有关继承的页面。 />
< snip>但在没有语言支持可见度的情况下，
< snip>
该语言支持可见性（虽然不明确）因为
版本1.1。
< snip> 3。如何将大量JavaScript源文件合并到单个网页中。
取决于具体要求，但是
一个脚本可以使用document.write将一个或多个SCRIPT标签写入一个带有SRC的页面中/>
属性设置为适当的文件（我的经验是，如果它是特定脚本部分中的最后一个操作
或文件，这是最可靠的
可靠） 。其他动态JS文件加载技术不是很好b / b
跨浏览器。
< snip>这是否意味着页面将等待加载
大量的JavaScript在它完成自己的加载之前？
大多数情况下是的，但您可以在文件顶部将标记设置为false，并在底部设置
为true并且不使用该文件的内容直到该标志的值
为真。
我正在考虑在
框架集中使用零大小的框架，使用JavaScript加载其他页面的解决方案...
... . I''ve been looking at using anonymous
functions as an alternative, as in:
/* constructor */
function Foo()
{
/* methods */
this.foo = function()
{
...
}
this.bar = function(baz)
{
...
}
/* fields */
this.kazoo = this.foo();
this.kazam = null;
}
Alternatively:-
/* constructor */
function Foo()
{
/* fields */
this.kazoo = this.foo();
this.kazam = null;
}
Foo.prototype.foo = function(){
...
}
Foo.prototype.bar = function(){
...
}
- the functions assigned to the prototype become methods of the object.
They do not create named functions in the global namespace and only one
function object is created (rather than one function object for each
inner function assigned as a method from within the constructor for each
invocation of the constructor) for each method.
<snip> 2. What do you normally do with methods that are only intended for
internal use within an object, and not to be called from the outside
world?
Make them private members:-
<URL: http://www.crockford.com/javascript/private.html >
(also use groups.google.com to locate a clj thread with the subject
"closures, what are they good for?" for privat static members).
(and also locate and read the page on inheritance on www.crockford.com).
<snip>but in the absence of language support for visibility, <snip>
The language has supported visibility (though not explicitly) since
version 1.1.
<snip>3. How do I combine lots of JavaScript source files into a
single web page.
Depends on the specific requirement but document.write can be used by
one script to write one or more SCRIPT tags into a page with their SRC
attributes set to appropriate files (my experience is that this is most
reliable if it is the last operation within a particular script section
or file). Other dynamic JS file loading techniques are not very
cross-browser.
<snip>Does this mean that the page will wait on the loading of this
large amount of JavaScript before it finished its own loading?
Mostly yes, but you can set a flag to false at the top of a file and
true at the bottom and not use the contents of that file until the value
of the flag is true.
I''m considering solutions like having zero-size frames in a
frameset that load other pages with JavaScript ...
< snip>
几年前我试过这个并且认定它不值得
努力。框架引入了许多问题，包括脚本和
一般。鉴于选择（以及任何服务器端脚本/包括
支持），我现在不会去框架集附近。如果您将JS
文件设置为在客户端上正确缓存，则不应该多次使用
大小。
Richard。
<snip>
I tried that a couple of years ago and decided that it was not worth the
effort. Frames introduce lots of issues, both with scripting and in
general. Given the choice (and any server-side scripting/include
support) I would not now go anywhere near framesets. If you set your JS
files to cache properly on the client you should not suffer for their
size more than once.
Richard.
Chris Smith< cd ***** @ twu.net>写道：
Chris Smith <cd*****@twu.net> writes:
好的，公平的，但我开始看到这个答案与你对隐藏成员的说法进行交互...如果我定义了方法你在上面描述的方式，然后他们无法访问任何对象，而不是外部观察者。
Javascript对象完全透明。除了外部观察者可以看到的内容之外，没有更多的内容可以访问。
如果你添加所谓的私人成员然后它不是真正的Javascript对象支持的
，但是可以通过范围来模拟*由方法共享的
变量。
那个与一套合理的可见性规则（也就是说，我从来没有真正希望隐藏对象的状态本身）不一致，
你不能只使用Javascript对象隐藏任何东西。
所以我在原型中定义函数的唯一原因是，只需定义一次函数就可以获得性能提升
比每个对象？
它是。
---
函数Foo（）{}
Foo.prototype.bar = function（x）{之间没有明显的区别this.last = x; alert（x）};
---
和
---
函数Foo（）{
this.bar = function（x）{this.last = x; alert（x）;}
}
$ b当你写new Foo（）时，$ b ---
。第一个有更好的内存使用量
如果你创建更多的对象。
嗯。你能指出一些其他的吗？技术？
在某些浏览器中，更改src脚本元素的属性将
加载代码。在其他情况下，它不会。
在某些浏览器中，使用DOM方法创建一个新的脚本元素将会加载代码。在其他人中它不会。
我担心的是，如果我有一个三十五到四十四页的页面
''script type =" text / javascript"顶部的src =" ..."''行，
浏览器不会完成加载和呈现页面，直到它为所有三十五到四十的HTTP请求完成源文件，解析它们，并完成它们的运行。毕竟，如果他们在某个地方包含
document.write怎么办？
Okay, fair enough, but I''m beginning to see that this answer interacts
with what you say about hiding members... if I define methods in the
manner you describe above, then they don''t have access to any more of
the object than an external observer would.
Javascript objects are completely transparent. There is no more to
access than what an external observer can see.
If you add the so-called "private members" then it is not really
supported by Javascript objects, but it can be *emulated* by scoped
variables shared by the methods.
That''s not really consistent with a set of reasonable visibility
rules (that is, I never really want to hide an object''s state from
itself),
You cannot hide anything from anybody using only Javascript objects.
so the only reason I''d define functions in the prototype is
the performance gain from only defining the function once rather
than per-object?
It is. There is no noticable difference between
---
function Foo(){}
Foo.prototype.bar = function(x){this.last=x;alert(x)};
---
and
---
function Foo(){
this.bar = function(x){this.last=x;alert(x);}
}
---
when you write "new Foo()". The first have better memory usage
if you create more objects.
Hmm. Can you point to some "other" techniques?
In some browsers, changing the "src" property of a script element will
load the code. In others it won''t.
In some browsers, creating a new script element with DOM methods will
load the code. in others it won''t.
My concern is that if I have a page with thirty-five to fourty
''script type="text/javascript" src="..."'' lines at the top, that the
browser won''t finish loading and rendering the page until it makes
all thirty-five to fourty HTTP requests for the source files, parses
them, and finishes running them. After all, what if they contained a
document.write somewhere?
你可以添加延迟属性为脚本标签：
< script type =" text / javascript" SRC =" foo.js" defer =" defer">< / script>
所有这意味着你保证来源不包含
document.write'，那就是解析可以继续而无需等待
代码加载和运行。
/ L
-
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D''HTML：< URL ：http：//www.infimum.dk/HTML/randomArtSplit.html>
''没有判断的信仰只会降低精神神圣。''
You can add the "defer" attribute to the script tags:
<script type="text/javascript" src="foo.js" defer="defer"></script>
All that means is that you promise that the source contains no
document.write''s, and that parsing can continue without waiting for the
code to be loaded and run.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D''HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
''Faith without judgement merely degrades the spirit divine.''
" Chris Smith" < CD ***** @ twu.net>在留言中写道
新闻：MP ************************ @ news.altopia.com ..
< snip>
"Chris Smith" <cd*****@twu.net> wrote in message
news:MP************************@news.altopia.com.. .
<snip>
- 分配给原型的函数成为对象的方法。 ...
< snip>
- the functions assigned to the prototype become methods
of the object. ... <snip>
好的，公平的，但我开始看到这个答案与你对隐藏成员的说法相互作用......如果我按照你上面描述的方式定义方法，那么他们就无法访问任何对象，而不是外部的观察者。这与一套合理的可见性规则并不完全一致（也就是说，我从来没有真正想要隐藏对象'的状态），所以我唯一的理由就是定义原型中的函数是仅仅定义函数一次而不是每个对象的性能增益？
分配给原型属性的函数将无法访问对象的私有成员
（尽管他们仍然可以访问
私有静态成员）但实际上并没有所有对象方法都需要访问对象的私有成员。他们可以访问所有
他们自己的对象实例的公共方法，这样他们就能够b $ b调用特权。可以与私有成员交互的方法。确定哪种方法可以定义在哪种上下文中实现
需要的成员访问并获得最好的折衷方案
性能，资源使用和所需的封装级别。
无论您使用哪种方法来定义特定方法，您仍然可以避免填充全局命名空间命名函数
定义。
< snip> ......其他动态JS文件加载技术并不是非常跨浏览器。
Okay, fair enough, but I''m beginning to see that this answer
interacts with what you say about hiding members... if I
define methods in the manner you describe above, then they
don''t have access to any more of the object than an external
observer would. That''s not really consistent with a set of
reasonable visibility rules (that is, I never really want to hide
an object''s state from itself), so the only reason I''d define
functions in the prototype is the performance gain from only
defining the function once rather than per-object?
Functions assigned to properties of the prototype will not have access
to private members of their objects (though they could still access
private static members) but in practice no all object methods will need
access to an object''s private members. They will have access to all of
the public methods of their own object instance so they will be able to
call "privileged" methods that can interact with private members. It is
a matter of deciding which methods to define in which context to achieve
the member access that is needed and get the best compromise between
performance, resource use and the desired level of encapsulation.
Whichever approach you use to defining a specific method you will still
be avoiding filling the global namespace with named function
definitions.
<snip> ... . Other dynamic JS file loading techniques are not
very cross-browser.
嗯。你能指出一些其他的吗？技术？
Hmm. Can you point to some "other" techniques?
< URL： http： //tinyurl.com/d25q >
<URL: http://tinyurl.com/d25q >
< snip>
<snip>
>这是否意味着在完成自己的加载之前页面会等待加载这个
>大量的JavaScript吗？
>Does this mean that the page will wait on the loading of this
>large amount of JavaScript before it finished its own loading?
大部分是的，但你可以设置一个标志为false在文件的顶部，
在底部为真，并且不使用该文件的内容，直到
标志的值为真。
Mostly yes, but you can set a flag to false at the top of a file and
true at the bottom and not use the contents of that file until
the value of the flag is true.
不确定那意味着什么。我担心的是，如果我有一个页面，其中有三十五到四十四个''脚本类型=" text / javascript" src =" ..."''lines
Not sure what that means. My concern is that if I have a page with
thirty-five to fourty ''script type="text/javascript" src="..."'' lines
顶部，浏览器不会完成加载和渲染页面
直到它全部三十对源文件的五到四十的HTTP请求，解析它们，并完成它们的运行。毕竟，如果他们在某处包含一个document.write怎么办？浏览器并不知道他们只是定义了
浏览器响应事件而单独调用的代码。我的感觉是，在页面呈现之前的一个缓慢的一天，这可能需要三十秒。
理想的解决方案是实际定位并加载代码作为需求它实际上是用的，但是我想放弃那个。
然而，我想在后台加载它，然后稍后再调用它。
atthe top, that the browser won''t finish loading and rendering the page
until it makes all thirty-five to fourty HTTP requests for the source
files, parses them, and finishes running them. After all, what if they
contained a document.write somewhere? The browser doesn''t
know that they just define code that''s called separately by the
browser in response to events. My feeling is that this could take
thirty seconds on a slow day before the page even renders.
An ideal solution would be to actually locate and load the code on
demand as it is actually used, but I''m giving up on that one, I think.
Nevertheless, I''d like to have it load in the background, and then
call it later.
< quote cite =" http：//www.w3.org/TR/html401/interact/scripts.html">
defer [CI]
设置后，此布尔属性向用户代理提供提示
脚本不会生成任何文档内容
（例如，javascript中没有document.write）因此，用户代理
可以继续解析和呈现。
< / quote>
< snip>
<quote cite="http://www.w3.org/TR/html401/interact/scripts.html">
defer [CI]
When set, this boolean attribute provides a hint to the user agent
that the script is not going to generate any document content
(e.g., no "document.write" in javascript) and thus, the user agent
can continue parsing and rendering.
</quote>
<snip>
...我现在不会去框架集附近。
... I would not now go anywhere near framesets.
这实际上不是一个问题也就是说，框架集已经是应用程序的一个重要部分。不是我的选择......我正在实施的规范说，一个对象开始于走向
框架结构，寻找一个定义具有特定名称的JavaScript方法的框架...所以正在加载的页面
必须至少有一个父框架。
That''s actually not an issue, as framesets are already an important
part of the application. Not my choice... the specification I''m
implementing says that an object starts out by walking up the
frame structurse looking for a frame that defines a JavaScript
method with a particular name... so the page that''s being loaded
MUST have a parent frame, at the very least.
当然通用代码应检查当前功能窗口
名字在通过父母链接之前？ （这样它可以工作
没有框架集和一个框架）。
顺便提一下，如果你有框架集，框架集页面通常是
相当稳定，您可以将脚本加载到其中，这样当任何帧内容发生变化时，它们就不需要重新加载。
但是要在各种浏览器中同时进行测试。
Surely generalised code should check the current window for the function
name prior to chaining up through the parents? (so that it can work
without a frameset as well as with one).
Incidentally, if you have a frameset the frameset page is normally
fairly constant and you can load script into it so they would not need
to be re-loaded when any frame contents changed.
But do simultaneously test in a good range of browsers.
如果你将JS
文件设置为在客户端上正确缓存，你应该不会因为它们的大小而遭受不止一次的痛苦。
If you set your JS
files to cache properly on the client you should not
suffer for their size more than once.
每次都不会解析它们吗？我认为通过10K LoC解析和行走将是非常重要的。
Wouldn''t they be parsed each time? I''d think that parsing and walking
through 10K LoC would be non-trivial.
10K真的不是那么大，解析速度比下载。
Richard。
10K is really not that big and parsing is quick compared to downloading.
Richard.
这篇关于大型应用的文体问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
