JavaScript常用技巧总结(持续添加中...)
在我学习过程中收集的一些常用技巧:
理解this其实很简单
this的指向是动态的,它指向:this所在函数的当前运行环境对象;若要多层使用this,则最好将this赋值给一个变量来在内层中使用var that = this;
var a = {
b: {
m: function() {
console.log(this.p);
},
p: 'Hello'
}
};
a.b.m(); //Hello
var hello1 = a.b.m; //此时hello实际上指代m函数本身,与a.b无关
hello1();//undefined 当前运行环境内无属性p;
var hello2 = a.b;
hello2.m(); //Hello 当前运行环境为对象b
工具函数:
一、继承与多重继承的实现
//父类1
function SuperClass1(){
this.x = arguments[0]||0;
this.y = arguments[1]||0;
}
SuperClass1.prototype.add = function(x,y){return x+y;};
SuperClass1.num1 = 0;
//父类2
function SuperClass2(){
this.a = 1;
}
SuperClass2.prototype.sum1 = function(x,y){return x+y;};
SuperClass2.prototype.sum2 = function(x,y){return x+y;};
//子类(继承自父类1,同时继承了父类2的所有实例属性/对象属性)
function Sub(){
SuperClass1.apply(this,arguments);
SuperClass2.call(this);
this.z = 0;
}
Sub.prototype = Object.create(SuperClass1.prototype);//此处若省略Object.create()则子类和父类共享一个原型
mixin(Sub.prototype,SuperClass2.prototype);
Sub.prototype.divide = function(x,y){return x-y;}; function mixin(toProto,fromProto){
for(var item in fromProto){
if(item !== 'constructor'){
toProto[item] = fromProto[item];
}
}
}
var s1 = new Sub();
console.log(s1) //Sub { x: 0, y: 0, a: 1, z: 0 }
console.log(Object.getOwnPropertyNames(s1.constructor.prototype));
//[ 'sum1', 'sum2', 'constructor', 'divide' ]
二、完整的复制对象p(含所有自有属性和继承属性)
function copyObject(p){
//获取p的继承属性
var o = Object.create(Object.getPrototypeOf(p));
//获取p的自有属性(若使用for..in遍历p,则仅获得p的可枚举属性)
Object.getOwnPropertyNames(p).forEach(function(item){
var des = Object.getOwnPropertyDescriptor(p,item);
Object.defineProperty(o,item,des);
});
return o;
}
复制任意对象(含任意可枚举属性)和Object.assign(o,p1,p2,..)一样,但assign方法兼容性差
var extend = function (o, p) {
for(var item in p){
var des = Object.getOwnPropertyDescriptor(p,item);
if(des&&(!des.writable
||!des.configurable
||!des.enumerable
||des.get
||des.set)){
Object.defineProperty(o,item,des);
}else{
o[item] = p[item];
}
}
};
JavaScript常用技巧总结(持续添加中...)的更多相关文章
- git常用命令(持续更新中)
git常用命令(持续更新中) 本地仓库操作git int 初始化本地仓库git add . ...
- 【github&&git】4、git常用命令(持续更新中)
git常用命令(持续更新中) 本地仓库操作git int 初始化本地仓库git add . ...
- 【前端】javaScript 常用技巧总结
javaScript 常用技巧总结 1. 彻底屏蔽鼠标右键 oncontextmenu="window.event.returnValue=false" <table b ...
- JavaScript 使用技巧(持续更新)
JavaScript 使用技巧(持续更新) 类型检测 使用Object.prototype.toString.call(obj)的方式. 因为无论typeof还是instanceof都无法做到精确判断 ...
- phpstorm 工具使用技巧(持续补充中。。。)
phpstorm 工具使用技巧(持续补充中...) 一.phpstorm大小写切换 1.选择要转换的目标字符串: //普通商家,普通折扣默认值'COMMON_DISCOUNT'=>10.00, ...
- tp5 使用技巧(持续更新中...)
tp5 使用技巧(持续更新中...) 1.自动写入时间 create_time和update_time 使用save方法才行,insert方法不生效,不知为何 2.过滤字段 allowfield和st ...
- git使用技巧集合(持续更新中)
git使用技巧集合(持续更新中) 在团队协作中,git.svn等工具是非常重要的,在此只记录一些git使用过程中遇到的问题以及解决方法,并且会持续更新. 1.git commit之后,还没push,如 ...
- Vue开发中的常用技巧(持续更新)
1. 监听子组件的生命周期例如有父组件Parent和子组件Child,如果父组件监听到子组件挂载mounted就做一些逻辑处理,常规写法可能如下: // Parent.vue <Child @m ...
- laravel中及其常用的一些函数方法(自己看)和技巧(不断添加中)
手册:https://laravelacademy.org/ 1.中间件的定义Middleware 2.路由的定义和写法 3.控制器Controller之Request 4.控制器Controller ...
随机推荐
- Spark入门实战系列--2.Spark编译与部署(上)--基础环境搭建
[注] 1.该系列文章以及使用到安装包/测试数据 可以在<倾情大奉送--Spark入门实战系列>获取: 2.Spark编译与部署将以CentOS 64位操作系统为基础,主要是考虑到实际应用 ...
- Docker - 配置DaoCloud的Docker加速器(国内registry-mirror)
由于众所周知的原因,从Docker Hub难以高效地下载镜像. 除了使用VPN或代理之外,最为有效的方式就是使用Docker国内镜像. DaoCloud是首个提供国内免费Docker Hub镜像的团体 ...
- Spring应用教程-3 依赖关系配置
注:组件与组件之间的耦合,采用依赖注入管理,但普通的JavaBean属性值,应直接在代码中设置. 1. 注入其他Bean的属性值 我们分析一下,Bean_A的一个属性要依赖Bean_B的一个属性值.这 ...
- 实用js代码大全
实用js代码大全 //过滤数字 <input type=text onkeypress="return event.keyCode>=48&&event.keyC ...
- (翻译)编写属于你的jQuery插件
Writing Your Own jQuery Plugins 原文地址:http://blog.teamtreehouse.com/writing-your-own-jquery-plugins j ...
- laravel吐槽系列之一
最近项目中经常使用到了laravel框架,对于这个框架之前只是弱弱地接触了一点,没有深入接触,这下有时间好好研究它了(主要是不得不研究了).说实话,laravel让我打开眼界了,之前对框架的使用一直停 ...
- C#多线程技术总结(异步)
我这里针对现有的C#多线程技术进行一个汇总,一是复习,二是方便索引,文章部份知识点来源于网络,非本人原创. 一.并行(异步): 1.System.Threading.Tasks命名空间下的(TPL): ...
- Node.js系列基础学习-----回调函数,异步
Node.js基础学习 Node.js回调函数 Node.js异步编程的直接体现就是回调,异步编程依托回调来实现,但不是异步.回调函数在完成任务后就会被调用,Node有很多的回调函数,其所有的API都 ...
- php实现留言功能
php真的挺好玩的! 先写出前台页面index.php: <!DOCTYPE html> <html lang="en"> <head> < ...
- .NET Core 单元测试 MSTest
.NET Core 单元测试 MSTest ,MSTest Framework 已经支持 .NET Core RC2 / ASP.NET Core RC2. 之前都是使用 xUnit.net ,现在 ...