想知道封装JS代码，是怎么封装才算是真正的封装，有没有大腿给推荐的~

[Yueyongxiang]

好比说：

function test(){
/* 代码 */
}

然后我在这个调用
test();

不算是一个吗？

[天际的海浪]

如果代码只有这一个函数。没有其它的函数和外部变量。你这样当然算是封装。 如果有其它的函数和外部变量，就要写成一个对象或者类，用面向对象的方式封装。

[chen_2016_web]

你这个肯定算啦，是函数调用的一种。 推荐深入学习面向对象！懂了面向对象，其实你也懂什么是函数封装了。

[letMeAlone_]

算，只是你里面没有任何意义而已，封装是面向对象的思维方式，意思是把属性和方法封装成一个类，通过创建实例的方式实现。JS的话大致可以写成下面这样：

function test()
{
this.name='test';
this.getname=function(){

console.log(this.name)
}

}

var T=new test();//创建一个实例化对象
console.log(T.a);//调用该对象的属性
T.getname();//调用该对象的方法

[letMeAlone_]

引用 3 楼 a250758092 的回复:

算，只是你里面没有任何意义而已，封装是面向对象的思维方式，意思是把属性和方法封装成一个类，通过创建实例的方式实现。JS的话大致可以写成下面这样：

function test()
{
this.name='test';
this.getname=function(){

console.log(this.name)
}

}

var T=new test();//创建一个实例化对象
console.log(T.a);//调用该对象的属性
T.getname();//调用该对象的方法

倒数第二应该是：console.log(T.name);//调用该对象的属性,写错了

[是她丶]

引用 3 楼 a250758092 的回复:

算，只是你里面没有任何意义而已，封装是面向对象的思维方式，意思是把属性和方法封装成一个类，通过创建实例的方式实现。JS的话大致可以写成下面这样：

function test()
{
this.name='test';
this.getname=function(){

console.log(this.name)
}

}

var T=new test();//创建一个实例化对象
console.log(T.a);//调用该对象的属性
T.getname();//调用该对象的方法

function packageFun() { var length = 0; change = setInterval(function () { length++; if (length == $("#FirstPage li").length) { length = 0; } show(length); }, 5000); function show(length) { $("#FirstPage li").eq(length - 1).fadeOut(1000); //将上一张图片隐藏 $("#FirstPage li").eq(length).fadeIn(1000); //将这张图片出现 }; } packageFun(); 这个改怎么做呢

[letMeAlone_]

引用 5 楼 Yueyongxiang 的回复:

[quote=引用 3 楼 a250758092 的回复:] 算，只是你里面没有任何意义而已，封装是面向对象的思维方式，意思是把属性和方法封装成一个类，通过创建实例的方式实现。JS的话大致可以写成下面这样：

function test()
{
this.name='test';
this.getname=function(){

console.log(this.name)
}

}

var T=new test();//创建一个实例化对象
console.log(T.a);//调用该对象的属性
T.getname();//调用该对象的方法

function packageFun() { var length = 0; change = setInterval(function () { length++; if (length == $("#FirstPage li").length) { length = 0; } show(length); }, 5000); function show(length) { $("#FirstPage li").eq(length - 1).fadeOut(1000); //将上一张图片隐藏 $("#FirstPage li").eq(length).fadeIn(1000); //将这张图片出现 }; } packageFun(); 这个改怎么做呢 [/quote] 可以改成如下

	function packageFun() {
			var li_length = $("#FirstPage li").length;//作为该类的私有变量，如果放在setinterval中，每次都要去查找，就没必要了
			
			var cur_length = 0;
			this.change = setInterval(function() {//凡是带有this的成员方法或属性都是可以在外部调用的，而var声明的则为私有变量
				cur_length++;
				if(cur_length == li_length) {
					cur_length = 0;
				}
				show(cur_length);

			}, 1000);

			var show = function(length) {
				$("#FirstPage li").eq(length - 1).fadeOut(1000); //将上一张图片隐藏
				$("#FirstPage li").eq(length).fadeIn(1000); //将这张图片出现

			}

		}
		var T = new packageFun();
		console.log(T.change); //这里输出setinterval的ID

上面的写法还不是特别符合实际的情况，有种为了面向对象而面向对象的感觉，但起码看上去是这么一回事，要想写好封装，实际上你应该根据实际的需求来封装，比如你想做的是图片轮播，你应该要确定你这个图片轮播的对象应该具备哪些属性和方法，正如你用change来记录ID一样，你肯定希望能主动停止执行函数，那么你大致可以在里面写几个方法或属性： 属性：返回当前对象的setInterval的ID 方法：1 设置setInterval的循环执行的时间 2 结束轮播 3 开始轮播 所以我上面的写法你可以再进一步修改

[I1326]

你既然用的是jquery为啥不直接用jquery插件的模板直接打上呢。。。

/*
*	@author yourname
*	@email 
*	@qq 
*   @lastdate 
*   插件功能 描述，代码结构要求
*/

;(function ($) {
  var pluginName = '',  //定义插件名

  	  //插件的参数默认值
      defaults = {

      };

  //... 插件主体功能代码 ...
  $.fn[ pluginName ] = function (options) {
	  
	  var settings = $.extend({}, defaults, options);//将参数值合并到默认值
	  
	  //主体代码开始
  }

})(jQuery);