js函数技巧
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
// 通过判断参数个数,模拟函数重载
function add(){
if(arguments.length ==1){
return arguments[0]+5;
}else if(arguments.length == 2){
return arguments[0] + arguments[1];
}
}
console.log(add(5))
console.log(add(15,45)); //Function对象
var doadd = new Function('arg1',"arg2","return (arg1+arg2)");
console.log(doadd(3,5)); //Function对象的属性:length和方法valueof(),toString();这两个方法返回函数的源代码,length返回,要求的参数个数; function add(num1,num2){
return num1 + num2;
}
console.log(add.length);
console.log(add.valueOf());
console.log(add.toString()); //函数是对象,函数可以有自己的属性和方法
function fun(num){
console.log('111');
}
fun.hi= function(){
console.log("hi,haha");
}
fun();
fun.hi(); //工厂函数
function createCar(color,size,logo){
var obj = new Object;
obj.color =color;
obj.logo = logo;
obj.size = size;
return obj;
}
var car1 = createCar("red","4","benchi");
console.log(car1); var car2 = createCar("blue","3","bwm");
console.log(car2); // 构造函数
function Car(size,color,logo){
this.color = color;
this.logo = logo;
this.size = size;
}
var car3 = new Car("5","green","dazhong");
console.log(car3); var car4 = new Car("6","black","jiefang");
console.log(car4); //原型方式
function Car(){
Car.prototype.color = "red";
Car.prototype.size = "7";
Car.prototype.logo = "dongfanghong"; }
var car5 = new Car();
console.log(car5);
var car6 = new Car();
console.log(car6); //混合构造、原型方法
function Cat(age,color){
this.age = age;
this.color = color;
}
Cat.prototype.eat = function(){
console.log("吃五个老鼠!");
}
var cat1 = new Cat("3","white");
console.log(cat1);
var cat2 = new Cat("4","black");
console.log(cat2); //动态原型方法
function Cat(age,color){
this.age = age;
this.color = color;
if(typeof Car._initialized == "undefined"){
Car.prototype.eat = function(){
console.log("吃五个老鼠!")
}
Car._initialized == true;
}
} //对象连接字符串
function StringBuffer(){
this._strings_ = new Array();
}
StringBuffer.prototype.append = function(str){
this._strings_.push(str);
}
StringBuffer.prototype.toString = function(str){
return this._strings_.join("");
} var buffer = new StringBuffer();
buffer.append("hello");
buffer.append("world");
buffer.append(" nihao");
console.log(buffer.toString()); //修改对象 //通过已有的方法创建新方法
Number.prototype.toHexString = function(){
return this.toString(16);
}
var b = 15;
console.log(b.toHexString()); //重命名已有方法
Array.prototype.enqueue = function(item){
this.push(item);
}
Array.prototype.dequeue = function(){
this.shift();
}
var arr = ["1","a"];
arr.enqueue("b");
console.log(arr);
arr.dequeue("1");
console.log(arr); //添加新方法
Array.prototype.indexOf = function(item){
for(var i=0;i<this.length;i++){
if(this[i] == item){
return i;
}
}
return -1;
}
console.log(arr.indexOf("b")); //为本地对象添加新方法
//如果想给 ECMAScript 中每个本地对象添加新方法,必须在 Object 对象的 prototype 属性上定义它。
Object.prototype.showValue = function(){
console.log(this.valueOf());
}
var str = "hello";
str.showValue(); //重定义已有的方法
// Function.prototype.toString = function(){
// return "function code hidden!";
// }
// function sayHi(){
// console.log("hi");
// }
// console.log(sayHi.toString()); //覆盖原始方法前,比较安全的做法是存储它的指针,以便以后的使用。有时你甚至可能在新方法中调用原始方法
Function.prototype.originToString = Function.prototype.toString;
Function.prototype.toString = function(){
if(this.originToString().length>20){
return "Function too long to display!"
}else{
return this.originToString();
}
}
function sayHi(){
console.log("hi");
}
console.log(sayHi.toString()); //极晚绑定,先实例化对象,再定义方法,也能把方法给到之前创建的实例, 不建议这么用
var o = new Object();
Object.prototype.sayHi = function(){
console.log("hi");
}
o.sayHi(); /*所谓绑定(binding),即把对象的接口与对象实例结合在一起的方法。
早绑定(early binding)是指在实例化对象之前定义它的属性和方法,这样编译器或解释程序就能够提前转换机器代码。
在 Java 和 Visual Basic 这样的语言中,有了早绑定,就可以在开发环境中使用 IntelliSense(即给开发者提供对象中属性和方法列表的功能)。
ECMAScript 不是强类型语言,所以不支持早绑定。
另一方面,晚绑定(late binding)指的是编译器或解释程序在运行前,不知道对象的类型。
使用晚绑定,无需检查对象的类型,只需检查对象是否支持属性和方法即可。ECMAScript 中的所有变量都采用晚绑定方法。这样就允许执行大量的对象操作,而无任何惩罚。*/
</script>
</body>
</html>
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script> // 通过判断参数个数,模拟函数重载 function add(){ if(arguments.length ==1){ return arguments[0]+5; }else if(arguments.length == 2){ return arguments[0] + arguments[1]; } } console.log(add(5)) console.log(add(15,45));
//Function对象 var doadd = new Function('arg1',"arg2","return (arg1+arg2)"); console.log(doadd(3,5));
//Function对象的属性:length和方法valueof(),toString();这两个方法返回函数的源代码,length返回,要求的参数个数;
function add(num1,num2){ return num1 + num2; } console.log(add.length); console.log(add.valueOf()); console.log(add.toString());
//函数是对象,函数可以有自己的属性和方法 function fun(num){ console.log('111'); } fun.hi= function(){ console.log("hi,haha"); } fun(); fun.hi();
//工厂函数 function createCar(color,size,logo){ var obj = new Object; obj.color =color; obj.logo = logo; obj.size = size; return obj; } var car1 = createCar("red","4","benchi"); console.log(car1);
var car2 = createCar("blue","3","bwm"); console.log(car2);
// 构造函数 function Car(size,color,logo){ this.color = color; this.logo = logo; this.size = size; } var car3 = new Car("5","green","dazhong"); console.log(car3);
var car4 = new Car("6","black","jiefang"); console.log(car4);
//原型方式 function Car(){ Car.prototype.color = "red"; Car.prototype.size = "7"; Car.prototype.logo = "dongfanghong";
} var car5 = new Car(); console.log(car5); var car6 = new Car(); console.log(car6);
//混合构造、原型方法 function Cat(age,color){ this.age = age; this.color = color; } Cat.prototype.eat = function(){ console.log("吃五个老鼠!"); } var cat1 = new Cat("3","white"); console.log(cat1); var cat2 = new Cat("4","black"); console.log(cat2);
//动态原型方法 function Cat(age,color){ this.age = age; this.color = color; if(typeof Car._initialized == "undefined"){ Car.prototype.eat = function(){ console.log("吃五个老鼠!") } Car._initialized == true; } }
//对象连接字符串 function StringBuffer(){ this._strings_ = new Array(); } StringBuffer.prototype.append = function(str){ this._strings_.push(str); } StringBuffer.prototype.toString = function(str){ return this._strings_.join(""); }
var buffer = new StringBuffer(); buffer.append("hello"); buffer.append("world"); buffer.append(" nihao"); console.log(buffer.toString());
//修改对象
//通过已有的方法创建新方法 Number.prototype.toHexString = function(){ return this.toString(16); } var b = 15; console.log(b.toHexString());
//重命名已有方法 Array.prototype.enqueue = function(item){ this.push(item); } Array.prototype.dequeue = function(){ this.shift(); } var arr = ["1","a"]; arr.enqueue("b"); console.log(arr); arr.dequeue("1"); console.log(arr);
//添加新方法 Array.prototype.indexOf = function(item){ for(var i=0;i<this.length;i++){ if(this[i] == item){ return i; } } return -1; } console.log(arr.indexOf("b"));
//为本地对象添加新方法 //如果想给 ECMAScript 中每个本地对象添加新方法,必须在 Object 对象的 prototype 属性上定义它。 Object.prototype.showValue = function(){ console.log(this.valueOf()); } var str = "hello"; str.showValue();
//重定义已有的方法// Function.prototype.toString = function(){// return "function code hidden!";// }// function sayHi(){// console.log("hi");// }// console.log(sayHi.toString());
//覆盖原始方法前,比较安全的做法是存储它的指针,以便以后的使用。有时你甚至可能在新方法中调用原始方法 Function.prototype.originToString = Function.prototype.toString; Function.prototype.toString = function(){ if(this.originToString().length>20){ return "Function too long to display!" }else{ return this.originToString(); } } function sayHi(){ console.log("hi"); } console.log(sayHi.toString());
//极晚绑定,先实例化对象,再定义方法,也能把方法给到之前创建的实例, 不建议这么用 var o = new Object(); Object.prototype.sayHi = function(){ console.log("hi"); } o.sayHi();
/*所谓绑定(binding),即把对象的接口与对象实例结合在一起的方法。 早绑定(early binding)是指在实例化对象之前定义它的属性和方法,这样编译器或解释程序就能够提前转换机器代码。 在 Java 和 Visual Basic 这样的语言中,有了早绑定,就可以在开发环境中使用 IntelliSense(即给开发者提供对象中属性和方法列表的功能)。 ECMAScript 不是强类型语言,所以不支持早绑定。 另一方面,晚绑定(late binding)指的是编译器或解释程序在运行前,不知道对象的类型。 使用晚绑定,无需检查对象的类型,只需检查对象是否支持属性和方法即可。ECMAScript 中的所有变量都采用晚绑定方法。这样就允许执行大量的对象操作,而无任何惩罚。*/ </script> </body></html>
js函数技巧的更多相关文章
- 【JS小技巧】JavaScript 函数用作对象的隐藏问题
用户反馈 @消失的键盘 在论坛反馈了一个问题,在 AppBoxMvc 中的 Title 模型中,如果将 Name 属性改名为小写的 name 属性,就会报错: 因为这是一个 ASP.NET MVC 的 ...
- 【JS小技巧】JavaScript 函数用作对象的隐藏问题(F.ui.name)
用户反馈 @消失的键盘 在论坛反馈了一个问题,在 AppBoxMvc 中的 Title 模型中,如果将 Name 属性改名为小写的 name 属性,就会报错: 因为这是一个 ASP.NET MVC 的 ...
- api日常总结:前端常用js函数和CSS常用技巧
我的移动端media html{font-size:10px} @media screen and (min-width:321px) and (max-width:375px){html{font- ...
- 一探前端开发中的JS调试技巧
前言 调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问题.降低故障概率.帮助分析逻辑错误等等.而在互联网前端开发越来越重要的今 ...
- 前端开发中的JS调试技巧
前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问题.降低故障概率.帮助分析逻辑错误等等.而在互联网前端开发越来越重要的今 ...
- js小技巧总结
js小技巧总结 1.Array.includes条件判断 function test(fruit) { const redFruits = ["apple", "stra ...
- js 调试技巧
快捷键 1.快速查看HTML中dom元素绑定那些JS事件方法 chrome中 F12-->Elements-->Event Listenners 参考:https://jingy ...
- 【repost】一探前端开发中的JS调试技巧
有请提示:文中涉及较多Gif演示动画,移动端请尽量在Wifi环境中阅读 前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问 ...
- 常用 JS 函数
各种业务开发都离不开对数据的处理,然而遇到的很多数据都是不好处理的.这个时候就需要寻求搜索引擎的帮助.这种方法效率是非常低下的,而且根据作者的个性不能保证其对自己的口味.因此这篇文字包含了一份 JS ...
随机推荐
- hdu 1348 凸包模板
http://acm.hdu.edu.cn/showproblem.php?pid=1348 造城墙问题,求出凸包加上一圈圆的周长即可 凸包模板题 #include <cstdio> #i ...
- hdu 5003 模拟水题
http://acm.hdu.edu.cn/showproblem.php?pid=5003 记得排序后输出 #include <cstdio> #include <cstring& ...
- 万能的ctrl+shift+F(Element 'beans' cannot have character [children], because the type's content type is element-only.错误)
今天在spring-servlet.xml文件中出现了一个莫名其妙的错误:Element 'beans' cannot have character [children], because the t ...
- java web前端easyui(layout+tree+双tabs)布局+树+2个选项卡tabs
1.列出要实现的样式: 2.实现的代码: 分三大部分: 1):页面主体部分:mian.vm <html> <head> <title>Ks UI</title ...
- C++实现wc.exe程序
github项目地址:https://github.com/insomniali/wc 基本功能 wc.exe -c file 统计文件file的字符数 [实现] wc.exe -w fil ...
- Android-Android版美图秀秀
Android版美图秀秀,主要是修改图片的显示效果,修改图片的透明的显示范围,修改图片的红色显示范围,修改图片绿色显示范围,修改图片蓝色显示范围: 想要修改图片的颜色就必须要重新绘制,一想到重新绘制就 ...
- 使用MTR命令诊断网络问题
以前在检查网络时习惯使用ping命令,因为ping命令非常简单,现在喜欢上了mtr命令,因为它真的很强大,但是对于刚刚接触这个命令的同学来说,理解起来就没有ping命令来的那么直观了,所以今天写一 ...
- netty--NioEventLoop滴干活
netty是最近项目要用到的nio框架,找了各种资料,发现称赞它的有点多,所以决定用它:其实也就二选一嘛,mina或netty或自己写.对于mina,也不熟,不过看各种介绍,貌似netty干活还是很不 ...
- 【C#进阶】委托那些事儿(二)
二.传统的委托 接下来讲一讲方法参数.下面以“餐馆服务员为客户下单”[2]的事件作为描述.一般对事件的做法分3个部分: 1. 方法参数 EventArgs,一般用于传送数据.在本例场景中 public ...
- leetcode 最后一个单词的长度
给定一个仅包含大小写字母和空格 ' ' 的字符串,返回其最后一个单词的长度. 如果不存在最后一个单词,请返回 0 . 说明:一个单词是指由字母组成,但不包含任何空格的字符串. 示例: 输入: &quo ...