首页 文章 精选 留言 我的

精选列表

搜索[js框架],共10009篇文章
优秀的个人博客,低调大师

js实现继承

es6之前的作法: 方法一:原型链 (与java的类多层继承思想类似,python可以多重继承,MixIn是常用的设计思想) 缺点: 当父级的属性有引用类型的时候,任意一个实例修改了这个属性,其他实例都会受影响 function SuperType() { this.property = true; } SuperType.prototype.getSuperValue = function() { return this.property; } function subType() { this.property = false; } //继承了SuperType SubType.prototype = new SuperType(); SubType.prototype.getSubValue = function (){ return this.property; } var instance = new SubType(); console.log(instance.getSuperValue());//true 方法二:借用构造函数 缺点:创建多个实例 , 父类的方法会被创建多次。instance1.colors == intance2.colors // false function SuperType(){ this.colors = ["red","blue","green"]; } function SubType(){ SuperType.call(this);//继承了SuperType } var instance1 = new SubType(); instance1.colors.push("black"); console.log(instance1.colors);//"red","blue","green","black" var instance2 = new SubType(); console.log(instance2.colors);//"red","blue","green" 方法三:组合继承 缺点: 父类的构造器被调用了两次 function SuperType(name) { this.name = name; this.colors = ["red","blue","green"]; } SuperType.prototype.sayName = function() { console.log(this.name); } function SubType(name, age) { SuperType.call(this,name);//继承属性 this.age = age; } //继承方法 SubType.prototype = new SuperType(); Subtype.prototype.constructor = Subtype; Subtype.prototype.sayAge = function() { console.log(this.age); } var instance1 = new SubType("EvanChen",18); instance1.colors.push("black"); consol.log(instance1.colors);//"red","blue","green","black" instance1.sayName();//"EvanChen" instance1.sayAge();//18 var instance2 = new SubType("EvanChen666",20); console.log(instance2.colors);//"red","blue","green" instance2.sayName();//"EvanChen666" instance2.sayAge();//20 方法四:原型式继承 用一个函数包装一个对象,然后返回这个函数的调用,这个函数就变成了个可以随意增添属性的实例或对象,结果是将子对象的__proto__指向父对象 缺点:共享引用类型 (相互影响) function object(o) { function F(){} F.prototype = o; return new F(); } //示例 var person = { name:"EvanChen", friends:["Shelby","Court","Van"]; }; var anotherPerson = Object.create(person); anotherPerson.name = "Greg"; anotherPerson.friends.push("Rob"); var yetAnotherPerson = Object.create(person); yetAnotherPerson.name = "Linda"; yetAnotherPerson.friends.push("Barbie"); console.log(person.friends);//"Shelby","Court","Van","Rob","Barbie" 方法五:寄生组合式继承 改进组合继承,利用寄生式继承的思想继承原型 function inheritPrototype(subType, superType){ var protoType = Object.create(superType.prototype); //创建对象 protoType.constructor = subType; //增强对象 subType.prototype = protoType; //指定对象 } function SuperType(name){ this.name = name; this.colors = ["red", "blue", "green"]; } SuperType.prototype.sayName = function(){ alert(this.name); } function SubType(name, age){ SuperType.call(this, name); this.age = age; } inheritPrototype(SubType, SuperType) SubType.prototype.sayAge = function(){ alert(this.age); } var instance = new SubType("Bob", 18); instance.sayName(); instance.sayAge(); ====Es6class继承 继承中,如果实例化子类输出一个方法,先看子类有没有这个方法,如果有就先执行子类的 继承中,如果子类里面没有,就去查找父类有没有这个方法,如果有,就执行父类的这个方法(就近原则) 如果子类想要继承父类的方法,同时在自己内部扩展自己的方法,利用super 调用父类的构造函数,super 必须在子类this之前调用 // 父类有加法方法 class Father{ constructor(x,y) { this.x = x ; this.y = y ; } sum() { console.log(this.x + this.y); } } // 子类继承父类加法的方法, 同时 扩展减法方法 class Son extends Father { constructor (x,y){ // 利用super调用父类的构造函数 // super必须在子类this之前调用 super(x,y); this.x = x; this.y = y; } subtract(){ console.log(this.x - this.y); } } var son = new Son(20,10); son.subtract();//10 son.sum(); //30

优秀的个人博客,低调大师

JS 表单验证

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表单验证</title> </head> <body> <form name="myform" action="" onsubmit="return validateform()" method="post"> name:<input type="text" name="name"><br> <input type="submit" value="提交"> </form> <script type="text/javascript"> function validateform() { var x=document.forms["myform"]["name"].value; if (x==null || x==""){ alert("name必须填写!"); return false; } } </script> </body> </html>

优秀的个人博客,低调大师

js识别设备

console.log(window.navigator); Navigator 对象属性 appCodeName返回浏览器的代码名。 appMinorVersion返回浏览器的次级版本。 appName返回浏览器的名称。 appVersion返回浏览器的平台和版本信息。 browserLanguage返回当前浏览器的语言。 cookieEnabled返回指明浏览器中是否启用 cookie 的布尔值。 cpuClass返回浏览器系统的 CPU 等级。 onLine返回指明系统是否处于脱机模式的布尔值。 platform返回运行浏览器的操作系统平台。 systemLanguage返回 OS 使用的默认语言。 userAgent返回由客户机发送服务器的 user-agent 头部的值。 userLanguage返回 OS 的自然语言设置。 Navigator 对象方法 javaEnabled()规定浏览器是否启用 Java。 taintEnabled()规定浏览器是否启用数据污点 (data tainting)。 // 判断pc端还是移动端 function isPC() { var userAgentInfo = navigator.userAgent; var Agents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"]; var flag = true; for (var i = 0; i < Agents.length; i++) { if (userAgentInfo.indexOf(Agents[i]) > 0) { flag = false; break; } } return flag; } // 判断用户移动端使用的系统平台 function isMobile() { var u = navigator.userAgent; if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) { return "Android!"; // 安卓手机 } else if (u.indexOf('iPhone') > -1) { return "iPhone!"; // 苹果手机 } else if (u.indexOf('iPad') > -1) { return "iPad!"; // iPad手机 } else if (u.indexOf('Windows Phone') > -1) { return "Windows Phone!"; // winphone手机 } else { return false; } } // 判断用户是否在微信中打开 function isWeChat() { // toLowerCase() 方法用于把字符串转换为小写。 var ua = navigator.userAgent.toLowerCase(); if (ua.indexOf('micromessenger') != -1) { return true; } else { return false; } } document.write("是否PC:" + isPC() + "<br/>是否移动端:" + isMobile() + "<br/>是否微信:" + isWeChat()); GitHub:Fuck me on GitHub 留下你的足迹求推荐呦

资源下载

更多资源
Mario

Mario

马里奥是站在游戏界顶峰的超人气多面角色。马里奥靠吃蘑菇成长,特征是大鼻子、头戴帽子、身穿背带裤,还留着胡子。与他的双胞胎兄弟路易基一起,长年担任任天堂的招牌角色。

Nacos

Nacos

Nacos /nɑ:kəʊs/ 是 Dynamic Naming and Configuration Service 的首字母简称,一个易于构建 AI Agent 应用的动态服务发现、配置管理和AI智能体管理平台。Nacos 致力于帮助您发现、配置和管理微服务及AI智能体应用。Nacos 提供了一组简单易用的特性集,帮助您快速实现动态服务发现、服务配置、服务元数据、流量管理。Nacos 帮助您更敏捷和容易地构建、交付和管理微服务平台。

Spring

Spring

Spring框架(Spring Framework)是由Rod Johnson于2002年提出的开源Java企业级应用框架,旨在通过使用JavaBean替代传统EJB实现方式降低企业级编程开发的复杂性。该框架基于简单性、可测试性和松耦合性设计理念,提供核心容器、应用上下文、数据访问集成等模块,支持整合Hibernate、Struts等第三方框架,其适用范围不仅限于服务器端开发,绝大多数Java应用均可从中受益。

Sublime Text

Sublime Text

Sublime Text具有漂亮的用户界面和强大的功能,例如代码缩略图,Python的插件,代码段等。还可自定义键绑定,菜单和工具栏。Sublime Text 的主要功能包括:拼写检查,书签,完整的 Python API , Goto 功能,即时项目切换,多选择,多窗口等等。Sublime Text 是一个跨平台的编辑器,同时支持Windows、Linux、Mac OS X等操作系统。

用户登录
用户注册