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 ...
随机推荐
- （最小生成树） Arctic Network -- POJ --2349
链接: http://poj.org/problem?id=2349 Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 1371 ...
- （最小生成树）Truck History --POJ -- 1789
链接: http://poj.org/problem?id=1789 Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 2213 ...
- 移动端与PC端的viewport
第一种解析: 设备像素,就是我们直觉上觉得"靠谱"的像素,这些像素为所使用的各种设备提供了正规的分辨率,并且其值可以通过(通常情况下)从screen.width/height属性中 ...
- Elasticsearch 的一些关键概念
我更喜欢把 Elasticsearch 作为一种 nosql 去理解,它的一些开发概念和 MongoDB 以及 Redis 没有太大的区别,不过了解 Elasticsearch 中的一些核心概念对于你 ...
- Spring Boot 2 实践记录之 Redis 及 Session Redis 配置
先说 Redis 的配置,在一些网上资料中,Spring Boot 的 Redis 除了添加依赖外,还要使用 XML 或 Java 配置文件做些配置,不过经过实践并不需要. 先在 pom 文件中添加 ...
- WebAPI Token 验证
WebAPI Token 验证 登录端 //HttpContext.Current.Session.Timeout = 10; ////生成Ticket //FormsAuthenticationTi ...
- C#treeView控件单击事件选中节点滞后问题解决方法
问题描述:在treeView的Click事件中,选中的节点SelectedNode并不是您刚才点击的节点,总是上一次选中的节点,节点选中滞后的问题. 解决方案:在treeView的MouseDown事 ...
- .Net Core WebApi返回的json数据，自定义日期格式
基本上所有的人都在DateTime类型的字段,被序列化成json的时候,遇到过可恨的Date(1294499956278+0800):但是又苦于不能全局格式化设置,比较难受.以往的方式,要么使用全局的 ...
- wpf控件拖动
Thumb 拖动 上代码! <Window x:Class="Thumb控件移动.MainWindow" xmlns="http://schemas.microso ...
- 解决oninput在输入中文时，会获取拼音的问题
(1)起因:在今天做项目测试的时候发现的问题,在用微软自带的输入法的时候,输入中文,文本框会获得拼音 如图所示: (2)解决办法:经过一段时间的百度查找,最后通过这篇文章找到了解决的方法,这里给出网址 ...