很多天的总结::::

很一般,有一些来自网络资源,如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***030@qq.com

   参考地址

6个月前 (01-16)

  1.    独孤尚良

  yut***hanlin@qq.com

   参考地址

楼上有句话是觉得欠妥当的 —— “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);

关于htmlcss

其实在大一下的社群课就上过,当时学习的不是很认真,用的是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 指令用来在 inputselecttextareacheckboxradio 等表单控件元素上创建双向数据绑定,根据表单上的值,自动更新绑定的元素的值。

按钮的事件我们可以使用 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>

这里放了一些笔记,慢慢再学!!

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值