您的位置: 首页  >  文章  >  很多天的总结：：：：

很多天的总结：：：：

分类: 文章 • 2025-04-22 16:59:40

很一般，有一些来自网络资源，如mooc网、菜鸟教程等。

Java（一）

关于Java，这里就先谈一下之前的学习经历。

现在想想Java还真是厉害。当年还是滑盖式不能触屏或者触屏能力很一般的手机时代，很多手机游戏，都是用Java做的。记得当年游戏打开界面就是一个这样的图标。

很多天的总结：：：：

不过……也是今天才算知道，原来java和JavaScript不是一个东东…。

“Java和JavaScript的区别

1.Java是面向对象的语言，JavaScript是脚本语言，是基于对象和事件驱动的语言。

2.Java的源代码在执行之前必须经过编译，而JavaScript的代码不需要，可以由浏览器直接解释执行。

3.Java变量在使用之前必须声明，反之不要。

4.代码的格式不一样。”摘自网络上的他人总结。也是因为自己确实之前搞混在一起了。

Java的话，这一学期才开始接触，装了eclipse这个IDE（由此发现IDE真的是很占用内存空间、带电脑速度很慢的软件）。这一学期学习上有所懈怠，所以Java课的学习很是一般，学习了Java的很基础很基础的内容。其中也有跟石老师上过好几次jeesite的课，但是学习效果依旧不是很佳。

关于Java的基础知识：

1.java的运行机制：先编译为class文件、java虚拟机，继而实现Java的跨平台运行。

2.Java的数据类型、表达式、运算符、程序控制语句等，都与之前学习过的C差别有，但可以接受。

3.面向对象是java的一大特点：类、成员方法、对象、包，等等是java学习的要点所在。

4.继承、子类、多态性、接口，也是Java的比较重要的特点。

5.图形用户界面、窗体、按钮菜单等，是java与用户交互的重要特点。

6.异常处理与多线程、applet，是后续的延伸。

大致java的学习就这些方面。

JavaScript（二）

学习JavaScript。

首先，为什么：

“为什么学习 JavaScript?

JavaScript web 开发人员必须学习的 3 门语言中的一门：

 

HTML 定义了网页的内容

CSS 描述了网页的布局

JavaScript 网页的行为”——这是菜鸟教程给出的解释。

JavaScript每次的运转，都要输入<script></ script>（脚本放在这中间，继而可能接“function”函数），可以输出HTML、做出反应、改变HTML的内容、改变HTML的图像、改变样式、验证输入等等。

脚本可放置于<body>、<head>部分中，浏览器将解释执行位于 <script> 和 </script>之间的 JavaScript 代码；

JavaScript的函数：通常的做法是把函数放入 <head> 部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。

这里网友的笔记是：外部文件不用<script>标签，直接写JavaScript代码即可；onclick时，注意是“οnclick=函数名+（）”；

输出上，JavaScript没有任何打印或输出的函数，教程上告诉了四种输出方法：window.alert()弹出警告框，加载好页面后直接弹出提示框；document.write直接写入HTML文档；操作写入到HTML元素，doucument.getElementById(id)方法，id标识HTML元素，innerHTML接内容；console.log()浏览器开发者工具显示。

JavaScript的语法：字面量literal，Number可以是整数、小数、科学计数，String可以用单引双引号，表达式字面量计算，数组Array字面量，对象Object字面量，函数Function字面量；驼峰法命名规则（很多编程语言都常用）；JavaScript对大小写敏感；JavaScript的数据类型与函数调用。

一些笔记知识：123e5是123乘以10的5次方；驼峰法又分为小驼峰大驼峰下划线等；JavaScript是弱类型编程语言，定义变量用var，定义后可以用typeof()来获取变量的数据类型，但typeof()不能用来判断是Array还是Object，但可以用isArray或instanceof来判断（两个方法都不是很懂…）

语句上很多和其他编程语言一致，但JavaScript是脚本语言，浏览器读取代码时，逐行地执行，而传统编程在执行前对所有代码进行编译；JavaScript会忽略多余空格；JavaScript中分号结束语句是可选的。

注释这里需要注意的是，注释除了用作解释外，还可以被用来组织执行，以方便测试代码；同时，注释还可以被用来验证浏览器是否支持JavaScript，如这样的代码：

<script>

<!--

document.write("您的浏览器支持JavaScript脚本!");

//-->

</script>

浏览器支持JavaScript，则输出此字符串，不支持则不输出此字符串。

JavaScript的语句和变量都对大小写敏感；为变量赋值是数值时，不要使用引号，用引号包围数值，会被当作文本来处理。

好的编程习惯是，在代码开始处，就统一对需要的变量进行声明；需要注意，一条语句中声明的多个不可以赋同一个值，如下面的：

var x,y,z=1;

x,y 为 undefined， z 为 1。

Value = underfined的情况也时有发生；重新声明JavaScript变量，变量的值不会丢失；

这里还有let变量的存在：

let var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]];

let允许声明一个作用域被限制在块级中的变量、语句或者表达式。Function的局部变量推荐使用let变量，避免变量名冲突；let声明的变量只在其声明的块或子块中可用，与var相似。二者之间最主要的区别在于var声明的变量的作用域是整个封闭函数。

const关键字用来声明JavaScript中的常量，不能重新赋值，并且不能重新声明。

下面的是菜鸟教程上的笔记部分没有看懂的部分，放在这里细细研究。

  1. avaScript 允许重复声明变量，后声明的覆盖之前的
  1. var a = 1;
  2. var a = 'x';
  3. console.log(a);

// 输出 'x'

JavaScript 允许重复定义函数

JavaScript 没有重载这个概念，它仅依据函数名来区分函数。

后定义的同名函数覆盖之前的，与参数无关。

function test() {

    console.log("test");

}

test();     //输出 "test arg0 + undefined"

 

function test(arg1) {

    console.log("test arg" + arguments.length + " + " + arg1);

}

test(1,2);  //输出 "test arg2 + 1"

实参个数如果比形参少，那么剩下的默认赋值为 undefined，如果实参传的比形参数量多，那么是全部都会被传进去的，只不过没有对应的形参可以引用（但可以用 arguments 来获取剩下的参数）。

function test(arg1) {

    for(var i=0; i<arguments.length; i++) {

        console.log(arguments[i]);

    }

}

test(1,2); //输出 1 2

变量与函数重名的时候，变量生效

这涉及到了变量和函数的预解析：

    • 变量声明会被顶置，函数声明也会被顶置且比变量更先声明。
    • 变量的声明和赋值语句一起写时，JS引擎在解析时，会将其拆成声明和赋值2部分，声明置顶，赋值保留在原来位置。
    • 声明过的变量不会再重复声明。

var a = 100;

function a() {

    return "function";

}

console.log(a);     //输出 100

console.log(a());  

/*

报错

Uncaught TypeError: a is not a function

    (anonymous function) @test.html:9

*/

JS 中有两种函数，一种是普通函数，一种是函数对象。下面的这种就是“函数对象”，它实际上是声明一个匿名函数，然后将该函数的 init 方法赋值给该变量。

var a = 100;

var a = function() {

    return "function";

}

console.log(a);

/*

输出

function() {

    return "function";

}

*/

console.log(a());   //输出 "function"

函数与内部变量重名

定义普通函数，即在 window 变量下，定义一个 key，它的名字为该函数名，值为该函数的地址。函数内部的 this 指向 window 对象。

function a() {

    console.log(this);  //输出 window{...}

    this.a = 1;         //即 window.a = 1，此时window下的function a已经被该变量覆盖了。

    var a = 5;          //下面的这几个变量都是局部变量，仅在花括号范围内有效。 

    a = 10;

    var v = "value"

    return "function";

}

console.log(a);         //输出 function a {...}

console.log(a());       //输出 "function"

console.log(a);         //输出 1

console.log(v);

/*

输出

Uncaught ReferenceError: v is not defined

    (anonymous function) @ mycolor.html:15

*/

TheArrow

   TheArrow

  191***[email protected]

 

6个月前 (01-16)

  1.    独孤尚良

  yut***[email protected]

 

楼上有句话是觉得欠妥当的 —— “JavaScript 允许重复声明变量，后声明的覆盖之前的”。

JavaScript 允许变量被重复声明，在声明变量时 JavaScript 会自行判断这个变量是否已经被声明了，如果已经被声明（即已经存在），那么重复声明（即除了变量的非首次声明）会被跳过，不再执行声明的操作。

JavaScript 变量的值是可以被重复赋值的，最后的赋值是这个变量最后的结果。

var a=1;

var a=2;

 

//赋值覆盖相当于：

var a;

//a=1;

a=2;

 

//声明覆盖相当于：

//var a=1;

var a=2;

这个笔记所说的覆盖，其实是赋值的覆盖。如果说后声明的会覆盖已声明的，那么后声明的应该是 undefined 而不是第一次声明时候的赋值，也就是说如果是声明覆盖的话，相当于没有 var a=1 那么一个只有声明没有赋值的变量，它的值就是 undefined。

我们如何验证这个覆盖是声明的覆盖还是赋值的覆盖呢？看下面的代码：

var a=1;

var a;

 

//赋值覆盖相当于：

var a;

//a=1;

a;

 

//声明覆盖相当于：

//var a=1;

var a;

我们再输出a的值，验证下是 undefined 还是 1 就知道了。

console.log(a);

关于html和css

其实在大一下的社群课就上过，当时学习的不是很认真，用的是DW做的。当时一共上了8节课好像，都是周六上午上4h。经常是老师在上面敲代码自己在下面跟着敲（和日后学习别的一样）。学习了一些基础的与深入一点点的标签与css。布置的作业都是临摹的，最后是自己选一个网页自己去临摹交上去。当时学习的不是很好。

7月1号，老师找的慕课网上的html+css教程。跟着教程又重新学习了一遍。以下是罗列一些教程里的一部分知识：HTML、css、JS之间的关系、认识标签和标签语法、<head>、<p><strong><span><q>、<blockquote><br><hr><ul><div>、<table><a><img>、表单、文本框、下拉框、提交按钮；之后是css：包括内联式、嵌入式、外部式；选择器、继承、格式化排版；最后几章比较深入，分别是盒模型的边框、填充和边界，流动与浮动模型，绝对相对固定定位，及各种颜色、字体、长度、居中等的小技巧。

在学习html的过程中，我觉得，肯定首先是，多敲：html的代码还算不是很复杂，它的标签就那么应该是几十个，常用的（目前按我的水准）不超过20个，如何用这20个去实现各种风格标准完全不同的网页，熟练度是第一的，基操是每个学习html/css的同学都必须掌握的。在掌握好操作后，就是一个将各种操作揉碎吸收的过程了，就像是PS的临摹教程一样，明明是大家都知道的操作（像铅笔呀什么的）但是可以做到手不抖、线很直的也不是一天两天就练成的。Html也是如此。很花哨很好看的网页、很简洁的网页，都有自己的不同的风格和框架：比如下面这几个：

很多天的总结：：：：

很多天的总结：：：：

同样的网页截图，可见vans的整体画风比nike的花哨一些。

很多天的总结：：：：很多天的总结：：：：

天猫和京东的对比，电商平台网站的整体风格较为接近，差异不大。

Vue.js

Vue.js是一套构建用户界面的渐进式框架，只关注视图层，自底向上增量开发。

Vue应用需要通过实例化vue来实现，语法格式如下：

var vm = new Vue({

  // 选项

})

el参数用来找到DOM元素中的id，data定义数据，methods用于定义的函数、return返回函数值。{{}}用于输出对象属性和函数返回值。

而vue的实例化，指的是：实例被创建时，向vue的响应系统中加入了其data对象中能找到的所有的属性。

Vue.js 模板语法

Vue.js 使用了基于 HTML 的模版语法，允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。

Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。

结合响应系统，在应用状态改变时， Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。

插值

文本

数据绑定最常见的形式就是使用 {{...}}（双大括号）的文本插值：

文本插值

<div id="app"> <p>{{ message }}</p> </div>


Html

使用 v-html 指令用于输出 html 代码：

v-html 指令

<div id="app"> <div v-html="message"></div> </div> <script> new Vue({ el: '#app', data: { message: '<h1>菜鸟教程</h1>' } }) </script>


属性

HTML 属性中的值应使用 v-bind 指令。

以下实例判断 class1 的值，如果为 true 使用 class1 类的样式，否则不使用该类：

v-bind 指令

<div id="app"> <label for="r1">修改颜色</label><input type="checkbox" v-model="use" id="r1"> <br><br> <div v-bind:class="{'class1': use}"> v-bind:class 指令 </div> </div> <script> new Vue({ el: '#app', data:{ use: false } }); </script>


表达式

Vue.js 都提供了完全的 JavaScript 表达式支持。

JavaScript 表达式

<div id="app"> {{5+5}}<br> {{ ok ? 'YES' : 'NO' }}<br> {{ message.split('').reverse().join('') }} <div v-bind:id="'list-' + id">菜鸟教程</div> </div> <script> new Vue({ el: '#app', data: { ok: true, message: 'RUNOOB', id : 1 } }) </script>


指令

指令是带有 v- 前缀的特殊属性。

指令用于在表达式的值改变时，将某些行为应用到 DOM 上。如下例子：

实例

<div id="app"> <p v-if="seen">现在你看到我了</p> </div> <script> new Vue({ el: '#app', data: { seen: true } }) </script>


这里， v-if 指令将根据表达式 seen 的值(true 或 false )来决定是否插入 p 元素。

参数

参数在指令后以冒号指明。例如， v-bind 指令被用来响应地更新 HTML 属性：

实例

<div id="app"> <pre><a v-bind:href="url">菜鸟教程</a></pre> </div> <script> new Vue({ el: '#app', data: { url: 'http://www.runoob.com' } }) </script>


在这里 href 是参数，告知 v-bind 指令将该元素的 href 属性与表达式 url 的值绑定。

另一个例子是 v-on 指令，它用于监听 DOM 事件：

<a v-on:click="doSomething">

在这里参数是监听的事件名。

修饰符

修饰符是以半角句号 . 指明的特殊后缀，用于指出一个指令应该以特殊方式绑定。例如，.prevent 修饰符告诉 v-on 指令对于触发的事件调用 event.preventDefault()：

<form v-on:submit.prevent="onSubmit"></form>

用户输入

在 input 输入框中我们可以使用 v-model 指令来实现双向数据绑定：

双向数据绑定

<div id="app"> <p>{{ message }}</p> <input v-model="message"> </div> <script> new Vue({ el: '#app', data: { message: 'Runoob!' } }) </script>


v-model 指令用来在 input、select、textarea、checkbox、radio 等表单控件元素上创建双向数据绑定，根据表单上的值，自动更新绑定的元素的值。

按钮的事件我们可以使用 v-on 监听事件，并对用户的输入进行响应。

以下实例在用户点击按钮后对字符串进行反转操作：

字符串反转

<div id="app"> <p>{{ message }}</p> <button v-on:click="reverseMessage">反转字符串</button> </div> <script> new Vue({ el: '#app', data: { message: 'Runoob!' }, methods: { reverseMessage: function () { this.message = this.message.split('').reverse().join('') } } }) </script>


过滤器

Vue.js 允许你自定义过滤器，被用作一些常见的文本格式化。由"管道符"指示, 格式如下：

<!-- 在两个大括号中 -->

{{ message | capitalize }}

 

<!-- 在 v-bind 指令中 -->

<div v-bind:id="rawId | formatId"></div>

过滤器函数接受表达式的值作为第一个参数。

以下实例对输入的字符串第一个字母转为大写：

实例

<div id="app"> {{ message | capitalize }} </div> <script> new Vue({ el: '#app', data: { message: 'runoob' }, filters: { capitalize: function (value) { if (!value) return '' value = value.toString() return value.charAt(0).toUpperCase() + value.slice(1) } } }) </script>


过滤器可以串联：

{{ message | filterA | filterB }}

过滤器是 JavaScript 函数，因此可以接受参数：

{{ message | filterA('arg1', arg2) }}

这里，message 是第一个参数，字符串 'arg1' 将传给过滤器作为第二个参数， arg2 表达式的值将被求值然后传给过滤器作为第三个参数。

缩写

v-bind 缩写

Vue.js 为两个最为常用的指令提供了特别的缩写：

<!-- 完整语法 -->

<a v-bind:href="url"></a>

<!-- 缩写 -->

<a :href="url"></a>

v-on 缩写

<!-- 完整语法 -->

<a v-on:click="doSomething"></a>

<!-- 缩写 -->

<a @click="doSomething"></a>

这里放了一些笔记，慢慢再学！！

 

相关推荐