来自 服务器&运维 2019-12-04 16:28 的文章
当前位置: 澳门威尼斯人平台 > 服务器&运维 > 正文

澳门威尼斯人平台浅谈javascript中for in 和 for each in的区别_javascript技巧_脚本之家

/** * Created by Administrator on 15-1-19. */function functionUtil() {}functionUtil = { //某个DOM节点是否有某个属性 hasAttr: function  { var attr = el.getAttributeNode && el.getAttributeNode; return attr ? attr.specified : false }, //根据class获取元素 getByClass: function  { oParent = oParent || document; if (!oParent.getElementsByClassName) { return oParent.getElementsByClassName; } var arr = []; var aEle = oParent.getElementsByTagName; var reg = new RegExp' + sClass + '; //var reg = new RegExp('(^|[\x20\t\r\n\f])' + sClass + '([\x20\t\r\n\f]|$)'); for (var i = 0; i < aEle.length; i++) { if (reg.test { arr.push; } } return arr; }, //动态添加样式表 addSheetFile: function  { var fileref = document.createElement fileref.rel = "stylesheet"; fileref.type = "text/css"; fileref.href = path; fileref.media = "screen"; var headobj = document.getElementsByTagName[0]; headobj.appendChild; }, //根据指定格式如 ${name} 绑定json数据 LoadJsonData: function  { var oParent = document.getElementById; if (oJson instanceof Array) { var str = oParent.innerHTML; for (var i = 0; i < oJson.length - 1; i++) { oParent.innerHTML += str; } for  { oParent.children[d].innerHTML = oParent.children[d].innerHTML.replace}/g, function  { return oJson[d][$1] ? oJson[d][$1] : ''; }); } } else { oParent.innerHTML = oParent.innerHTML.replace}/g, function  { return oJson[$1] ? oJson[$1] : ''; }); } }, //根据指定格式如绑定json数据 TemplateEngine: function  { html = html.replace/g, function  { switch  { case $1: return '>'; case $2: return '/g, reExp = /?(if|for|else|switch|case|break|{|}))?/g, code = 'var r=[];n', cursor = 0; var add = function  { js ? (code += line.match ? line + 'n' : 'r.push : (code += line != '' ? 'r.push("' + line.replace;n' : ''); return add; } while ) { add(html.slice; cursor = match.index + match[0].length; } add(html.substr(cursor, html.length - cursor)); code += 'return r.join;'; return new Function(code.replace.apply; }}

区别一:

 1 /**
 2  * Created by Administrator on 15-1-19.
 3  */
 4 function functionUtil() {
 5 
 6 }
 7 
 8 functionUtil = {
 9     //某个DOM节点是否有某个属性
10     hasAttr: function (el, name) {
11         var attr = el.getAttributeNode && el.getAttributeNode(name);
12         return attr ? attr.specified : false
13     },
14     //根据class获取元素
15     getByClass: function (sClass, oParent) {
16         oParent = oParent || document;
17         if (!oParent.getElementsByClassName) {
18             return oParent.getElementsByClassName(sClass);
19         }
20         var arr = [];
21         var aEle = oParent.getElementsByTagName('*');
22         var reg = new RegExp('(^|\s)' + sClass + '(\s|$)');
23         //var reg = new RegExp('(^|[\x20\t\r\n\f])' + sClass + '([\x20\t\r\n\f]|$)');
24         for (var i = 0; i < aEle.length; i++) {
25             if (reg.test(aEle[i].className)) {
26                 arr.push(aEle[i]);
27             }
28         }
29         return arr;
30     },
31     //动态添加样式表
32     addSheetFile: function (path) {
33         var fileref = document.createElement("link")
34         fileref.rel = "stylesheet";
35         fileref.type = "text/css";
36         fileref.href = path;
37         fileref.media = "screen";
38         var headobj = document.getElementsByTagName('head')[0];
39         headobj.appendChild(fileref);
40     },
41     //根据指定格式如 ${name} 绑定json数据
42     LoadJsonData: function (sParent, oJson) {
43         var oParent = document.getElementById(sParent);
44         if (oJson instanceof Array) {
45             var str = oParent.innerHTML;
46             for (var i = 0; i < oJson.length - 1; i++) {
47                 oParent.innerHTML += str;
48             }
49             for (var d in oJson) {
50                 oParent.children[d].innerHTML = oParent.children[d].innerHTML.replace(/${(w+)}/g, function (str, $1) {
51                     return oJson[d][$1] ? oJson[d][$1] : '';
52                 });
53             }
54 
55         } else {
56             oParent.innerHTML = oParent.innerHTML.replace(/${(w+)}/g, function (str, $1) {
57                 return oJson[$1] ? oJson[$1] : '';
58             });
59         }
60     },
61     //根据指定格式如<%……%>绑定json数据
62     TemplateEngine: function (html, options) {
63         html = html.replace(/(&gt;)|(&lt;)/g, function (str, $1, $2) {
64             switch (str) {
65                 case $1:
66                     return '>';
67                 case $2:
68                     return '<';
69             }
70         });
71         var re = /<%([^%>]+)?%>/g, reExp = /(^( )?(if|for|else|switch|case|break|{|}))(.*)?/g, code = 'var r=[];n', cursor = 0;
72         var add = function (line, js) {
73             js ? (code += line.match(reExp) ? line + 'n' : 'r.push(' + line + ');n') :
74                 (code += line != '' ? 'r.push("' + line.replace(/"/g, '\"') + '");n' : '');
75             return add;
76         }
77         while (match = re.exec(html)) {
78             add(html.slice(cursor, match.index))(match[1], true);
79             cursor = match.index + match[0].length;
80         }
81         add(html.substr(cursor, html.length - cursor));
82         code += 'return r.join("");';
83         return new Function(code.replace(/[rtn]/g, '')).apply(options);
84     }
85 }

call、apply(thisObj,[obj1,obj2...])这二个方法是每个函数都包含的非继承的方法

1、第一种方式:${key}

for in是javascript 1.0 中发布的。 for each in是作为E4X标准的一部分在javascript 1.6中发布的,而它不是ECMAScript标准的一部分。 这将意味着存在各种浏览器的兼容性问题。for each in,对很多浏览器都不支持的。例如是不支持IE6,IE7,IE8等浏览器的。

1、第一种方式:${key}

作用都是一样的,简单来说就是改变当前使用该方法的对象中的this指向,指向调用方法中的thisObj对象二者的区别就是call方法中传入的参数是是一个个列举出来的,而apply方法中的参数二是一个数组

functionUtil.LoadJsonData;

区别二:

functionUtil.LoadJsonData(element, data);

还是举例说明比较直观:

  姓名:${name}
 年龄:${age}
 职业:${job}

例: var 长方形= { 高:"15", 宽:"25" };

澳门威尼斯人平台,”html“代码:

window.color='red';var o={color:"blue"};function sayColor;};sayColor(); //redsayColor.call;//red(调用call方法,指定对象是this,这里的this是window,没什么意义)sayColor.call;//red(调用call方法,指定对象是window,没什么意义)sayColor.call; //blue (调用call方法,指定对象是o,所以this指代对象o,这里由原来的window指向了o)sayColor.apply;//blue (调用call方法,指定对象是o,所以this指代对象o,这里由原来的window指向了o)

javascript代码:

 for { alert; }
1 <div id="data">
2     <div class="item">
3         姓名:${name}<br/>
4         年龄:${age}<br/>
5         职业:${job}<br/><br/>
6     </div>
7 </div>

ECMAScript5中的bind这个方法会创建一个函数的实例,这个实例的this值会被绑定到传递给bind()函数的值

var data = [ { name: '徐磊', age: 24, job: 'IT' }, { name: '李磊', age: 23, job: '翻译' } ];functionUtil.LoadJsonData;

结果依次是: 高,15 ; 宽,25 ;

javascript代码:

例子:

2、第二种方式

 for each { alert; }
 1 var data = [
 2            {
 3                     name: '徐磊',
 4                     age: 24,
 5                     job: 'IT'
 6                 },
 7                 {
 8                     name: '李磊',
 9                     age: 23,
10                     job: '翻译'
11                 }
12     ];
13 
14 
15 functionUtil.LoadJsonData('data', data);    
function a{return this.x+y;};var o={x:1};var g=a.bind;//3

本文由澳门威尼斯人平台发布于服务器&运维,转载请注明出处:澳门威尼斯人平台浅谈javascript中for in 和 for each in的区别_javascript技巧_脚本之家

关键词: