您的位置：首页 > Web前端 > JavaScript

js中本地对象，内置对象和宿主对象的区别

2017-07-03 17:42 441 查看

<div id="article_details" class="details">

<div class="article_title">

<span class="ico ico_type_Repost"></span>

<h1>

<span class="link_title"><a href="/zzjiadw/article/details/6881114">

javascript中本地对象、内置对象和宿主对象

</a>

</span>

</h1>

</div>

<div class="article_manage clearfix">

<div class="article_l">

<span class="link_categories">

标签：

<a href="http://www.csdn.net/tag/javascript" target="_blank" onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_tag']);">javascript</a><a href="http://www.csdn.net/tag/object" target="_blank" onclick="_gaq.push(['_trackEvent','function',
'onclick', 'blog_articles_tag']);">object</a><a href="http://www.csdn.net/tag/math" target="_blank" onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_tag']);">math</a><a href="http://www.csdn.net/tag/%e6%b5%8f%e8%a7%88%e5%99%a8" target="_blank"
onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_tag']);">浏览器</a><a href="http://www.csdn.net/tag/function" target="_blank" onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_tag']);">function</a><a href="http://www.csdn.net/tag/string"
target="_blank" onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_tag']);">string</a>

</span>

</div>

<div class="article_r">

<span class="link_postdate">2011-10-17 14:13</span>

<span class="link_view" title="阅读次数">11367人阅读</span>

<span class="link_comments" title="评论次数"> <a href="#comments" onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_pinglun'])">评论</a>(0)</span>

<span class="link_collect tracking-ad" data-mod="popu_171"> <a href="javascript:void(0);" onclick="javascript:collectArticle('javascript%e4%b8%ad%e6%9c%ac%e5%9c%b0%e5%af%b9%e8%b1%a1%e3%80%81%e5%86%85%e7%bd%ae%e5%af%b9%e8%b1%a1%e5%92%8c%e5%ae%bf%e4%b8%bb%e5%af%b9%e8%b1%a1','6881114');return
false;" title="收藏" target="_blank">收藏</a></span>

<span class="link_report"> <a href="#report" onclick="javascript:report(6881114,2);return false;" title="举报">举报</a></span>

</div>

</div> <style type="text/css">

.embody{

padding:10px 10px 10px;

margin:0 -20px;

border-bottom:solid 1px #ededed;

}

.embody_b{

margin:0 ;

padding:10px 0;

}

.embody .embody_t,.embody .embody_c{

display: inline-block;

margin-right:10px;

}

.embody_t{

font-size: 12px;

color:#999;

}

.embody_c{

font-size: 12px;

}

.embody_c img,.embody_c em{

display: inline-block;

vertical-align: middle;

}

.embody_c img{

width:30px;

height:30px;

}

.embody_c em{

margin: 0 20px 0 10px;

color:#333;

font-style: normal;

}

</style>

<script type="text/javascript">

$(function () {

try

{

var lib = eval("("+$("#lib").attr("value")+")");

var html = "";

if (lib.err == 0) {

$.each(lib.data, function (i) {

var obj = lib.data[i];

//html += '<img src="' + obj.logo + '"/>' + obj.name + "  ";

html += ' <a href="' + obj.url + '" target="_blank">';

html += ' <img src="' + obj.logo + '">';

html += ' <em><b>' + obj.name + '</b></em>';

html += ' </a>';

});

4000
if (html != "") {

setTimeout(function () {

$("#lib").html(html);

$("#embody").show();

}, 100);

}

}

} catch (err)

{ }



});

</script>

<div class="category clearfix">

<div class="category_l">

<img src="http://static.blog.csdn.net/images/category_icon.jpg">

<span>分类：</span>

</div>

<div class="category_r">

<label onclick="GetCategoryArticles('900065','zzjiadw','top','6881114');">

<span onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_fenlei']);">JS<em>（18）</em></span>

<img class="arrow-down" src="http://static.blog.csdn.net/images/arrow_triangle _down.jpg" style="display:inline;">

<img class="arrow-up" src="http://static.blog.csdn.net/images/arrow_triangle_up.jpg" style="display:none;">

<div class="subItem">

<div class="subItem_t"><a href="http://blog.csdn.net/zzjiadw/article/category/900065" target="_blank">作者同类文章</a><i class="J_close">X</i></div>

<ul class="subItem_l" id="top_900065">

</ul>

</div>

</label>

</div>

</div>







<div id="article_content" class="article_content tracking-ad" data-mod="popu_307" data-dsm="post">

ECMA-262 把本地对象（native object）定义为“独立于宿主环境的 ECMAScript 实现提供的对象”。

<p>看定义有些不清楚，因为还未了解何为“宿主环境”的时候就引用了“宿主环境”这个概念，着实让人有些发晕。</p>

<p>不过，根据我强悍的文学功底，“宿主”一般是指寄生的生物选择的寄生体，这让我想起了“火影”里的“白”。简单说，就是用户的机器环境，包括<a href="http://lib.csdn.net/base/operatingsystem" class="replace_word" title="操作系统知识库" target="_blank" style="color:#df3434; font-weight:bold;">操作系统</a>和浏览器。</p>

<p>再来看一下，“本地对象”包含哪些内容：</p>

<p>Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、EvalError、RangeError、ReferenceError、SyntaxError、TypeError、URIError

</p>

<p>由此可以看出，简单来说，本地对象就是 ECMA-262 定义的类（引用类型）。</p>

内置对象

<p>ECMA-262 把内置对象（built-in object）定义为“由 ECMAScript 实现提供的、独立于宿主环境的所有对象，在 ECMAScript 程序开始执行时出现”。这意味着开发者不必明确实例化内置对象，它已被实例化了。

</p>

<p>同样是“独立于宿主环境”。根据定义我们似乎很难分清“内置对象”与“本地对象”的区别。而ECMA-262 只定义了两个内置对象，即 Global 和 Math （它们也是本地对象，根据定义，每个内置对象都是本地对象）。</p>

<p>如此就可以理解了。内置对象是本地对象的一种。而其包含的两种对象中，Math对象我们经常用到，可这个Global对象是啥东西呢？</p>

<p>Global对象是ECMAScript中最特别的对象，因为实际上它根本不存在，有点玩人的意思。大家要清楚，在ECMAScript中，不存在独立的函数，所有函数都必须是某个对象的方法。</p>

<p>类似于isNaN()、parseInt()和parseFloat()方法等，看起来都是函数，而实际上，它们都是Global对象的方法。而且Global对象的方法还不止这些。有关Global对象的具体方法和属性，感兴趣的同学可以看一下这里：<a href="http://www.w3school.com.cn/js/jsref_obj_global.asp" target="_blank">JavaScript 全局对象参考手册</a></p>

宿主对象

<p>何为“宿主对象”？主要在这个“宿主”的概念上，前面我已经介绍了“火影”，介绍了“白”。而ECMAScript中的“宿主”当然就是我们网页的运行环境，即“操作系统”和“浏览器”。</p>

<p>所有非本地对象都是宿主对象（host object），即由 ECMAScript 实现的宿主环境提供的对象。 </p>

<p>所有的BOM和DOM对象都是宿主对象。因为其对于不同的“宿主”环境所展示的内容不同。其实说白了就是，ECMAScript官方未定义的对象都属于宿主对象，因为其未定义的对象大多数是自己通过ECMAScript程序创建的对象。</p>

<div style="width:600px; white-space:nowrap; overflow:auto">

<div><span>var</span> oPerson <span>=</span><span>new</span> Object<span>;</span><br>

<br>

oPerson.<span>name</span><span>=</span><span>'simaopig'</span><span>;</span><br>

<br>

oPerson.<span>age</span><span>=</span><span>'26'</span><span>;</span></div>

</div>

<p>这里我自己定义的对象oPerson就是宿主对象。因为ECMAScript中未定义此对象，而此对象又只存在于我所运行的页面中。其貌似听起来是一个哲学命题。很奇怪我这款主题居然没有del的样式，残念。</p>

<p>看评论中，Andi的理解，这个oPerson的确应该叫user-defined object，用户自定义对象。嗯。。赞一个先。 <img class="wp-smiley" src="http://hiphotos.baidu.com/xiaoenha/pic/item/687bc479a38b33b80bd187a5.jpg" alt=""></p>

总结

<p>本地对象，就是那些官方定义好了的对象。内置对象是本地对象的一种，其只包含Global对象和Math对象。而宿主对象则是那些官方未定义，你自己构建的对象加上DOM和BOM对象组成的。</p>

<p> </p>

<p>摘自: <a href="http://hi.baidu.com/xiaoenha/blog/item/5291502dd51b25291e308972.html" target="_blank">
http://hi.baidu.com/xiaoenha/blog/item/5291502dd51b25291e308972.html</a></p>

</div>



<div class="bdsharebuttonbox tracking-ad bdshare-button-style0-16" style="float: right;" data-mod="popu_172" data-bd-bind="1499074632449">

<a href="#" class="bds_more" data-cmd="more" style="background-position:0 0 !important; background-image: url(http://bdimg.share.baidu.com/static/api/img/share/icons_0_16.png?v=d754dcc0.png) !important" target="_blank"></a>

<a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间" style="background-position:0 -52px !important" target="_blank"></a>

<a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博" style="background-position:0 -104px !important" target="_blank"></a>

<a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博" style="background-position:0 -260px !important" target="_blank"></a>

<a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网" style="background-position:0 -208px !important" target="_blank"></a>

<a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信" style="background-position:0 -1612px !important" target="_blank"></a>

</div>

<script>window._bd_share_config = { "common": { "bdSnsKey": {}, "bdText": "", "bdMini": "1", "bdMiniList": false, "bdPic": "", "bdStyle": "0", "bdSize": "16" }, "share": {} }; with (document) 0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src
= 'http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=' + ~(-new Date() / 36e5)];</script>







<script type="text/javascript" id="bdshare_js" data="type=tools&uid=1536434" src="http://bdimg.share.baidu.com/static/js/bds_s_v2.js?cdnversion=416410"></script>

<script type="text/javascript">

document.getElementById("bdshell_js").src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion=" + Math.ceil(new Date()/3600000)

</script>



<div id="digg" articleid="6881114">

<dl id="btnDigg" class="digg digg_enable" onclick="btndigga();">

<dt>顶</dt>

<dd>3</dd>

</dl>



<dl id="btnBury" class="digg digg_enable" onclick="btnburya();">



<dt>踩</dt>

<dd>1</dd>

</dl>



</div>

<div class="tracking-ad" data-mod="popu_222"><a href="javascript:void(0);" target="_blank"> </a> </div>

<div class="tracking-ad" data-mod="popu_223"> <a href="javascript:void(0);" target="_blank"> </a></div>

<script type="text/javascript">

function btndigga() {

$(".tracking-ad[data-mod='popu_222'] a").click();

}

function btnburya() {

$(".tracking-ad[data-mod='popu_223'] a").click();

}

</script>

<ul class="article_next_prev">

<li class="prev_article"><span onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_shangyipian']);location.href='http://blog.csdn.net/zzjiadw/article/details/6870652';">上一篇</span><a href="http://blog.csdn.net/zzjiadw/article/details/6870652"
onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_shangyipian'])">js中基本上8中情况的逻辑false情况</a></li>

<li class="next_article"><span onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_xiayipian']);location.href='http://blog.csdn.net/zzjiadw/article/details/6884177';">下一篇</span><a href="http://blog.csdn.net/zzjiadw/article/details/6884177"
onclick="_gaq.push(['_trackEvent','function', 'onclick', 'blog_articles_xiayipian'])">[JS框架推荐]简述JQuery,Extjs,YUI,Prototype,Dojo等JS框架的区别和应用场景</a></li>

</ul>

<div style="clear:both; height:10px;"></div>

<div class="similar_article">

<h4></h4>

<div class="similar_c" style="margin:20px 0px 0px 0px">

<div class="similar_c_t">

  相关文章推荐

</div>

<div class="similar_wrap tracking-ad" data-mod="popu_36">

<ul class="similar_list fl">

<li>

<em>•</em>

<a href="http://blog.csdn.net/u014346301/article/details/52162445" title="JavaScript中的本地对象、内置对象和宿主对象" strategy="BlogCommendFromCsdn" target="_blank">JavaScript中的本地对象、内置对象和宿主对象</a>

</li>

<li>

<em>•</em>

<a href="http://pbr445pf.iteye.com/blog/1359584" title="javascript 对象本地对象、内置对象和宿主对象" strategy="BlogCommendFromCsdn" target="_blank">javascript 对象本地对象、内置对象和宿主对象</a>

</li>

<li>

<em>•</em>

<a href="http://blog.csdn.net/u014754083/article/details/51994035" title="JavaScript本地对象内置对象宿主对象" strategy="BlogCommendFromCsdn" target="_blank">JavaScript本地对象内置对象宿主对象</a>

</li>

<li>

<em>•</em>

<a href="http://blog.csdn.net/sweetllh/article/details/73917830" title="javascript的本地对象、内置对象、宿主对象" strategy="BlogCommendFromCsdn" target="_blank">javascript的本地对象、内置对象、宿主对象</a>

</li>

<li>

<em>•</em>

<a href="http://schy-hqh.iteye.com/blog/1952529" title="javascript中的内置对象" strategy="BlogCommendFromCsdn" target="_blank">javascript中的内置对象</a>

</li>

</ul>

<ul class="similar_list fr">

<li>

<em>•</em>

<a href="http://blog.csdn.net/qq_33187168/article/details/50339857" title="javascript中本地对象、内置对象和宿主对象" strategy="BlogCommend
8f40
FromCsdn" target="_blank">javascript中本地对象、内置对象和宿主对象</a>

</li>

<li>

<em>•</em>

<a href="http://kanwoerzi.iteye.com/blog/1303623" title="ASP.NET内置对象详解" strategy="BlogCommendFromCsdn" target="_blank">ASP.NET内置对象详解</a>

</li>

<li>

<em>•</em>

<a href="http://blog.csdn.net/u013043341/article/details/50175991" title="【JavaScript】（2）——内置对象" strategy="BlogCommendFromCsdn" target="_blank">【JavaScript】（2）——内置对象</a>

</li>

<li>

<em>•</em>

<a href="http://daimajishu.iteye.com/blog/1088528" title="javascript 内置对象" strategy="BlogCommendFromCsdn" target="_blank">javascript 内置对象</a>

</li>

<li>

<em>•</em>

<a href="http://blog.csdn.net/qinqingz/article/details/52875966" title="JavaScript本地对象、内置对象和宿主对象及自定义对象" strategy="BlogCommendFromCsdn" target="_blank">JavaScript本地对象、内置对象和宿主对象及自定义对象</a>

</li>

</ul>

</div>

</div>

</div>



</div>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航