js封装(常见)

var Person ={

    name :‘alan‘,
    sayHello:function(){
        alert(‘hello ‘+ this.name);
    }

};

var p = Object.create(Person);
console.log(p);
p.sayHello();
function Person (info){
    this._init_(info);
}

Person.prototype ={
    constructor:Person,

    _init_:function(info){

        this.names = info.name;
        this.age = info.age;
        this.gender = info.gender;

    },
    sayHello:function(){
        // console.log(‘hello‘);
        alert(‘hello‘);
    }
    // demo:function(){},

};

var clzhang = new Person({
    name:‘clzhang‘,
    age:‘1111‘,
    gender:‘‘
});

clzhang.sayHello()//hello

巧妙

// 类jQuery 封装
var Person = function (info){

    return new Person.prototype.init(info);
};

Person.prototype ={
    constructor:Person,

    init:function(info){

        this.names = info.name;
        this.age = info.age;
        this.gender = info.gender;

    },
    sayHello:function(){
        // console.log(‘hello‘);
        alert(‘hello2‘);
    }
    // demo:function(){},

};

Person.prototype.init.prototype = Person.prototype;

var clzhang = new Person({
    name:‘clzhang‘,
    age:‘1111‘,
    gender:‘‘
});

clzhang.sayHello()//hello2

闭包

var Person = (function(window){

    var Person = function (info){

    return new Person.prototype.init(info);
};

Person.prototype ={
    constructor:Person,

    init:function(info){

        this.names = info.name;
        this.age = info.age;
        this.gender = info.gender;

    },
    sayHello:function(){
        // console.log(‘hello‘);
        alert(‘hello3‘);
    }
    // demo:function(){},

};

Person.prototype.init.prototype = Person.prototype;

return Person;
})();

var clzhang =  Person({
    name:‘clzhang‘,
    age:‘1111‘,
    gender:‘‘
});

clzhang.sayHello()//hello3
时间: 2024-10-26 04:13:13

js封装(常见)的相关文章

原生JS封装Ajax插件(同域&&jsonp跨域)

抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正确的地方,还望指正^_^ 一.Ajax核心,创建XHR对象 Ajax技术的核心是XMLHttpRequest对象(简称XHR),IE5是第一款引入XHR对象的浏览器,而IE5中的XHR对象是通过MSXML库中的一个ActiveX对象实现的,因此在IE中可能有3个版本,即MSXML2.XMLHttp.

用jQuery基于原生js封装的轮播

我发现轮播在很多网站里面都用到过,一个绚丽的轮播可以为网页增色不少,最近闲来无事,也用原生js封装了一个轮播,可能不像网上的插件那么炫,但是也有用心去做.主要用了闭包的思想.需要传递的参数有:图片地址的数组,图片宽度,上一页,下一页的id,图片列表即ul的id(这儿使用无序列表排列的图片),自动轮播间隔的时间.功能:实现了轮播的自动轮播,可以点击上一页,下一页进行切换. 下面是html中的代码,只需要把存放的容器写好,引入jquery即可: <!DOCTYPE html><html>

一款在论坛上看到的JS封装的随机过渡方式的图片切换效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

原生JS封装AJAX

今天我们来说说利用原生JS封装AJAX. jquery框架的AJAX方法确实很好用,但有时候我们写的页面需要引入多个JS插件,不一定哪个插件就会和jquery发生冲突,导致jquery用不了了.或者页面比较简单,不需要加重浏览器的负担,这时我们自己封装一个AJAX就是一个很好的办法. //将数据转换成 a=1&b=2格式;function json2url(json){   var arr = [];   //加随机数防止缓存;   json.t = Math.random();   for(v

城市三级联动 AJAX-原生js封装

话不多说我们先来一张效果图给大家看一下: html代码如下: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>城市三级联动 - citys-原生js封装</title> <link rel="shortcut icon" href="../public/image/favi

JS封装cookie操作函数实例(设置、读取、删除)

本文实例讲述了JS封装cookie操作函数.分享给大家供大家参考,具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 /*设置cookie*/ function setCookie(name, value, iDay) {   var oDate=new Date();   oDate.setDate(oDate.getDate()+iDay);   document.cook

js封装好的模仿qq消息弹窗代码

在我们的日常开发中,或者生活中,经常需要用到弹出窗.这里我们就用js模拟一下qq消息一样的弹出窗. 直接贴代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&

js中常见的数据类型

js中常见的数据类型分为两种:基本数据类型.复杂数据类型. 基本数据类型把数据名和值直接存储在栈中. 复杂数据类型在栈中存储数据名和一个堆的地址,在堆中存储属性及值.访问时先从栈获取地址, 再到堆中拿出相应的值 总结:基本数据类型复制的是值,复杂数据类型复制的是引用地址. 为什么划分数据类型? 计算机为了更方便的对内存进行管理,对不同的数据,做了类型上的划分. 如何查看一个变量的数据类型? 使用typeof命名 例如: var x = 5; var res typeof x; 变量的数据类型有

原生js封装的一些jquery方法

用js封装一些常用的jquery方法 记录一下 hasClass:判断是否有class function hasClass(ele, cls) { if (!ele || !cls) return false; if (ele.classList) { return ele.classList.contains(cls); } else { return ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)')); }} addCla

JS封装Cookie

/* @黑眼诗人 <www.chenwei.ws> */<script> //设置cookie: cookie名,cookie值,天数 function setCookie(name, value, iDay) { var oDate = new Data(); oDate.setDate(oDate.getDate() + iDay); document.cookie = name+ '=' +value+ '; expires = '+oDate } //获取cookie fu