2019-11-01 从零开始的JS学习 一

编程语言

编程:就是让计算机为了解决某个问题而使用某种程序设计语言编写程序代码,并最终得到结果的过程

通用编程语言的两种形式: 汇编语言和高级语言(swift oc js html java C语言 php等)

简介

渲染引擎: 用来解释html和css 也称为内核,比如chrome的blink,老版本的webkit
js引擎: 也称为js解释器,用来读取网页中的js代码.对其处理后运行,比如chrome的v8

流浪器本并不会执行js代码,而是通过内置js引擎来执行js代码.js引擎执行代码时逐行解释每一句源码(转换成机器语言),然后由计算机去执行,所以js语言归为脚本语言,会逐行解释执行.

JS

DOM :文档对象模型

BOM :浏览器对象模型

js有三种书写方式
行内 内嵌 和外部

行内js:

可以将单行或少量的js代码写在html标签事件属性中(以on开头的属性)
注意单双引号的使用,在html中我们推荐使用双引号,js中我们推荐使用单引号
可读性差,在html中编写大量代码时,不方便阅读;
引号易错,引号多层嵌套匹配时,非常容易弄混;
特殊情况下使用

内嵌式js:

可以将多行js代码写到script标签中
内嵌js是学习时常用的方式

外部js:

利用html页面代码结构化,把大段js代码独立到html页面之外,既美观,也方便文件级别的复用
引用外部js文件的script标签中间不可以写代码
适用于js代码量比较大的情况

JS输入输出语句

alert(msg) 浏览器弹出警告框
console.log(msg) 浏览器控制台打印输出框
prompt(info) 浏览器弹出输入框,用户可以输入

变量

变量是程序在内存中申请的一块用来存放数据的空间.
使用步骤: 声明->赋值

//声明变量
var age;

//声明多个变量
var age = 18,
    name = '张',
    sex = '男';

//声明变量的特殊情况

//声明不赋值 结果是?
var sex; //undefind 未定义

//不声明不赋值 直接使用 ->报错

//不声明 直接赋值 是可以使用的(JS中可以  变成全局变量)

命名规范

由字母 数字 下划线 美元符号
严格区分大小写
不能以数字开头
不能是关键字,保留字
变量名必须有意义
遵循驼峰命名法 首字母小写后面单词首字母大写

数据类型

js是一种弱类型或是动态语言
js的变量数据类型只有程序在运行的过程中,才会根据右面的值来确定

//js是动态语言 变量的数据类型是可以变化的
var x = 10;//数字型
x = 'zhang';//字符串型

基本的数据类型
Number 数字型包含了整型和浮点型
Boolean 布尔值型 true false
String 字符串型
Undefined 未定义型
Null var a = null 声明了变量a为空值

八进制 逢八进1 0-7 我们程序里面数字前面加0 表示八进制
var num = 010 (8)

十六进制 逢十六进一 0-9 a-f 数字前面加0x表示十六进制

数字型最大值和最小值:
Number.MAX_VALUE
Number.MIN_VALUE

无穷大和无穷小:
Number.MAX_VALUE * 2 Infinity -Number.MAX_VALUE * 2 -Infinity
NaN not a number 代表非数值

isNaN()这个方法用来判断非数字 并且返回一个值 ,如果是数字返回false 不是返回true

字符串嵌套
外双内单或外单内双

字符串类型

字符串是若干字符组成的,这些字符的数量就是字符串的长度,通过字符串的 属性可以获取整个字符串的长度

//检测字符串的长度
var str = 'zhang';
console.log(str.length);

//字符串的拼接 用+号 (和swift类似)
var str1 = 'zhang';
var str2 = 'jian';
var str3 = str1 + str2;
console.log(str3);

//数值带入
var age = 18;
console.log('我今年' + age + '岁');//我今年18岁

获取变量数据类型 typeof

var num = 10;
typeof num //number类型

数据类型的转换

//转字符串
var num = 10;

num.toString();//第一种方法
String(num)//第二种方法
num + ' '  //第三种 常利用 + 拼接字符串的方法(隐式转换)

//转数字型
var age = '18';

parseInt(age);//第一种方法 得到的是整数 字符串带单位会去掉 是重点
parseFloat(age)//第二种方法 得到的是浮点数 是重点
Number(age)//第三种 了解
age - 0//利用运算 隐式转换 了解