JavaScript函数笔记:(7)实战案例2(JavaScript)

本文深入探讨了JavaScript中的高级编程概念,包括记忆函数优化、模块构建、柯里化、高阶函数、递归算法及尾递归优化等。通过具体实例展示了如何利用这些技术提升代码效率和可维护性。
记忆

函数可以利用对象去记住先前操作的结果,从而能避免无谓的运算。这种优化被称为记忆。JavaScript的对象和数组要实现这种优化是非常方便的。

使用递归函数计算fibonacci数列。

var fibonacci=function(n){
	return n<2?n:fibonacci(n-1)+fibonacci(n-2);
};
for(var i=0;i<=10;i+=1){
	document.write("<br/>"+i+';'+fibonacci(i));
}

在这里插入图片描述

使用临时变量保存存储结构,存储结果隐藏在闭包中。

var fibonacci=(function(){
	var memo=[0,1];
	var fib=function(n){
		var result=memo[n];
		if(typeof result !=='number'){
			result=fib(n-1)+fib(n-2);
			memo[n]=result;
		}
		return result;
	};
	return fib;
}());
for(var i=0;i<=10;i+=1){
	document.write('<br/>'+i+';'+fibonacci(i));
}

在这里插入图片描述

构建模块

使用函数和闭包可以构建模块。所谓模块,就是一个提供接口却隐藏状态与实现的函数或对象。通过使用函数构建模块,可以完全摒弃全局变量的使用,从而规避JavaScript语言缺陷。全局变量是JavaScript最为糟糕的特征之一,在一个大中型web应用中,全局变量简直就是一个魔鬼,会带来无穷的灾难。

var serial_marker=function(){
	var prefix='';
	var seq=0;
	return {
		set_prefix:function(p){
			prefix=String(p);
		},
		set_seq:function(s){
			seq=s;
		},
		gensym:function(){
			var result=prefix+seq;
			seq+=1;
			return result;
		}
	};
};
var seqer=serial_marker();
seqer.set_prefix('Q');
seqer.set_seq(1000);
var unique=seqer.gensym();
document.write(unique);
document.write("<br/>");
var unique=seqer.gensym();
document.write(unique);

在这里插入图片描述

柯里化

柯里化是把接收多个参数的函数变换成接收一个单一参数的函数,并且返回一个新函数,这个新函数能够接收原函数的参数。

function adder(num){
	return function(x){
		return num+x;
	}
}
var add5=adder(5);
var add6=adder(6);
document.write(add5(1));
document.write("<br/>")
document.write(add6(5));

在这里插入图片描述
函数柯里化的主要功能是提供强大的动态函数创建支持。通过调用另一个函数并为它传入要柯里化(currying)的函数和必要的参数,通俗地说就是利用已有的函数,再创建一个动态函数,该动态函数内部还是通过已有的函数来发生作用,只是传入更多的参数来简化函数的参数方面的调用。

函数柯里化的基本方法和函数绑定是一样的;使用一个闭包返回一个函数。
创建柯里化函数的通用方式:

function curry(fn){
	var args=Array.prototype.slice.call(arguments,1);
	return function(){
		var innerArgs=Array.prototype.slice.call(arguments);
		var finalArgs=args.concat(innerArgs);
		return fn.apply(null,finalArgs);
	};
}
高阶函数

高阶函数作为函数编程众多风格中的一项显著特征,经常被使用。实际上,高阶函数是对函数的进一步抽象。

高阶函数至少满足下列条件之一:

  • 接收函数作为输入。
  • 输出一个函数。

在函数式语言中,函数不但是一种特殊的对象,还是一种类型,因此函数本身是一个可以传来传去的值。也就是说,某个一个函数在刚开始执行的时候,可以送入一个函数的参数。传入的参数本身就是一个函数。当然,这个输入的函数相当于某一个函数的另外一个函数。当函数执行完毕之后,又可以返回另外一个新的函数,这个返回函数取决于return fn(){……}。

例子-函数作为参数

alert([2,6,4,9,0,2,5].sort());

在这里插入图片描述
高阶函数

function map(array,func){
	var res=[];
	for(var i=0,len=array.length;i<len;i++){
		res.push(func(array[i]));
	}
	return res;
}
var mapped=map([1,3,5,7,8],function(n){
	return n=n+1;
});
document.write(mapped);
var mapped2=map(["one","two","three","four"],function(item){
	return "("+item+")";
});
document.write("<br/>");
document.write(mapped2);

在这里插入图片描述

递归算法

递归是函数对自身的调用。任何一个有意义的递归总是由两部分组成的:递归调用和递归终止条件,递归运算在无限制的情况下,会无休止地自身调用。。显然,程序不应该出现这种无休止的递归调用,只应出现有限次数、有终止的调用。为此,一般递归运算中要结合if语句来进行控制。只有在某条件成立才可以继续执行递归调用,否则就不再继续。

问题的定义是递归的
数学上常用阶乘函数、幂函数和斐波那契数列。

var f=function(x){
	if(x<2){
		return 1;
	}else{
		return x*arguments.callee(x-1);
	}
}
alert(f(5));

在这里插入图片描述
问题所涉及的数据结构是递归的
问题本身虽然不是递归定义的,但是它所用到的数据结构是递归的。

function f(n){
	var a=1;
	if(n.nodeType==1){
		a++;
	}
	var child=n.childNodes;
	for(var i=0;i<child.length;i++){
		i+=f(child[i]);
	}
	return 1;
}
window.onload=function(){
	var body=document.getElementsByTagName("body")[0];
	alert(f(body));
}

在这里插入图片描述

问题的解决满足递归的特性
Hanoi(汉诺)塔问题

function f(n,a,b,c){
	if(n==1){
		document.write(a+"&rarr;"+c+"<br/>");
	}else{
		f(n-1,a,c,b);
		document.write(a+"&rarr;"+c+"<br/>");
		f(n-1,b,a,c);
	}
}
f(3,"A","B","C");

在这里插入图片描述

尾递归算法

尾递归是针对传统递归算法的一种优化算法,它是从最后开始计算,每递归一次就是出相应的结果。也就是说,函数调用出现在调用函数的尾部,因为是尾部,所以就不用去保存任何局部变量,返回时调用函数就可以直接越过调用者,返回调用者的调用者。

阶乘的一种普通线性递归运算。

function f(n){
	return (n==1)?1:n*f(n-1);
}
alert(f(5));

在这里插入图片描述

尾递归算法

function f(n){
	return (n==1)?1:e(n,1);
}
function e(n,a){
	return (n==1)?a:e(n-1,a*n);
}
alert(f(5));

在这里插入图片描述

比较:

  • 线性递归:f(n),返回值会被调用者使用。
  • 尾递归:f(m,n),返回值不会被调用者使用。

尾递归由于 直接返回值,不需要保存临时变量,所以性能不会产生线性增加,并且JavaScript解释器会将尾递归形式优化。

内容概要:文章以“智能网页数据标注工具”为例,深入探讨了谷歌浏览器扩展在毕业设计中的实战应用。通过开发具备实体识别、情感分类等功能的浏览器扩展,学生能够融合前端开发、自然语言处理(NLP)、本地存储与模型推理等技术,实现高效的网页数据标注系统。文中详细解析了扩展的技术架构,涵盖Manifest V3配置、内容脚本与Service Worker协作、TensorFlow.js模型在浏览器端的轻量化部署与推理流程,并提供了核心代码实现,包括文本选择、标注工具栏动态生成、高亮显示及模型预测功能。同时展望了多模态标注、主动学习与边缘计算协同等未来发展方向。; 适合人群:具备前端开发基础、熟悉JavaScript和浏览器机制,有一定AI模型应用经验的计算机相关专业本科生或研究生,尤其适合将浏览器扩展与人工智能结合进行毕业设计的学生。; 使用场景及目标:①掌握浏览器扩展开发全流程,理解内容脚本、Service Worker与弹出页的通信机制;②实现在浏览器端运行轻量级AI模型(如NER、情感分析)的技术方案;③构建可用于真实场景的数据标注工具,提升标注效率并探索主动学习、协同标注等智能化功能。; 阅读建议:建议结合代码实例搭建开发环境,逐步实现标注功能并集成本地模型推理。重点关注模型轻量化、内存管理与DOM操作的稳定性,在实践中理解浏览器扩展的安全机制与性能优化策略。
基于Gin+GORM+Casbin+Vue.js的权限管理系统是一个采用前后端分离架构的企业级权限管理解决方案,专为软件工程和计算机科学专业的毕业设计项目开发。该系统基于Go语言构建后端服务,结合Vue.js前端框架,实现了完整的权限控制和管理功能,适用于各类需要精细化权限管理的应用场景。 系统后端采用Gin作为Web框架,提供高性能的HTTP服务;使用GORM作为ORM框架,简化数据库操作;集成Casbin实现灵活的权限控制模型。前端基于vue-element-admin模板开发,提供现代化的用户界面和交互体验。系统采用分层架构和模块化设计,确保代码的可维护性和可扩展性。 主要功能包括用户管理、角色管理、权限管理、菜单管理、操作日志等核心模块。用户管理模块支持用户信息的增删改查和状态管理;角色管理模块允许定义不同角色并分配相应权限;权限管理模块基于Casbin实现细粒度的访问控制;菜单管理模块动态生成前端导航菜单;操作日志模块记录系统关键操作,便于审计和追踪。 技术栈方面,后端使用Go语言开发,结合Gin、GORM、Casbin等成熟框架;前端使用Vue.js、Element UI等现代前端技术;数据库支持MySQL、PostgreSQL等主流关系型数据库;采用RESTful API设计规范,确保前后端通信的标准化。系统还应用了单例模式、工厂模式、依赖注入等设计模式,提升代码质量和可测试性。 该权限管理系统适用于企业管理系统、内部办公平台、多租户SaaS应用等需要复杂权限控制的场景。作为毕业设计项目,它提供了完整的源码和论文文档,帮助学生深入理解前后端分离架构、权限控制原理、现代Web开发技术等关键知识点。系统设计规范,代码结构清晰,注释完整,非常适合作为计算机相关专业的毕业设计参考或实际项目开发的基础框架。 资源包含完整的系统源码、数据库设计文档、部署说明和毕
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值