这篇文章主要介绍了JavaScript常用方法和封装实例分析的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇JavaScript常用方法和封装实例分析文章都会有所收获，下面我们一起来看看吧。
1.字符串相关
1.1 format方法
在各种编程语言中，字符串的format方法是比较常见的，以下通过js扩展的方式，实现了js版本的format方法。目前貌似还没有浏览器支持这一个方法。
if(!String.prototype.format ){ String.prototype.format = function() { var e = arguments; return this.replace(/{(\d+)}/g,function(t, n) { return typeof e[n] != "undefined" ? e[n] : t; }) };}例子：
var template = "今天的天气很{0},大家一起去{1}！";alert(template.format("晴朗","郊游"));效果：
2.数组相关
1.2 forEach(callback,context) 操作数组中的每一个元素
ie9以上的浏览器，以及其他非IE浏览器都支持这一方法。
以下是兼容性的扩展写法：
if (!Array.prototype.forEach && typeof Array.prototype.forEach !== "function") { Array.prototype.forEach = function(callback, context) { // 遍历数组,在每一项上调用回调函数，这里使用原生方法验证数组。 if (Object.prototype.toString.call(this) === "[object Array]") { var i,len; //遍历该数组所有的元素 for (i = 0, len = this.length; i < len; i++) { if (typeof callback === "function" && Object.prototype.hasOwnProperty.call(this, i)) { if (callback.call(context, this[i], i, this) === false) { break; // or return; } } } } };}例子：
var drinks = ['雪碧','可乐','脉动','红牛','农夫山泉']; var context = { str1 : '【', str2 : '】'}; drinks.forEach(function(item){ console.log(this.str1 + item + this.str2);},context);效果：
这个方法在各大浏览器都得到了较好的支持。
1.3 indexOf(searchvalue,fromindex) 查询数组中某一个值的下标
ie9以上的浏览器，以及其他非IE浏览器都支持这一方法。
以下是兼容性的扩展写法：
//获取某元素在数组中第一次出现的下标if (!Array.prototype.indexOf) { Array.prototype.indexOf = function(searchElement, fromIndex) { var k; // 1. Let O be the result of calling ToObject passing // the this value as the argument. if (this == null) { throw new TypeError('"this" is null or not defined'); } var O = Object(this); // 2. Let lenValue be the result of calling the Get // internal method of O with the argument "length". // 3. Let len be ToUint32(lenValue). var len = O.length >>> 0; // 4. If len is 0, return -1. if (len === 0) { return -1; } // 5. If argument fromIndex was passed let n be // ToInteger(fromIndex); else let n be 0. var n = +fromIndex || 0; if (Math.abs(n) === Infinity) { n = 0; } // 6. If n >= len, return -1. if (n >= len) { return -1; } // 7. If n >= 0, then Let k be n. // 8. Else, n<0, Let k be len - abs(n). // If k is less than 0, then let k be 0. k = Math.max(n >= 0 ? n : len - Math.abs(n), 0); // 9. Repeat, while k < len while (k < len) { // a. Let Pk be ToString(k). // This is implicit for LHS operands of the in operator // b. Let kPresent be the result of calling the // HasProperty internal method of O with argument Pk. // This step can be combined with c // c. If kPresent is true, then // i. Let elementK be the result of calling the Get // internal method of O with the argument ToString(k). // ii. Let same be the result of applying the // Strict Equality Comparison Algorithm to // searchElement and elementK. // iii. If same is true, return k. if (k in O && O[k] === searchElement) { return k; } k++; } return -1; }; }例子：
var index = drinks.indexOf('雪碧');alert(index);//0类似的还有lastIndexOf，用于获取数组中某个元素最后一次出现的位置。如果数组没有这个元素，则返回-1。
该方法的实现：
//获取某元素在数组中最后一次出现的下标if (!Array.prototype.lastIndexOf) { Array.prototype.lastIndexOf = function(searchElement ) { 'use strict'; if (this === void 0 || this === null) { throw new TypeError(); } var n, k, t = Object(this), len = t.length >>> 0; if (len === 0) { return -1; } n = len - 1; if (arguments.length > 1) { n = Number(arguments[1]); if (n != n) { n = 0; } else if (n != 0 && n != (1 / 0) && n != -(1 / 0)) { n = (n > 0 || -1) * Math.floor(Math.abs(n)); } } for (k = n >= 0 ? Math.min(n, len - 1) : len - Math.abs(n); k >= 0; k--) { if (k in t && t[k] === searchElement) { return k; } } return -1; };}通过这两个方法，我们可以来做一些有意思的事情了。比如，判断一个对象是否为数组？
IE9 以上的浏览器，已经支持通过Array.isArray()来验证一个对象是否为数组了。
比如：
var result = Array.isArray([]);alert(typeof []);//objectalert(result); //true那么，如果我们自己来实现，又该如何做呢？下面给出一个简单思路，
简单模拟一下这个过程：
//首先，让我们来看一看数组的构造器是咋样的？console.log([].constructor.toString()); 于是便有了
var Array = function(){ } Array.isArray = function(obj){ return obj.constructor.toString().indexOf('Array') != -1;} var result = Array.isArray([]); alert(result); //true虽然取巧了点，不过目的确实达到了。
2.数组封装
通过数组的一些基本方法，我们可以开始自己模拟一下java中的ArrayList了
代码如下：
//模拟ArrayListfunction ArrayList(){ var arr = []; //用于保存数据的数组 var length = 0; //数组的长度，默认为0 this.isEmpty = function(){ return length == 0; } this.size = function(){ return length; } this.contains = function(obj){ if(arr.indexOf(obj) != -1){ return true; } return false; } this.add = function(obj){ length = length + 1; arr.push(obj); } this.remove = function(obj,deleteAll){ var len = arr.length; for(var i = 0 ;i < len ;i++){ if(arr[i] == obj){ arr.splice(i,1); length = length - 1; if(!deleteAll){ break; } } } } this.get = function(index){ if(index > length - 1){ return null; } return arr[index]; } this.toArray = function(){ return arr; } this.indexOf = function(obj){ var rstArr = []; var count = 0; for(var i = 0 ;i < length ;i++){ if(obj == arr[i]){ rstArr[count++] = i; } } if(count == 1){ return rstArr[0]; } return rstArr; } this.toString = function(){ return arr.toString(); }} //测试代码var list = new ArrayList();list.add('张三');list.add('李四');list.add('王五');list.add('赵六');list.add('王五');console.log(list.size());console.log(list.toString());console.log(list.contains('张三'));list.remove('王五',true); //null,undefined,''console.log(list.toString());console.log(list.get(0));console.log(list.get(1));console.log(list.get(2));console.log(list.size()); console.log(list.toArray());list.add('张三');list.add('张三');console.log(list.toArray());console.log(list.indexOf('张三'));console.log(list.indexOf('赵六'));运行结果：
关于“JavaScript常用方法和封装实例分析”这篇文章的内容就介绍到这里，感谢各位的阅读！相信大家对“JavaScript常用方法和封装实例分析”知识都有一定的了解，大家如果还想学习更多知识，欢迎关注编程网行业资讯频道。
