在我学习过程中收集的一些常用技巧:

typeof x !== undifined 判断x是否已定义;
x === Object(x)  判断x是否为对象;
Object.keys(x).length 获取对象x所有可枚举的元素的个数;
Object.getOwnPropotyNames(x).length 获取对象x所有元素的个数;
注意:var p1 = Object.create(p);对象p1只继承了p的属性,但未继承它的属性描述符,此时p1的继承属性的描述符为空;
for in循环遍历对象的所有可枚举属性,x.hasOwnPropoty(item)判断是否是自有属性;
Object.prototype.toString.call(x).slice(8,-1) 获取对象x的类型;
str.substring(index1,index2)和str.slice(index1,index2)虽然效果一样,但最好优先使用slice方法,str.substr(index,n)也是取一段字符串但第二个参数表示取的字符个数;
!! a 或 Boolean(a) 获得一个变量a对应的布尔值;
在构造函数内实行严格模式(首行加'use strict')可避免忘记用new命令来调用构造函数而引起的未知错误,或者在构造函数内添加判断this instanceof Foo看是否能生成实例,不能则返回一个实例;
如果一个对象被freeze冻结了,那么他将不能添加、更改、删除所有属性的值,但仍然可通过在他的原型上添加属性来给他添加属性;若他的属性也是对象,则该属性指向该对象的引用不可更改,但对象本身是可以改变的;
Array.apply(null,array1)调用Array构造函数来讲数组array1中的空元素变成undefined,数组的forEach方法会跳过空元素,但是不会跳过undefined,把undefined当着值对待;
array1.forEach(callback(currentValue,index,array1),thisArg);其中可选参数thisArg指定在forEach内的this的指向;
call、apply、bind这三个方法,来切换/固定this的指向,也可用来调用对象的原生方法,如Math.max.apply(null,array1)获得数组array1的最大值;
call、apply绑定对象并指向方法,而bind仅绑定对象并返回新方法:var func2 = func1.bind(obj,x1,y1..)将方法func1绑定给obj对象,返回一个新方法并可指定预设参数值;
因为每调用bind一次就会返回一个新函数,所以应该把这个新函数赋值给一个变量后再拿来用,防止无法取消绑定!
理解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常用技巧总结(持续添加中...)的更多相关文章

  1. git常用命令(持续更新中)

    git常用命令(持续更新中) 本地仓库操作git int                                 初始化本地仓库git add .                       ...

  2. 【github&&git】4、git常用命令(持续更新中)

    git常用命令(持续更新中) 本地仓库操作git int                                 初始化本地仓库git add .                       ...

  3. 【前端】javaScript 常用技巧总结

    javaScript 常用技巧总结 1.  彻底屏蔽鼠标右键  oncontextmenu="window.event.returnValue=false" <table b ...

  4. JavaScript 使用技巧(持续更新)

    JavaScript 使用技巧(持续更新) 类型检测 使用Object.prototype.toString.call(obj)的方式. 因为无论typeof还是instanceof都无法做到精确判断 ...

  5. phpstorm 工具使用技巧(持续补充中。。。)

    phpstorm 工具使用技巧(持续补充中...) 一.phpstorm大小写切换 1.选择要转换的目标字符串: //普通商家,普通折扣默认值'COMMON_DISCOUNT'=>10.00, ...

  6. tp5 使用技巧(持续更新中...)

    tp5 使用技巧(持续更新中...) 1.自动写入时间 create_time和update_time 使用save方法才行,insert方法不生效,不知为何 2.过滤字段 allowfield和st ...

  7. git使用技巧集合(持续更新中)

    git使用技巧集合(持续更新中) 在团队协作中,git.svn等工具是非常重要的,在此只记录一些git使用过程中遇到的问题以及解决方法,并且会持续更新. 1.git commit之后,还没push,如 ...

  8. Vue开发中的常用技巧(持续更新)

    1. 监听子组件的生命周期例如有父组件Parent和子组件Child,如果父组件监听到子组件挂载mounted就做一些逻辑处理,常规写法可能如下: // Parent.vue <Child @m ...

  9. laravel中及其常用的一些函数方法(自己看)和技巧(不断添加中)

    手册:https://laravelacademy.org/ 1.中间件的定义Middleware 2.路由的定义和写法 3.控制器Controller之Request 4.控制器Controller ...

随机推荐

  1. docker 1.8.2 源代码编译

    编译docker的必要条件 这阵子在公司搞docker container这些技术,docker编译网上查了一下木有靠谱的.只好自己动手丰衣足食了. 声明:你编译docker不需要git pull它的 ...

  2. 帮助你实现漂亮界面的14套免费的 HTML/CSS 源码

    在网络上能找很多免费的 PSD 格式素材,但是很少有 HTML/CSS 界面组件下载.在这篇文章中,收集了14套免费的 HTML/CSS 界面源码分享给前端设计师和开发者们.这些组件包括按钮.滑块.表 ...

  3. 开启事务时mybatis返回主键id

    先说一下没有注解的 先给出实体类: public class City { private int city_id; private String city_name; public int getC ...

  4. Tornado框架

    Tornado介绍 Tornado 是 FriendFeed 使用的可扩展的异步非阻塞式 web 服务器及其相关工具的开源版本.这个 Web 框架看起来有些像web.py(豆瓣用这个写的) 或者 Go ...

  5. DirectoryHelper

    /// <summary> /// 将相对路径转换成程序所在的绝对路径 /// </summary> /// <param name="path"&g ...

  6. [JS] 使用RequireJS引用UMeditor

    UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码. 而UMeditor则是UEditor删减版. ...

  7. JQuery学习笔记---jquery对象和DOM对象的关系

    1.DOM(Document  Object Model,文档对象模型).DOM树 { html (head&&body),  head(meta && title) ...

  8. Git for Windows v2.11.0 Release Notes

    homepage faq contribute bugs questions Git for Windows v2.11.0 Release Notes Latest update: December ...

  9. Dispose() C# 优化内存

    public void Dispose() { ((IDisposable)_designer).Dispose(); } #region IDisposable Support private bo ...

  10. Winform防止程序重复运行

    需求:1.点击“关闭”按钮时,程序最小化到托盘,并没有退出,这时再次运行程序,不会重复运行,而是显示已运行的程序:2.支持不同目录:3.支持修改名称. 代码(不支持修改名称,不支持不同目录): usi ...