学校操作系统实验, 要求如下:
名称:动态分区分配方式
（一）实验目的及设计思路
了解动态分区分配方式中使用的数据结构和分配算法，进一步加深对动态分区存储管理方式及其实现过程的理解。提高学生设计实验、发现问题、分析问题和解决问题的能力，并学习撰写规范的科学研究报告。
设计思路：
1．用C或其他语言分别实现采用首次适应算法和最佳适应算法的动态分区分配过程和回收过程。
2．设置初始状态，每次分配和回收后显示出空闲内存分区链的情况。
（二）涉及的内容或知识点
该实验涉及的知识点包括：分区分配，首次适应算法，最佳适应算法等。
（三）采用的方法和手段
学生查阅资料，确定具体的研究内容及设计方案。在规定的时间内，由学生输入测试数据及调试程序，独立完成实验过程，并对结果进行比较分析，撰写出规范的实验报告。
（四）考察点
对动态分区分配方式的理解与掌握情况；对微机设备的操作和使用能力；程序设计及实验调试测试的能力，对实验结果比较分析能力；实验报告的撰写能力等。
PS:
一开始大家都用c写, 不爽, 而且其他同学百度下来的代码都基本差不多. 本着坚决不雷同的想法, 第一次试水用javascript写实验报告. 哈哈, 结果不用说, 老师眼前一亮, 然后, 也不管我什么动态内存分配这些了(本来javascript就没有c语言里面malloc之类的函数...)
主页面(index.html)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>实验五(By LinJun)</title>
<link rel="stylesheet" href="./jqueryui.css">
<link rel="stylesheet" type="text/css" href="./index.css">
<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript" src="./jqueryui.js"></script>
</head>
<body>
<a href="#" class='bt_aa'>建议用ie9以上的浏览器打开,谢谢....</a>
<a href="./shiyan5.html" class='bt_a'>首次适应算法</a>
<a href="./shiyan55.html" class='bt_a'>最佳适应算法</a>
</body>
</html>首次适应算法页面(shiyan5.html)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>首次适应算法</title>
<link rel="stylesheet" href="./jqueryui.css">
<link rel="stylesheet" type="text/css" href="./index.css">
<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript" src="./jqueryui.js"></script>
</head>
<body>
<div class="init_dia">
<h4>输出创建的空闲分区数目(建议不要超过20,不然显示不下...):</h4>
<input type="text" class="tot_block">
</div>
<div class="list_block"></div>
</body>
<script type="text/javascript">
var i;
var tot;
function apply(require){
var h;
var ok=0;
$(".block").each(function(){
if (!ok){
h=parseInt($(this).css('height'));
if (h>=require){
h-=require;
$(this).fadeOut(250);
$(this).fadeIn(250);
$(this).animate({height:''+h},600,function(){
$(this).next().html(h);
});
ok=1;
}
}
})
if (!ok) alert("空间太大了, 系统没有足够的空间分配资源...");
}
$(".init_dia").dialog({
autoOpen: true,
height: 300,
width: 370,
modal: true,
title: '首次适应算法',
buttons:{
"确认":function(){
var tot_block=$(".tot_block").val();
$( this ).dialog( "close" );
for (i=0;i<tot_block;i++)
{
if (i>0)
$(".list_block").append("<span><div class='arrow'>-></div></span>");
var val=parseInt(Math.random()*100);
$(".list_block")
.append("<span><div class='block' style='height:"+val+"px'> </div>分区大小:<a class='size'>"+val+"</a><br>分区地址:"+(i+1)+"<span>");
}
// alert(tot);
$("body").append("请输入需要申请的空间大小(例如:20):<input class='require' type='text'>");
$("body").append("<a href='#' class='bt_ok'>确认</a>");
$("body").append("<a href='#' class='bt_apply' id='20'>申请20单位空间</a>");
$("body").append("<a href='#' class='bt_apply' id='40'>申请40单位空间</a>");
$("body").append("<a href='#' class='bt_apply' id='64'>申请64单位空间</a>");
$(".bt_ok").click(function(event){
event.preventDefault();
apply($(".require").val());
}).mouseover(function(){
$(this).css('background','black');
})
.mouseleave(function(){
$(this).css('background','orange');
});
$(".bt_apply").click(function(event){
event.preventDefault();
apply($(this).attr('id'));
}).mouseover(function(){
$(this).css('background','black');
})
.mouseleave(function(){
$(this).css('background','#A6E03D');
});
},
"返回":function(){
window.location.href='./index.html';
}
}
});
</script>
</html>
最佳适应算法页面(shiyan55.html)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>最佳适应算法</title>
<link rel="stylesheet" href="./jqueryui.css">
<link rel="stylesheet" type="text/css" href="./index.css">
<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript" src="./jqueryui.js"></script>
</head>
<body>
<div class="init_dia">
<h4>输出创建的空闲分区数目(建议不要超过20,不然显示不下...):</h4>
<input type="text" class="tot_block">
</div>
<div class="list_block"></div>
</body>
<script type="text/javascript">
var block_vals;
var block_adds;
var i,j,k,tmp;
var tot;
var tot_block;
function sort_block(){
for (i=0;i<tot_block;i++){
k=i;
for (j=i+1;j<tot_block;j++){
if (block_vals[k]>block_vals[j]) k=j;
}
tmp=block_vals[k];
block_vals[k]=block_vals[i];
block_vals[i]=tmp;
tmp=block_adds[k];
block_adds[k]=block_adds[i];
block_adds[i]=tmp;
}
var ii=0;
$(".block").each(function(){
$(this).animate({height:''+block_vals[ii]},600,function(){
});
$(this).next().html(block_vals[ii]);
$(this).next().next().next().html(block_adds[ii]);
ii++;
})
}
function apply(require){
var h;
var ok=0;
var ii=0;
$(".block").each(function(){
if (!ok){
h=parseInt($(this).css('height'));
if (h>=require){
h-=require;
$(this).fadeOut(250);
$(this).fadeIn(250);
$(this).animate({height:''+h},600,function(){
});
ok=1;
$(this).next().html(h);
block_vals[ii]=h;
sort_block();
}
}
ii++;
})
if (!ok){
alert("空间太大了, 系统没有足够的空间分配资源...");
}
}
$(".init_dia").dialog({
autoOpen: true,
height: 300,
width: 370,
modal: true,
title: '最佳适应算法',
buttons:{
"确认":function(){
tot_block=$(".tot_block").val();
$( this ).dialog( "close" );
block_vals=Array(tot_block);
block_adds=Array(tot_block);
for (i=0;i<tot_block;i++)
{
if (i>0)
$(".list_block").append("<span><div class='arrow'>-></div></span>");
var val=parseInt(Math.random()*100);
$(".list_block")
.append("<span><div class='block' style='height:"+val+"px'> </div>分区大小:<a class='size'>"+val+"</a><br>分区地址:<a class='address'>"+(i+1)+"</a><span>");
block_vals[i]=val;
block_adds[i]=i+1;
}
// alert(tot);
$("body").append("请输入需要申请的空间大小(例如:20):<input class='require' type='text'>");
$("body").append("<a href='#' class='bt_ok'>确认</a>");
$("body").append("<a href='#' class='bt_apply' id='20'>申请20单位空间</a>");
$("body").append("<a href='#' class='bt_apply' id='40'>申请40单位空间</a>");
$("body").append("<a href='#' class='bt_apply' id='64'>申请64单位空间</a>");
$(".bt_ok").click(function(event){
event.preventDefault();
apply($(".require").val());
}).mouseover(function(){
$(this).css('background','black');
})
.mouseleave(function(){
$(this).css('background','orange');
});
$(".bt_apply").click(function(event){
event.preventDefault();
apply($(this).attr('id'));
}).mouseover(function(){
$(this).css('background','black');
})
.mouseleave(function(){
$(this).css('background','#A6E03D');
});
sort_block();
},
"返回":function(){
window.location.href='./index.html';
}
}
});
</script>
</html>
css文件
body{
margin: 20px auto;
width: 900px;
}
.bt_a{
text-decoration: none;
color: white;
font-size: 33px;
padding: 10px;
border-radius: 15px;
display: block;
margin: 30px;
background: orange;
border-left: 15px solid #DFBB94;
}
.bt_aa{
text-decoration: none;
color: white;
font-size: 33px;
padding: 10px;
border-radius: 15px;
display: block;
margin: 30px;
background: #E4D8C3;
text-align: center;
cursor:default;
}
.list_block{
float:left;
width: 780px;
border-right:2px solid black;
}
.list_block span{
margin-top: 30px;
height: 110px;
width: 110px;
float: left;
font-size: 12px;
}
.block{
background: #0cf;
border-radius: 100%;
width: 100px;
float: left;
text-align: center;
line-height: 20px;
}
.arrow{
font-size: 40px;
text-align: center;
width: 50px;
height: 50px;
line-height: 70px;
float:left;
}
.require{
float: right;
width: 110px;
}
.bt_ok{
float: right;
background: orange;
text-align: center;
width: 105px;
padding: 5px;
color: white;
text-decoration: none;
}
.bt_apply{
float: right;
background: #A6E03D;
text-align: center;
width: 105px;
padding: 15px 5px 15px 5px;
color: white;
text-decoration: none;
font-size: 13px;
margin-top: 30px;
}最后的显示效果是:
主界面:
初始化界面:
web程序运行:
最终显示效果可以参考(包括一些动画):在线演示
3164
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
