重温Javascript(一)
工作中要用到JavaScript,一组复习笔记。
一些看法
1. 想想JavaScript目前最常用的宿主环境,浏览器或者服务端V8,都是单线程,所以不用过多的考虑并发的问题,如果是协程来实现异步的方法,反正就是不用考虑竟态条件了。
2. 开发方式。又是OOP,又是OOF,对独立开发来说就是尽情发挥了。对协作开发来说,有时规范不是很好统一,可以实现的方式太过灵活,晕头转向是常有的事,要想通俗易懂,命名比写C# JAVA这类语言有更高的要求。反正经常看不明白this,鬼知道是被丢到哪个环境中被调用了。我想TypeScript也是无奈之下出来的解决方案了。
3. 性能,每个终端有每个终端的环境也罗列不全,套的越深,越是坑。
简单想想,最需要关注的还是JavaScript的OOP语法模型,毕竟不管是在浏览器或是服务器,其他的对象都封装好了,更多的考虑是实现功能的信息模型。
Object类型
Object类型是所有对象实例的基类。
hasOwnProperty(propertyName):用于检查给定的属性在当前对象实例中(不是原型)是否存在。参数propertyName必须是字符串。
isPrototypeOf(object):object的原型链具有当前实例的原型链,则返回true。
全等操作符
除了在比较值钱不转换操作数之外,全等和不全等操作符没什么区别。全等操作符由3个等号表示,只在两个操作数未经转换就相等的情况下返回。
函数arguments
函数的agruments对象类似数组,可是使用索引来访问,arguments[0],也有length属性
值传递和引用传递
其实这点有点像C#。
1.基本类型值的复制
var num1=5;
var num2=num1;

2.引用复制
var obj1=new Object();
var obj2=obj1;
obj1.name="peter";
alert(obj2.name); //peter

3.传递参数
基本类型值的传递如同基本类型变量的复制,引用类型值得传递,如同引用类型变量的复制。
function addTem(num){
num+=10;
return num;
}
var count=20;
var result=addTen(count);
alert(count); //20 没有变化
alert(result); //30
function setName(obj){
obj.name=“peter”;
}
var person=new Object();
setName(person);
alert(person.name); //peter
坑一 变量喜欢乱跳域
for(var i=0;i<10;i++){
doSomething(i);
}
alert(i); //10
Function类型
每个函数都是Function类型的实例,都与其他引用类型一样具有属性和方法。由于函数是对象,函数名实际上是一个指向函数对象的指针,不会与某个函数绑定。
function sum(num1,num2){
}
var sum=function(num1,num2){};
坑二 函数指针变化
function factorial(num){
if (num <=1) {
return 1;
} else {
return num * factorial(num-1)
}
}
根据上面函数指针的说法,factorial这个名字是可以指向另外的函数的,所以这个函数有可能在运行时被动态改变。
出坑的方法
function factorial(num){
if (num <=1) {
return 1;
} else {
return num * arguments.callee(num-1)
}
}
arguments.callee是一个指针,指向拥有这个arguments对象的函数
var trueFactorial = factorial;
factorial = function(){
return 0;
};
alert(trueFactorial(5)); //120
alert(factorial(5)); //0
this
如果层级很绕,很难看清楚。
总结就是,谁调用该函数,this就指向谁
window.color = "red";
var o = { color: "blue" };
function sayColor(){
alert(this.color);
}
sayColor(); //"red"
o.sayColor = sayColor;
o.sayColor(); //"blue"
apply和call方法
在特定的作用域中调用函数,设置函数体内this对象的值
call与apply第一个参数都是作用域,后面的参数call必须一一列举,apply可以使用数组
function sum(num1, num2){
return num1 + num2;
}
function callSum(num1, num2){
return sum.call(this, num1, num2);
}
alert(callSum(10,10)); //20
bind方法
会创建一个函数的实例,this值会被绑定到传给bind函数的值
window.color = "red";
var o = { color: "blue" };
function sayColor(){
alert(this.color);
}
var objectSayColor = sayColor.bind(o);
objectSayColor(); //blue
encodeURI和encodeURIComponent的区别
encodeURI不会对本身属于URI的特殊字符进行编码,例如冒号、正斜杠、问号和#;encodeURIComponent会对它发现的任何非标准字符进行编码
var uri = "http://www.wrox.com/illegal value.htm#start"; //"http://www.wrox.com/illegal%20value.htm#start"
alert(encodeURI(uri)); //"http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start"
alert(encodeURIComponent(uri));
eval方法
当解析器发现代码中调用eval()方法时,会将传入的参数当做实际的ECMAScript语句来解析,把执行结果插入原位置。通过eval执行的代码被认为是包含该次调用的执行环境的一部分,因此被执行的代码具有与该执行环境相同的作用域链。通过eval执行的代码可以引用在包含环境中定义的变量
var msg = "hello world";
eval("alert(msg)"); //"hello world"
eval("function sayHi() { alert('hi'); }");
sayHi();
eval("var msg = 'hello world'; ");
alert(msg); //"hello world"
重温Javascript(一)的更多相关文章
- 【JavaScript】重温Javascript继承机制
上段时间,团队内部有过好几次给力的分享,这里对西风师傅分享的继承机制稍作整理一下,适当加了些口语化的描述,留作备案. 一.讲个故事吧 澄清在先,Java和Javascript是雷锋和雷峰塔的关系.Ja ...
- 基本类型和引用类型的值 [重温JavaScript基础(一)]
前言: JavaScript 的变量与其他语言的变量有很大区别.JavaScript 变量松散类型的本质,决定了它只是在特定时间用于保存特定值的一个名字而已.由于不存在定义某个变量必须要保存何种数据类 ...
- 深夜重温JavaScript中的对象和数组
这一块实际上已经学过了,因为没有学好,在工作过程中遇到一些对象或者数组的操作,会去百度查找,浪费了许多宝贵的时间,所以特地再拐过头来重新学习. 对象 基本概念: 对象这种基本的数据结构还有其他很多种叫 ...
- 重温Javascript第一章
一.script标签 script标签有6个属性,其中一个废弃,五个可选. 按照传统的写法,<script>的标签都是放在<head>元素中,但是在<head>中包 ...
- 重温javascript事件机制
以前用过一段时间的jquery感觉太方便,太强大了,各种动画效果,dom事件.创建节点.遍历.控件及UI库,应有尽有:开发文档也很多,网上讨论的问题更是甚多,种种迹象表明jquery是一个出色的jav ...
- 重温Javascript(二)
对象 可以想象成散列表,键值对,值可以是数据或函数 创建对象的方式 1.工厂模式 function createPerson(name, age, job){ var o = new Object() ...
- 重温Javascript(四)-函数
函数 函数声明提升,在执行代码之前会先读取函数声明 sayHi(); function sayHi(){ alert("Hi!"); } 递归 arguments.callee是指 ...
- 重温javascript数据类型
在javaScript中,有五种简单的数据类型,分别是 Undefined Null Boolean Number String 还有一种复杂的数据类型object,object本质是有一组无序的名值 ...
- 重温JavaScript获取CSS样式的方法(兼容各浏览器)
众所周知,CSS样式有三种类型:行内样式.内部样式和外部样式,JavaScript获取CSS样式时分为两种情况:行内样式获取法 和 非行内样式获取法 . 一.行内样式获取相对简单,通过element. ...
随机推荐
- tomcat基础应用
1. Tomcat版本和支持的API和JDK版本 Apache Tomcat Servlet API JSP API JDK 7.0 3.0 2.2 1.6 6.0 2.5 2.1 1.5 5.5 2 ...
- 如何居中div?如何居中一个浮动元素?
如何居中div? 给div设置一个宽度,然后添加margin:0 auto属性 div{ width:200px; margin:0 auto; } 如何居中一个浮动元素? <!DOCTYPE ...
- wordPress查看站点时,显示文件目录
1.在wordpress的代码目录中增加.htaccess文件. 2.在.htaccess文件中加入如下内容: DirectoryIndex index.php index.html# BEGIN W ...
- ARM处理器:开放者的逆袭
作者:Vamei 出处:http://www.cnblogs.com/vamei 严禁转载. 1981年,英国BBC电视台策划了一系列关于计算机的电视节目.但导演发现一个问题:怎么给没见过电脑的观众画 ...
- <input/>标签在 苹果浏览器中 默认的有圆角
解决方法: input{ border-radius:0; -webkit-border-radius:0; }
- Gulp实现css、js、图片的压缩以及css、js文件的MD5命名
目前做代码压缩合并的工具有很多,诸如gulp,webpack,grunt等等,可以说这些项目构建工具的功能非常之强大:图片压缩.图片转base64.css和js的压缩以及合并,文件的md5重命名 -- ...
- MVC和三层架构
从最开始写程序到现在,一路上听到架构这个词已经无数次了,在工作和圈子里也不停听到大家在讨论它,但是很多时候发现不少人对这个概念的理解都是很模糊的,无意间在知道上看到一个朋友的回答,感觉很不错,特转帖到 ...
- 【转】Netty系列之Netty并发编程分析
http://www.infoq.com/cn/articles/netty-concurrent-programming-analysis
- Material Design学习-----CollapsingToolbarLayout
博客引用(http://www.open-open.com/lib/view/open1438265746378.html) CollapsingToolbarLayout为我们提供了一个很方便的顶部 ...
- Cloud9vue&vux上传github小步骤
成功后创建出以下文件,再输入: git init 再输入:$ git remote add origin https://github.com/github用户名/vux1 然后:git add. 按 ...