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 ...
随机推荐
- 可视化(番外篇)——SWT总结
本篇主要介绍如何在SWT下构建一个应用,如何安装SWT Designer并破解已进行SWT的可视化编程,Display以及Shell为何物.有何用,SWT中的常用组件.面板容器以及事件模型等. 1.可 ...
- 解决erlang节点启动失败报["inet_tcp",econnrefused]的问题
今天有同事说他机器上的leofs启动不了.我用console起了一下,发现报如下错: {error_logger,{{2015,11,3},{6,23,6}},"Protocol: ~tp: ...
- jQuery.Data源码
jQuery.data的是jQuery的数据缓存系统.它的主要作用就是为普通对象或者DOM元素添加数据. 1 内部存储原理 这个原理很简单,原本要添加在DOM元素本身的数据,现在被集中的存储在cach ...
- web前端学习笔记(CSS变化宽度布局)
一.“1-2-1”单列变宽布局: 对于变宽度的布局,首先要使内容的整体宽度随浏览器窗口宽度的变化而变化.因此中间的container容器中的左右两列的总宽度也会变化,这样就会产生不同的情况.这两列是按 ...
- Android Activity返回键控制的两种方式
Android Activity返回键监听的两种方式 1.覆写Activity的OnBackPressed方法 官方解释: Called when the activity has detected ...
- js基础篇——encodeURI 和encodeURIComponent
转自zccst的又一次掉进encodeURIComponent的坑里了 问题: ajax.get ( url+'?k1'=v1+'&k2'=v2+'&k3'=v3, ... ); 由于 ...
- 使用Python将HTML转成PDF
主要使用的是wkhtmltopdf的Python封装--pdfkit 安装 1. Install python-pdfkit: $ pip install pdfkit 2. Install wkht ...
- C#基础整理参数
基本概念 把数据传入方法中,可以使方法有多个返回值. 参数的传递 值参数,通过将实参的值复制到形参的方式传递数据.值参数的实参可以是变量或者是表达式
- 使用ASP.NET 4的自动启动特性,解决ASP.NET第一次访问速度慢问题
些web应用在可以处理用户访问之前,需要装载很多的数据,或做一些花费很大的初始化处理.今天使用 ASP.NET 的开发人员经常使用应用的Global.asax 文件中的 “Application_St ...
- 【Java每日一题】20161202
20161201问题解析请点击今日问题下方的"[Java每日一题]20161202"查看 package Dec2016; public class Ques1202 { publ ...