初识javaScript(慕课网学习笔记)
js输出
- window.alert() 警告框
- document.write() 写到HTML文档中
- innerHTML 写到HTML元素
- console.log() 写到浏览器的控制台
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js输出</title>
</head>
<body>
<p id="one"></p>
<script type="text/javascript">
/**
1. window.alert() 警告框
2. document.write() 写到HTML文档中
3. innerHTML 写到HTML元素
4. console.log() 写到浏览器的控制台
**/
// 弹出一个警告框 window可以省略
window.alert("helloword");
// 写到网页中
document.write('helloword');
// 写到元素之中,这里例子是写到p中
document.getElementById('one').innerHTML = 'iiiiii';
// 输出到f12->console
console.log('123');
</script>
</body>
</html>
js语句与注释
- 分号
- javaScript 代码
- javaScript 语句标识符
- 代码块
- 单行和多行注释
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js语句与注释</title>
</head>
<body>
<script type="text/javascript">
/**
- 分号
- javaScript 代码
- javaScript 语句标识符 var if for
- 代码块
- 单行和多行注释
**/
var a=1
// 代码块
function b(){
var c=1;
var d=2;
}
//单行注释
/*
多行注释
*/
</script>
</body>
</html>
js数据类型
- 字符串(String)
- 数字(Number)
- 布尔(Boolean)
- 数组(Array)
- 对象(Object)
- 空(Null)
- 未定义(Undefined)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js数据类型</title>
</head>
<body>
<script type="text/javascript">
/**
* 字符串 (String)
* 数字 (Number)
* 布尔 (Boolean)
* 数组 (Array)
* 对象 (Object)
* 空 (Null)
* 未定义 (Undefined)
*/
// var可以声明各种类型
var x; // x 为 undefined
var y = 5; // y 为数字
var z = "John"; // z 为字符串
// 字符串
var carname="Volvo XC60";
var carname='Volvo XC60';
// 数字
var x1=34.00; //使用小数点来写
var x2=34; //不使用小数点来写
// 布尔
var x=true;
var y=false;
// 数组
var cars=new Array();
cars[0]="hello";
cars[1]="word";
var cars=new Array("Saab","Volvo","BMW");
var cars=["Saab","Volvo","BMW"];
// JavaScript 对象 键值对
var person={
firstname:"hello",
lastname:"word",
id:5566
};
// 相应的取值方式
console.log(person.firstname)
console.log(person["firstname"])
// Undefined 和 Null
// Undefined 这个值表示变量不含有值。
// 可以通过将变量的值设置为 null 来清空变量
var persons;
var car="Volvo";
car=null
</script>
</body>
</html>
js变量
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
- 变量名称对大小写敏感(y 和 Y 是不同的变量)
js函数
- 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块
- function a( 参数 ){} 声明会前置
- var a = function( 参数 ){} 匿名函数
- 函数中的 return
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js函数</title>
</head>
<body>
<script type="text/javascript">
/**
* 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块
function a( 参数 ){} 声明会前置
var a = function( 参数 ){} 匿名函数
函数中的 return
*/
function a(){
//输出到控制台
console.log(1111);
console.log(2222);
console.log(3333);
console.log(4444);
console.log(5555);
console.log(6666);
}
//重复使用
a();
a();
a();
a();
b('hello', 'world');
//函数声明会被自动前置,即上面调用b函数是可以的
function b(cs1, cs2){
console.log(cs1, cs2);
}
//匿名函数
var c = function(cs1, cs2, cs3){
console.log(cs1, cs2, cs3);
}
c(1,2,3);
//return 返回相应的值
function d(){
return "this is return function";
}
var d1 = d();
console.log('this is a d1: ', d1);
</script>
</body>
</html>
运算符
- 赋值运算符 = += -= 等
- 算术运算符 + - * / 等
- 字符串的 + 运算符
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js运算符</title>
</head>
<body>
<script type="text/javascript">
/**
* 赋值运算符 = += -= 等
算术运算符 + - * / 等
字符串的 + 运算符
*
*
*
*/
var a = 1; //赋值
a += 3; // a = a + 3;
console.log(a); //4
var b = 2;
b = b * 3;
console.log(b); //6
var c = 'hello';
var d = 'world';
var e = c + d;
console.log(e); //helloword
</script>
</body>
</html>
js比较与逻辑运算符
- < 小于
- > 大于
- **== 等于 1 == ‘1’ **
- === 绝对等于(值和类型均相等)
- != 不等于
- && and
- || or
注意5=='5’返回值为True,5==='5’返回值为false
条件语句及switch语句(和java一样不讲)
if、else、switch、case、break、default
js中for循环与while循环
- for 循环代码块一定的次数
- for/in循环遍历对象
- while指定条件为true时循环指定的代码块
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js中for循环与while循环</title>
</head>
<body>
<script type="text/javascript">
/**
*
* for - 循环代码块一定的次数
for/in - 循环遍历对象
while - 当指定的条件为 true 时循环指定的代码块
*/
for( var i = 0; i < 10 ; i++ ){
console.log('i:'+ i);
}
var person = {
name : 'json',
age : 25,
sg: 170
}
for( key in person ){
console.log(person[key])
}
var count = 1;
while( count < 10 ){
count++ ;
console.log('执行while循环');
}
</script>
</body>
</html>
js中break和continue语句
- break语句可以跳出循环
- continue语句跳出本次循环,继续执行
初识javaScript(慕课网学习笔记)的更多相关文章
- JavaScript入门--慕课网学习笔记
JAVASCRIPT—(慕课网)入门篇 我们来看看如何写入JS代码?你只需一步操作,使用<script>标签在HTML网页中插入JavaScript代码.注意, <script&g ...
- JavaScript进阶--慕课网学习笔记
JAVASCRIPT—进阶篇 给变量取个名字(变量命名) 变量名字可以任意取,只不过取名字要遵循一些规则: 1.必须以字母.下划线或美元符号开头,后面可以跟字 ...
- HTML基本语法(慕课网学习笔记)
标题 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8& ...
- js之window对象(慕课网学习笔记)
javaScript定义了一个变量一个函数都会变成window中的一个成员 var a=1; alert(window.a) //会输出a的值 window基础 创建窗口.调整窗口.移动窗口.关闭窗口 ...
- js之DOM入门(慕课网学习笔记)
DOM简介 获得元素 document.getElementById('') 1.通过id获得元素内容 document.getElementsByTagName('') 2.通过标签获得元素内容 d ...
- Float浮动(慕课网学习笔记)
float浮动 属性:值 意义 float:left 左浮动 float:right 右浮动 float:none 不浮动 float:inherit 继承父元素浮动属性,若父元素没有浮动属性则失效 ...
- CSS基本语法(慕课网学习笔记)
CSS的声明,内外联样式以及CSS的优先级 css学习.html <!DOCTYPE html> <html lang="en"> <head> ...
- 【慕课网学习笔记】Java共享变量的可见性和原子性
1. Java内存模型(Java Memory Model, JMM) Java的内存模型如下,所有变量都存储在主内存中,每个线程都有自己的工作内存. 共享变量:如果一个变量在多个线程中都使用到了,那 ...
- CSS定位(慕课网学习笔记)
定位模型 static自然模型 relative相对定位模型 absolute绝对定位模型 fixed固定定位模型 sticky磁铁定位模型 possition之static(默认的设置)(静态定位. ...
随机推荐
- 单细胞分析实录(17): 非负矩阵分解(NMF)代码演示
本次演示使用的数据来自2017年发表于Cell的头颈鳞癌单细胞文章:Single-Cell Transcriptomic Analysis of Primary and Metastatic Tumo ...
- 【LeetCode】217.存在重复元素
217. 存在重复元素 知识点:数组:Set: 题目描述 给定一个整数数组,判断是否存在重复元素. 如果存在一值在数组中出现至少两次,函数返回 true .如果数组中每个元素都不相同,则返回 fals ...
- 一:Vue项目构建
第一步:需要安装nodeJS的环境,直接去官网下载https://nodejs.org/en/,下载下来按照提示一步步的安装.(vue.js是一个Js 框架.在node里面通过Npm 安装,是为了方便 ...
- springboot-4-CRUD开发实战
流程: 创建项目,勾选基本的几个开发工具还有webstarter 再创建包(service,control,config,dao,pojo) 再前往https://www.webjars.org/,选 ...
- .Net Core微服务——自动收缩、健康检查:Consul(三)
继续上一篇的话题,顺便放上一篇的传送门:点这里. 健康检查 经过之前的操作,我的consul已经支持自动扩展,并且调用也很靠谱.但是这里有个问题,一旦服务列表里的某个服务挂了,consul并不知道,还 ...
- swagger是什么(十六)
前言: swagger:神气十足,大摇大摆 在用Springboot进行开发时,有的实体类上用到了注解@ApiModelProperty("接受人代码"),特此整理此注解的出处及作 ...
- [HNOI]2011卡农
这是一道很好的组合数学题. 对于和我一样五音里面有六音不全的人来说,我们就应该转换一下题目的意思: 一句话题意: 题目的意思就是说要从一个有 n 个元素的集合当中选出一个长度为m的集合,然后满足: 1 ...
- Java 中 this 和 super 的用法详解
前言 这次我们来回顾一下this和super这两个关键字的用法,作为一名Java程序员,我觉得基础是最重要的,因为它决定了我们的上限,所以我的文章大部分还是以分享Java基础知识为主,学好基础,后面的 ...
- Spring in Action学习笔记(1)
Spring基础 IoC 控制反转, 也称为DI-依赖注入 一.装配bean 推荐顺序:自动装配 -> JavaConfig装配 -> XML装配 1. 自动装配 @Component 注 ...
- JAVAWEB的基本入门(JSP、Tomcat)>从零开始学JAVA系列
目录 JAVAWEB的基本入门(JSP.Tomcat) 使用idea创建web项目的两种方式 1.直接创建一个web项目(这样创建好的项目可以直接运行) 2.创建一个普通的java项目并配置web模块 ...