01-javascript基础学习笔记

编程,无非就是写指令。不过面对黑白相接的C/C++等语言,太过于枯燥。不知道哪天开始,就喜欢上了能直接看到效果的前端,谨以本账号在简书记录一下本人在前端的学习生涯。

说起来对javascript这个语言,了解也有一段时间了。只是一直堕于记笔记,确实是一个非常致命的习惯。所以今天开始尽量多在简书上写一下自己的学习感受与笔记吧。先上一点基础内容。

说起任何一种新的事物,每个人最开始的困惑一定是,这个东西是做什么的,有什么用,好。那么我们就先了解一下js这门语言。


1.javascript相关知识的介绍

1.1 js的作用
主要作用就是用来实现网页中的各种功能,以及制作酷炫的网页特效,同时对新手接触编程来说又是非常友好的一门若变量类型语言,不需要像iOS与安卓开发一样关注内存释放的问题,却也可以同时完成移动端的开发工作。

1.2 js与ECMA的关系
javascript是由公司开发而成的,欧洲的这个ECMA组织,制定了js的标准,取名为ECMAScript

1.3 js的现状

  • 前些年之前,js被认为是“牛皮癣”,用来制作页面上的广告,如弹窗、漂浮的广告条之类的。以至于浏览器推出了屏蔽广告的功能。
  • 2004年js命运开始改变,那一年谷歌公司开始带头使用Ajax技术,并从当时开始逐步提升用户体验。
  • 2007年乔布斯发布了iPhone,这一年,用户就多了上网的途径,就是用移动设备上网,js在移动页面中,也是不可或缺的。并且这一年,互联网开始标准化,按照W3C规则三层分离,结构,样式,JS。人们越来越重视js了。
  • 2011年,node.js诞生,使js能够开发服务器程序了。

2.标识符###

2.1 什么是标识符

  • 程序员自己在程序中起的一些名字就叫标识符

2.2 标识符的作用

  • 从字面来理解,就是用来表示某些东西的符号,标识的目的就是为了将这些东西区分开来
  • 其实标识符的作用跟人类的名字差不多,为了区分每个人,就在每个人出生的时候起了个名字
  • 比如,我们在学习选择器中的class选择器或者id选择器的时候,给标签的class或者id起名字一样

2.3 标识符命名规则(必须遵守什么?)

  • 只能由26个英文字母的大小写、10个阿拉伯数字(0~9)、下划线或$符号组成
  • 严格区分大小写:比如A和a是两个不同的标识符
  • 不能以数字开头
  • 不能是ECMAScript的保留关键字,详询W3C

2.4 标识符的命名规范?

  • 起一个有意义的名字,能够提高代码的可读性
  • 驼峰命名法(除开头第一个单词,后面每个单词的首字母都大写)

3.常量###

3.1 什么是常量?
表示一些固定的数据,也就是不能改变的数据,比如:1、2、3、4、5、6、7、a、b、c


4.变量###

4.1 什么是变量?

  • 表示的数据可以经常修改的,当一个数据的值需要经常改变或者不确定时,就应该用变量来表示
  • 比如:游戏的积分
  • 超市存储物品的小柜子

4.2 声明变量及变量的赋值

  • 4.2.1 先定义后初始化
  • 使用var关键字来生命变量(var LG),变量声明之后,该变量是空的(它没有值),如需向变量赋值,请使用“=”复制,如LG="ZL";
  • 4.2.2 定义的同时进行初始化
  • 也可以在声明变量时对其复制,如var LG="ZL";
  • 4.2.3 同时定义多个变量
var name="ZL",age=22,job="CEO";
  • 4.2.4 声明也可以跨越多行:
var name="ZL",
       age=22,
       job="CEO";
  • 4.2.5 value=undefine
    在计算机程序重,经常会声明无值的变量。未赋值的变量,其值实际上是undefined。如在执行过:var LG后,变量LG的值将为undefined。

5.运算符

5.1 算术运算符

+  加
-  减 
*  乘
/  除
%  取余
++  自加
--  自减

5.2 赋值运算符

=  赋值
+=  加等于
-=  减等于
*=  乘等于
/=  除等于
%=  取余等于

5.3 关系运算符(比较运算符)

==  是否相等(值相等)
===  是否全等(值与类型都相等)
>  大于
<  小于
>=  大于等于
<=  小于等于
!=  不等

5.4 逻辑运算符

&&  与(都为真才为真)
||  或(一真则真)
!  非(取反)

5.5 条件运算符、三目运算符(三元运算符),多数情况用于给变量赋值

var rst = a>b?a:b;    //理解为a是否大于b,如果是,则返回a,否则返回b

6.数据类型

6.1 string,字符串,用引号包裹,在js中单双引号效果相同,不过定义字符串尽量先使用双引号,字符串里面再需要引号时使用单引号,外双内单。
6.2 number,数值型(有整型与浮点型)
6.3 bool,布尔型(只有真或假)
6.4 null,空值(没有值,可用于清除变量,暂时的理解)
6.5 undefined,未定义(有值,值为undefined,常见于定义了变量,但未对其进行赋值)
6.6 array,数组
6.7 object,对象


7.条件语句,用于进行流程控制###

7.1 if语句

语法:
if(条件){
//执行语句
}

7.2 if...else语句

语法:
if(条件){
//执行语句
}else{
//执行语句
}

7.3 if...else if...else语句,可无限往下写条件进行流程控制

语法:
if(条件){
//执行语句
}else if(条件){
//执行语句
}else{
//执行语句
}

8.switch语句###

8.1 语法

switch(n)
{
case 1:
  执行代码块 1
  break;
case 2:
  执行代码块 2
  break;
default:
  n 与 case 1 和 case 2 不同时执行的代码
}

8.2 工作原理
工作原理:首先设置表达式 n(通常是一个变量)。随后表达式的值会与结构中的每个 case 的值做比较。如果存在匹配,则与该 case 关联的代码块会被执行。请使用 break 来阻止代码自动地向下一个 case 运行。

8.3 注意default关键词
使用default关键词来规定匹配不存在时做的事情


9.javascript中的内置函数,简单了解###

9.1 console对象

  • console.log(控制台输出内容)

9.2 prompt函数

  • 接收用户输入的值,返回值为字符串。

10.练习###

10.1 请用prompt输入三个并使用三目运算符求出最大值

代码:
    var num1 = parseInt(prompt("请输入第一个值")),
        num2 = parseInt(prompt("请输入第二个值")),
        num3 = parseInt(prompt("请输入第三个值"));
    var rst = num3>(num1>num2?num1:num2)?num3:(num1>num2?num1:num2);
    console.log(rst);

10.2 要求用户输入月份,弹出对应的季度

代码:
    var month = parseInt(prompt("请输入月份"));
    switch (month){
        case 3:
        case 4:
        case 5:
            alert(month+"月是春天");
            break;
        case 6:
        case 7:
        case 8:
            alert(month+"月是夏天");
            break;
        case 9:
        case 10:
        case 11:
            alert(month+"月是秋天");
            break;
        case 12:
        case 1:
        case 2:
            alert(month+"月是冬天");
            break;
        default:
            alert("您输入的是无效内容,请重新输入");
    }

10.3 要求用户输入分数,求成绩等级

代码:
    var score = parseInt(prompt("输入成绩"));
    
    if(score>=80&&score<=100){
        alert("优秀");
    }else if(score>=60&&score<80){
        alert("中等");
    }else if(score>=0&&score<60){
        alert("不及格");
    }else{
        alert("输入的成绩非法")
    }

求分数也可用switch来写,但是有一个问题是分数除以十以后,若向下取整那么101到109分数的也会显示优秀,在不使用if语句时无法解决问题。向上取整时则-1到-9会显示不及格,不满足客观事实,所以不予采用switch写分数判断


11.while与do...while循环,重复做相同的事情###

11.1 While 循环会在指定条件为真时循环执行代码块

语法:
while(条件){
  //执行语句
}

11.2 do/while循环是 while 循环的变体。该循环会执行一次代码块,在检查条件是否为真之前,然后如果条件为真的话,就会重复这个循环。

语法:
do{
  //执行语句
}while(条件)
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,835评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,598评论 1 295
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,569评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,159评论 0 213
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,533评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,710评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,923评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,674评论 0 203
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,421评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,622评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,115评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,428评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,114评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,097评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,875评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,753评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,649评论 2 271

推荐阅读更多精彩内容