前端--阶段笔记(三) JS编程基础 01 + 02

第一章JS

Day01 变量

标记语言被动,由计算机读取并执行。

编程语言,主动执行。

布兰登·艾奇

JS 注释 JS语句

运行在客户端的脚本语言 ,不编译 ,由js解释器解释运行

现在可以用node.js进行服务器端编程.

诞生目的:表单验证,网页验证,服务器开发

桌面程序,APP控制硬件 物联网rufs

浏览器分两部分:渲染引擎和JS引擎

渲染负责解析HTML和CSS,俗称内核.

js引擎也成为js解释器用来读取js代码并处理运行,如chrome版本的V8.

JS的组成

1.ECMAScript JS基础语法

2.DOM 页面文档对象模型 API用 对文档各种元素进行操作

3.BOM 浏览器对象模型 浏览器控制.弹出对话框,浏览器跳转,获取分辨率等.

javascript 网景,Jscript 微软microsoft ,js语法工业化标准

三种写法
  1. 行内式
<input type="button" value="点我试试" onclick="alert('Hello World')" />
  1. 内嵌式

  2. 独立引入式

注释

1.// 表示注释 单行

2.多行 /* */

输入输出

alert(msg) 浏览器弹出警示框(顶部)

console.log(msg) 浏览器控制台打印输出信息

prompt(info) 浏览器弹出输入框用户可以输入

​ Tip: prompt取过来的数据是字符串型的,需要转换为数字型才能正常使用。

<script>
       prompt('input age');
       //alert
       alert('result');
       //控制台输出
       console.log('for programmer');
</script>
<script type="text/javascript">
function disp_prompt()
  {
    
    
  var name=prompt("请输入您的名字","Bill Gates")
  if (name!=null && name!="")
    {
    
    
    document.write("你好," + name + "!今天过得好吗?")
    }
  }
</script>

对应HTML:

<input type="button" onclick="disp_prompt()" value="显示一个提示框" />
变量

​ 本质是在内存申请一块空间。

​ 包括两部分,名字和空间。

​ 1.声明

​ var :variable 指变量
​ var age; 声明了一个名字为age的变量。

​ 2.赋值

​ age = 18;

​ 3.输出

​ console.log(‘age’);

​ 声明变量同时给予赋值,叫做变量初始化。

​ var myname=‘kafuka老师’;

变量获取与传递
   var myname = prompt('input your name:');

   alert('your name is' + myname);

声明多个变量 :写一次var 不同变量之间用, 隔开。

声明变量的特殊情况

声明但是不赋值,输出 undefined

不声明直接输出,报错 not defined

不声明,直接赋值,age = 14 ,可以使用,js允许,变为全局变量。不提倡。

JS解释一句执行依据,一句错误后面不再执行。

变量命名规范

1.字母数字下划线和美元符号$组成

2.严格区分大小写

3.数字不能开头

4.关键字、保留字不可占用

5.变量名字需要有意义,尽量不用拼音

6.驼峰命名法

数据类型

不同数据类型占用空间不同,为了有效率使用空间,分成不同类型
JS弱类型或者说动态语言,这意味着不用提前声明变量的类型,在程序运行中自动确定。
不用提前声明变量类型。(js牛X)

动态语言,变量数据类型可以变化

var x = 10;

var x = ‘kafuka老师’;

数据类型分两类

1 .简单类 number boolean string undefined null

2 .复杂类 object

不同进制

1 .八进制 数字前面加0
var num = 010;

2 .十六进制 前缀0x

JavaScript Number 对象

Number 对象属性

属性 描述
constructor 返回对创建此对象的 Number 函数的引用。
MAX_VALUE 可表示的最大的数。
MIN_VALUE 可表示的最小的数。
NaN 非数字值。
NEGATIVE_INFINITY 负无穷大,溢出时返回该值。
POSITIVE_INFINITY 正无穷大,溢出时返回该值。
prototype 使您有能力向对象添加属性和方法。

得到指定数据类型最大值 : Number.MAX_VALUE

函数isNaN()用于判断是不是非数字 输出结果如果不是数字 则输出 true 如果是数字则输出 false

加了’'的都是字符串。

<script>

        document.write(isNaN(123) + '<br/>');
        document.write(isNaN(-1.23) + '<br/>');
        document.write(isNaN(5 - 2) + '<br/>');
        document.write(isNaN(0) + '<br/>');
        document.write(isNaN("Hello") + '<br/>');
        document.write(isNaN("2005/12/12") + '<br/>');

</script>

js转义符

\反斜杠 开头

\\要有两个才能出来一个\

判断字符串长度.length;

var aa1= '我爱你';
console.log(aa1.length);

字符串拼接 +

字符串+任何类型 = 拼接后的新字符.

布尔型参与数字运算

true 当1

false 当0

typeof 获取数据类型

 var obj = new String();
 console.log(typeof(obj));    //'object'

数字型 蓝色

黑色 字符串

浅灰色 undefine object

类型转换

转换为字符串

1.toString();

​ var num = 10;

​ var str = num.toString();

​ 检测:

var num = 10;

var str = num.toString();

console.log(typeof (str));

2.String();

​ var num = 10;

​ String(num);

3.利用拼接字符串方式实现 隐式转换

​ var num = 10;

​ console(num =10+ ’ ');

转为数字型

1.parseInt(); parseInt() 函数可解析一个字符串,并返回一个整数。

2.parseFloat();

3.number()

4.利用算术运算 ±*/ 进行隐式转换

运算符

也叫操作符

取余也叫取模

小数参与四则运算要出错。原因是小数转换成二进制会有误差。

其他语言也是这样?后面有办法应对。

不要直接判断两个浮点数是否相等。

余数是零则这个数字可以被整除。

遵循四则运算优先级规则。

数字运算符变量组成的叫做表达式。任何表达式都会有返回值。

递增递减++ - -

放前面前置,放后面后置

案例:

​ var e = 10;

​ var f = e++ + ++e;

​ alert(f);

这里的f = 22; 运行时,e++ 在运行后 改变了e的值,在运算++e的时候,e = 11;

隐式类型转换

== 会默认转换数字类型,然后再进行比较。

e.g. console.log(18 == ‘18’); 结果为true

=== 全等号 要求完全一致

包括数据类型

能用全等的不用等于

&& 逻辑与 写两个

|| 逻辑或 写两个

! 逻辑非

优先级

1级 小括号

2级 一元运算符 ++ – !

3级 算术运算符 先*/% 后 + -

4级 关系运算符 > , >= , < ,<=

5级 相等运算符 == , != , === , !==

6级 逻辑运算符 先&& 后 ||

7级 赋值 =

8级 逗号 ,

技巧:长串表达式中,先找优先级最低的符号,把表达式划分为不同的段,分段继续计算。

Boolean 对象

new Boolean(value); 

如果省略 value 参数,或者设置为 0、-0、null、""、false、undefined 或 NaN,则该对象设置为 false。否则设置为 true(即使 value 参数是字符串 “false”)。

if else 略

选择表达式 ? : 略

switch(表达式)) {
    
    case value1:
​		执行语句1;break;case value2 :
		执行语句2;break;default:
		执行语句n;break;
}

break不写,则会导致case穿透。

猜你喜欢

转载自blog.csdn.net/codemokey/article/details/114196583
今日推荐