发表于： 2019-11-16 22:11:37
1 1094
今日完成:
2.掌握javascript的基本语法；
JavaScript 是一个程序语言。语法规则定义了语言结构。
JavaScript 是一个脚本语言。
它是一个轻量级，但功能强大的编程语言。
//
JavaScript 字面量
在编程语言中，一般固定值称为字面量，ex: 3.14。/ex:1001/ex:123e5
数字（Number）字面量 可以是整数或者是小数，或者是科学计数(e)
ex:
代码:
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 123e5;
</script>
效果
12300000
效果描述:
html中p标签id="#"和js中Id("#"),通过相同的"#"联系起来,(ps:#可以是任意名字,但是要一致)
123,编译123,e5编译为00000(5个0)结合:12300000
/
字符串（String）字面量 可以使用单引号或双引号:ex:"John Doe"/ex:'John Doe'
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 'John Doe';
</script>
显示:John Doe
/
表达式字面量 用于计算：ex:5 + 6/ex:5 * 10
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 * 10;
</script>
显示:50
/
数组（Array）字面量 定义一个数组：
ex:[40, 100, 1, 5, 25, 10]
对象（Object）字面量 定义一个对象：
ex:{firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}
函数（Function）字面量 定义一个函数：
ex:function myFunction(a, b) { return a * b;}
/
JavaScript 语句
JavaScript 语句向 id="demo" 的 HTML 元素输出文本 "你好 Dolly" ：
ex:
<p id="demo">我的第一个段落。</p>
<script>
document.getElementById("demo").innerHTML = "你好 Dolly";
</script>
显示:
你好 Dolly
总结:
就是innerHTML直接在对应id标签中输出覆盖原本内容
/
分号 ;
分号用于分隔 JavaScript 语句。
通常我们在每条可执行的语句结尾添加分号。
使用分号的另一用处是在一行中编写多条语句。
ex:
a = 5;
b = 6;
c = a + b;
等于:a = 5; b = 6; c = a + b;
ps:
在 JavaScript 中，用分号来结束语句是可选的。
所以,在 JavaScript 中可能看到不带有分号的案例。
/
JavaScript 代码
JavaScript 代码是 JavaScript 语句的序列。
浏览器按照编写顺序依次执行每条语句。
ex:
<p id="demo">一个段落。</p>
<div id="myDIV">一个 DIV。</div>
<script>
document.getElementById("demo").innerHTML="你好 Dolly";
document.getElementById("myDIV").innerHTML="你最近怎么样?";
</script>
显示:
你好 Dolly
你最近怎么样?
扩展:
1.两个都是getElementById("demo"),
显示:
你最近怎么样?
一个 DIV。
2.两个都是getElementById("demo"),且后者大写字母
结果:大写无效
3.不设置id名称(or设置没有对应id,设错),观看是整个语法错误,无法生效,还是只有正确生效,生效一部分
显示:按照语句的书写顺序,id有对应的生效,自没有对应的的语句开始,之后全都无效,
4.颠倒js语句顺序,显示无变化,颠倒对应的html语句,显示颠倒后的效果
5.s
总结:
1.js语句相同id,不同内容,根据在html页面的位置,后者的内容覆盖前者
2.js语句中id识别大小写,视为两个id
3.js语句包含多条内容,id必须一一对应,当没有对应id时,以这段js语句开始,之后的内容全部无效,
原因:html文件没有预编译,(从上往下编译),所以,当一个js语句中包含两个或以上内容时,
一段js语句,第二个语句没有对应id的html标签,js语句就发生错误,除了第一个效,之后的全部无效
(哪怕之后的语句有对应的id),假如第一个js语句就没有对应的id,或者不设置对应id,不管其后的js语句是否有对应id的html标签,
这段js语句都是无效的
ps:可以被相同id的后面的js语句覆盖,但是不能没有
4.js语句与html对应语句,顺序不一致,也是生效的,显示顺序,以对应的html的标签顺序为准,与js语句中的顺序无关
5.在不触发3,js语句错误的情况下
2个js语句对应3个html标签,两个标签id相同,生效,但是js文件只生效一次,按照在标签html中的顺序,第一个生效,另一个无效还是原本内容.
/
JavaScript 代码块
JavaScript 可以分批地组合起来。
代码块以左花括号开始，以右花括号结束。
代码块的作用是一并地执行语句序列。
{
document.getElementById("demo").innerHTML="你好Dolly";
document.getElementById("myDIV").innerHTML="你最近怎么样?";
}
这就是一个代码块,上述例子,就是代码块的情况下总结
/
JavaScript 语句标识符
JavaScript 语句通常以一个 语句标识符 为开始，并执行该语句。
ps:语句标识符是保留关键字不能作为变量名使用
/
空格
JavaScript 会忽略多余的空格。您可以向脚本添加空格，来提高其可读性。下面的两行代码是等效的：
ex:
var person="Hege";
var person = "Hege";
总结:js语句中可以为了增加可读性,而设置空格,它在被浏览器读取时会忽略掉这些空格,而不会因为多一个空格造成整个js语句失效
/
对代码行进行折行
ex:
document.write("你好 \ 正确
世界!");
document.write \ 错误
("你好世界!");
原因:待寻
/
JavaScript 注释
JavaScript 不会执行注释
作用:
1.添加注释来对 JavaScript 进行解释，或者提高代码的可读性
2.注释用于阻止代码块的执行（可用于调试）
单行注释以 // 开头。
ex:
// 输出标题：
document.getElementById("myH1").innerHTML="欢迎来到我的主页";
// 输出段落：
document.getElementById("myP").innerHTML="这是我的第一个段落。"
var x=5; // 声明 x 并把 5 赋值给它
var y=x+2; // 声明 y 并把 x+2 赋值给它
多行注释以 /* 开始，以 */ 结尾。
ex:
/*
下面的这些代码会输出
一个标题和一个段落
并将代表主页的开始
*/
document.getElementById("myH1").innerHTML="欢迎来到我的主页";
document.getElementById("myP").innerHTML="这是我的第一个段落。
ps:
应用注释符号验证浏览器是否支持 JavaScript 脚本功能
ex:
<script>
<!--
document.write("JavaScript脚本!");
//-->
</script>
原理:
HTML注释符号是以 <-- 开始以 --> 结束的。在此注释符号内编写 JavaScrip t脚本，使用 JavaScript 脚本在页面中输出一个字符串，
如果浏览器不支持JavaScript 脚本,就会把整个JavaScript 脚本给注释掉,如果支持,
JavaScript 脚本的注视符号"//"就会把html注释符号"-->"给注释掉,输出字符串
//
JavaScript 变量
就像代数那样
x=5
y=6
z=x+y
在代数中，我们使用字母（比如 x）来保存值（比如 5）。
通过上面的表达式 z=x+y，我们能够计算出 z 的值为 11。
在 JavaScript 中，这些字母被称为变量。
ps:把变量看做存储数据的容器。
ex:
<script>
var x=5;
var y=6;
var z=x+y;
document.write(x + "<br>");
document.write(y + "<br>");
document.write(z + "<br>");
</script>
显示:
5
6
11
/
JavaScript 变量
与代数一样，JavaScript 变量可用于存放值（比如 x=5）和表达式（比如 z=x+y）。
变量可以使用短名称（比如 x 和 y），也可以使用描述性更好的名称（比如 age, sum, totalvolume）。
1.变量必须以字母开头
2.变量也能以 $ 和 _ 符号开头（不推荐）
原因:可能识别读取问题,待查询
3.变量名称对大小写敏感（y 和 Y 是不同的变量）
(JavaScript 语句和 JavaScript 变量都对大小写敏感)
/
JavaScript 变量还能保存其他数据类型，比如文本值 (name="Bill Gates")。
在 JavaScript 中，类似 "Bill Gates" 这样一条文本被称为字符串。
当向变量分配文本值时，应该用双引号或单引号包围这个值。
当向变量赋的值是数值时，不要使用引号。如果用引号包围数值，该值会被作为文本来处理。
/
声明（创建） JavaScript 变量
在 JavaScript 中创建变量通常称为"声明"变量。
使用 var 关键词来声明变量：
ex: var carname;
变量声明之后，该变量是空的（它没有值）。
如需向变量赋值，使用等号：
ex: carname="Volvo";
也可以在声明变量时对其赋值：
ex: var carname="Volvo";
可以在一条语句中声明很多变量。语句以 var 开头，并使用逗号分隔变量即可:
or:声明也可横跨多行：
ex: var lastname="Doe", age=30, job="carpenter";
or: var lastname="Doe",
age=30,
job="carpenter";
ps:一条语句中声明的多个不可以赋同一个值
ex:
var x,y,z=1
x,y 为 undefined(不明确的,即:无效,or无值)， z 为 1
/
Value = undefined
在计算机程序中，经常会声明无值的变量。未使用值来声明的变量，其值实际上是 undefined。
在执行过以下语句后，变量 carname 的值将是 undefined：
ex: var carname;
/
重新声明 JavaScript 变量
如果重新声明 JavaScript 变量，该变量的值不会丢失：
在以下两条语句执行后，变量 carname 的值依然是 "Volvo"：
ex:
var carname="Volvo";
var carname;
总结:同一变量二次声明无值,变量不会覆盖已经赋予的值
/
JavaScript 数据类型
值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。
引用数据类型：对象(Object)、数组(Array)、函数(Function)。
JavaScript 拥有动态类型,相同的变量可用作不同的类型：
ex:
var x; // x 为 undefined
var x = 5; // 现在 x 为数字
var x = "John"; // 现在 x 为字符串
/
JavaScript 字符串
字符串是存储字符（比如 "Bill Gates"）的变量。
ex:
var answer="It's alright";
var answer="He is called 'Johnny'";
var answer='He is called "Johnny"';
总结:
字符串是存储字符（比如 "Bill Gates"）的变量。
必须用引号包裹
可以是引号内的任意文本
但是注意,单引号里的文本引用引号只能是双引号,反之亦然.
不能匹配包围字符串的引号
/
JavaScript 数字
JavaScript 只有一种数字类型。数字可以带小数点，也可以不带：
ex:
var x1=34.00; //使用小数点来写 (等于)
var x2=34; //不使用小数点来写
极大或极小的数字可以通过科学（指数）计数法来书写
ex:
var y=123e5; // 12300000
var z=123e-5; // 0.00123
总结:
e5:小数点向后移动5位
e-5:小数点向前移动5位
/
JavaScript 对象
JavaScript 对象是拥有属性和方法的数据。
在 JavaScript中，几乎所有的事物都是对象。
为变量 car 设置值为 "Fiat" :
var car = "Fiat";
对象也是一个变量，但对象可以包含多个值（多个变量）。
var car = {type:"Fiat", model:500, color:"white"};
3 个值 ("Fiat", 500, "white") 赋予变量 car。
3 个变量 (type, model, color) 赋予变量 car。
总结:
声明可以一次赋予一个变量多个变量,在为多个变量赋值,中间的这些即使变量也是赋予的值
就类似css设置一个类名,中间包含宽高颜色等,在分别为这些属性(变量)赋予具体的值,这个类(变量,对象)就一次有多个值
"JavaScript 对象是变量的容器"。
对象也是一个变量，但对象可以包含多个值（多个变量）
/
对象属性
"JavaScript 对象是变量的容器"。
or认为 "JavaScript 对象是键值对的容器"。
键值对在 JavaScript 对象通常称为 对象属性
键值对通常写法为 name : value (键与值以冒号分割)。
访问对象属性
两种方式访问对象属性:
ex:
1.person.lastName;
2.person["lastName"];
<p id="demo"></p>
<script>
var person = {
firstName : "John",
lastName : "Doe",
id : 5566
};
document.getElementById("demo").innerHTML =
person.firstName + " " + person.lastName;
(person["firstName"] + " " + person["lastName"];)
</script>
呈现:John Doe
总结:
红字访问的两种方式,person.xx或者person["xx"]
p标签id跟document.getElementById联系起来,
.innerHTM输出文本,
person.firstName访问对象(调用变量),且.firstName不能单独调用
遇到问题:
1.基础知识太多,现在已经有一部分开始连接不起来或者说,意义理解不明确
2.高估自己,才看到这里,本来打算做任务一尝试的
收获:
js的基础知识,和那些会使语句生效或者失效
明日计划:
继续学习基础知识
分解任务一过程,尝试去做任务一
返回列表
评论