饮水思源 - 主题文章阅读  [讨论区: WebDevelop]
本主题共有 14 篇文章,分 1 页, 当前显示第 1 页 [返回讨论区]
[回复本文][原帖] 发信人: MiaoMiao(毛毛|学生信息员9527), 信区: WebDevelop
标  题: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件

不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
运行失败, 请指出.

注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!

语言基础篇:

1.
var str = '\u104A0';
console.log(str.length);
console.log(String(str) === String(str))
console.log(RegExp(str) === RegExp(str))

2.
console.log(typeof null);
console.log(typeof undefined);
var a;
console.log(a === undefined);
var undefined;
undefined = 1;
console.log(a === undefined);

var b = null;
var null;
null = 1;
console.log(b === null);

3.
我们有一个 ES5 兼容的 JS 环境, 请你完成这段代码, 使变量 a 的值为 global 
object (即浏览器里的 window), 并判断 console.log 会在控制台输出啥结果
var a;
(function(){
    'strict mode';
    /*
     * write your code here
     */
    console.log(a.a === a);
})()

4.
(function(){
    eval('a=1;');
})();
console.log(a);

(function(){
    'use strict';
    eval('b=2;');
})();
console.log(b);

5.
(function(){
    function testA(){
        return function(){
            var a = 1;
            ++a;
            return a;
        }
    }
    function testB(){
        'use strict';
        return function(){
            var a = 1;
            ++a;
            return a;
        }
    }
    console.log(testA() === testA());
    console.log(testB() === testB());
})();

6.
(function(){
    console.log(typeof this)
})();

(function(){
    'use strict';
    console.log(typeof this)
})();

DOM/BOM 篇:

7.
一个容器下有很多子元素, 需要对这些子元素上的事件进行响应. 如果对每一个子元素
进行事件绑定, 代价比较高昂, 故可以将事件绑定到父容器上, 此称为事件代理.

请你分别用 jQuery 和 native dom api 完成一个事件代理的 demo: 当鼠标移到任意 
<li> 上时, console.log 它的 .textContent

jQuery: http://jsfiddle.net/PJ6JV/
Native Dom Api: http://jsfiddle.net/GrVVf/

8.
列举你所知道的一切 js 跨域方法, 并稍加解释.

9.
有一个音乐列表页面和一个播放器页面, 要求:
    a. 播放器页面正在播放的歌曲名字显示在标题栏, 播放历史显示在页面上.
    b. 用户点击播放列表页上的任意项, 如果浏览器已经打开了播放器页面, 则播放器
页面开始播放该项, 否则弹出播放器页面并开始播放.
    c. js代码要控制好浏览器, 不能有两个或以上播放器页面.
    d. 刷新或关掉重开音乐列表页面, 看功能是否还正常.
    d. 刷新或关掉重开播放器页面, 看功能是否还正常.
注: 只要实现窗口控制, 跟 百度音乐 差不多, 不需要真的播放音乐 :)

playlist.html:
<!doctype html>
<html>
    <head>
        <title>PlayList</title>
    </head>
    <body>
        I'm PlayList;
        <ol id="list">
            <li>Song #1</li>
            <li>Song #2</li>
            <li>Song #3</li>
        </ol>
        <script>
            //Write your code here
        </script>
    </body>
</html>

player.html:
<!doctype html>
<html>
    <head>
        <title>Now playing: </title>
    </head>
    <body>
        Play history
        <ol id="history">
        </ol>
        <script>
            //Write your code here
        </script>
    </body>
</html>


蛋疼篇:
10. 猜测结果并解释原因.
console.log(++[[[[]]+[[]-[]]]][[[]-[]]]); 
--

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]

※ 修改:·MiaoMiao 于 2013年04月22日18:02:50 修改内容·[FROM: 211.68.71.66]

※ 修改:·MiaoMiao 于 2013年04月22日18:29:25 修改内容·[FROM: 211.68.71.66]

※ 修改:·MiaoMiao 于 2013年05月03日15:39:11 修改内容·[FROM: 211.68.71.66]

[回复本文][原帖] 发信人: scaret(方糖|似水流年|我是天蝎大使), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月22日18:10:26 星期一), 站内信件

耶!
【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: 运行失败, 请指出.
: 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: 语言基础篇:
: 1.
: var str = '\u104A0';
: console.log(str.length);
: console.log(String(str) === String(str))
: console.log(RegExp(str) === RegExp(str))
: 2.
: .................(以下省略)

--
    .           ╭
   +¨+         ╰╯ .+¨+。                   + `˙
  不是习惯冷漠﹒ˇ    ˇ而是不想让狂热的深情
  +          一一被窥透      +    ╭未了的是一愁      
  ¨+   .+·。+难改的痴情ˇ╰╯ .+¨ 所以最终    ╰╯
  Scorpius 天蝎座              ゜˙ `选择了隐逸

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]

[回复本文][原帖] 发信人: scaret(方糖|似水流年|我是天蝎大使), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月22日18:23:16 星期一), 站内信件

快下班了,我试试奇数题。。。
【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: 标  题: JavaScript 十问 (外)
: 发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件
: 
: 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: 运行失败, 请指出.
: 
: 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: 
: 语言基础篇:
: 
: 1.
: var str = '\u104A0';
: console.log(str.length);
: console.log(String(str) === String(str))
: console.log(RegExp(str) === RegExp(str))
2
true
false
: 
: 2.
: console.log(typeof null);
: console.log(typeof undefined);
: var a;
: console.log(a === undefined);
: var undefined;
: undefined = 1;
: console.log(a === undefined);
: 
: var b = null;
: var null;
: null = 1;
: console.log(b === null);
: 
: 3.
: 我们有一个 ES5 兼容的 JS 环境, 请你完成这段代码, 使变量 a 的值为 global 
: object (即浏览器里的 window), 并判断 console.log 会在控制台输出啥结果
: (function{
:     'strict mode';
:     /*
:      * write your code here
:      */
:     console.log(a.a === a);
: })()
: 
╮(╯_╰)╭好高端

不过目测第一行error真的没办法。。。


: 4.
: (function(){
:     eval('a=1;');
: })();
: console.log(a);
: 
: (function(){
:     'use strict';
:     eval('b=2;');
: })();
: console.log(b);
: 
: 5.
: (function(){
:     function testA(){
:         return function(){
:             var a = 1;
:             ++a;
:             return a;
:         }
:     }
:     function testB(){
:         'use strict';
:         return function(){
:             var a = 1;
:             ++a;
:             return a;
:         }
:     }
:     console.log(testA() === testA());
:     console.log(testB() === testB());
: })();
虽然我知道我会错但是勇敢地。。。
true
true
: 
: 6.
: (function(){
:     console.log(typeof this)
: })();
: 
: (function(){
:     'use strict';
:     console.log(typeof this)
: })();
: 
: DOM/BOM 篇:
: 
: 7.
: 一个容器下有很多子元素, 需要对这些子元素上的事件进行响应. 如果对每一个子元素
: 进行事件绑定, 代价比较高昂, 故可以将事件绑定到父容器上, 此称为事件代理.
: 
: 请你分别用 jQuery 和 native dom api 完成一个事件代理的 demo: 当鼠标移到任意 
: <li> 上时, console.log 它的 .textContent
: 
: jQuery: http://jsfiddle.net/PJ6JV/
: Native Dom Api: http://jsfiddle.net/GrVVf/
: 
感谢你提醒我hover被remove了。。。。我还真不知道。。。
$("ul").on("mouseenter ","li",function(){
console.log($(this).text());
})

: 8.
: 列举你所知道的一切 js 跨域方法, 并稍加解释.
: 
: 9.
: 有一个音乐列表页面和一个播放器页面, 要求:
:     a. 播放器页面正在播放的歌曲名字显示在标题栏, 播放历史显示在页面上.
:     b. 用户点击播放列表页上的任意项, 如果浏览器已经打开了播放器页面, 则播放器
: 页面开始播放该项, 否则弹出播放器页面并开始播放.
:     c. js代码要控制好浏览器, 不能有两个或以上播放器页面.
:     d. 刷新或关掉重开音乐列表页面, 看功能是否还正常.
:     d. 刷新或关掉重开播放器页面, 看功能是否还正常.
: 注: 只要实现窗口控制, 跟 百度音乐 差不多, 不需要真的播放音乐 :)
: 
: playlist.html:
: <!doctype html>
: <html>
:     <head>
:         <title>PlayList</title>
:     </head>
:     <body>
:         I'm PlayList;
:         <ol id="list">
:             <li>Song #1</li>
:             <li>Song #2</li>
:             <li>Song #3</li>
:         </ol>
:         <script>
:             //Write your code here
:         </script>
:     </body>
: </html>
: 
: player.html:
: <!doctype html>
: <html>
:     <head>
:         <title>Now playing: </title>
:     </head>
:     <body>
:         Play history
:         <ol id="history">
:         </ol>
:         <script>
:             //Write your code here
:         </script>
:     </body>
: </html>
啊快下班了。。。
: 
: 
: 蛋疼篇:
: 10. 猜测结果并解释原因.
: console.log(++[[[[]]+[[]-[]]]][[[]-[]]]); 
: --
: 
: ※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]
: 
: ※ 修改:·MiaoMiao 于 2013年04月22日18:02:50 修改内容·[FROM: 211.68.71.66]


--
    .           ╭
   +¨+         ╰╯ .+¨+。                   + `˙
  不是习惯冷漠﹒ˇ    ˇ而是不想让狂热的深情
  +          一一被窥透      +    ╭未了的是一愁      
  ¨+   .+·。+难改的痴情ˇ╰╯ .+¨ 所以最终    ╰╯
  Scorpius 天蝎座              ゜˙ `选择了隐逸

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]

[回复本文][原帖] 发信人: MiaoMiao(毛毛|学生信息员9527), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月22日18:29:29 星期一), 站内信件

哼
【 在 scaret (方糖|似水流年|我是天蝎大使) 的大作中提到: 】
: 快下班了,我试试奇数题。。。
: 【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: : 标  题: JavaScript 十问 (外)
: : 发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件
: : 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: : 运行失败, 请指出.
: : 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: : 语言基础篇:
: : 1.
: : var str = '\u104A0';
: .................(以下省略)

--

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]

[回复本文][原帖] 发信人: scaret(方糖|似水流年|我是天蝎大使), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月23日13:38:52 星期二), 站内信件


【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: 标  题: JavaScript 十问 (外)
: 发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件
: 
: 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: 运行失败, 请指出.
: 
: 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: 
: 语言基础篇:
: 
: 1.
: var str = '\u104A0';
: console.log(str.length);
: console.log(String(str) === String(str))
: console.log(RegExp(str) === RegExp(str))

\u跟16进制4位,所以两个字符是\u104A 0
2
String()将输入转为字符串,字符串不是Object, ===是直接比较值
true
RegExp等号比较是否是同一个Object
false
: 
: 2.
: console.log(typeof null);
"Object"
: console.log(typeof undefined);
"undefined"
: var a;
: console.log(a === undefined);
: var undefined;
: undefined = 1;
: console.log(a === undefined);
我还真不敢确定,用chrome验证了一下,果然是赋值不报错但是不改变赋值,跟Math.PI
一样
false
: 
: var b = null;
: var null;
: null = 1;
: console.log(b === null);
根据上一题的尿性猜是
false
: 
: 3.
: 我们有一个 ES5 兼容的 JS 环境, 请你完成这段代码, 使变量 a 的值为 global 
: object (即浏览器里的 window), 并判断 console.log 会在控制台输出啥结果
: (function(){
:     'strict mode';
:     /*
:      * write your code here
:      */
:     console.log(a.a === a);
: })()
: 
var a = (function(){return this})()
false
加不加var都一样

: 4.
: (function(){
:     eval('a=1;');
: })();
: console.log(a);
1
: 
: (function(){
:     'use strict';
:     eval('b=2;');
: })();
: console.log(b);
undefined

: 
: 5.
: (function(){
:     function testA(){
:         return function(){
:             var a = 1;
:             ++a;
:             return a;
:         }
:     }
:     function testB(){
:         'use strict';
:         return function(){
:             var a = 1;
:             ++a;
:             return a;
:         }
:     }
:     console.log(testA() === testA());
:     console.log(testB() === testB());
: })();
既然return的是function而且是每次重新生成的function应该两个都是false
: 
: 6.
: (function(){
:     console.log(typeof this)
: })();
window是Object的吧。。。还是会BomXXXXX应该不会吧
: 
: (function(){
:     'use strict';
:     console.log(typeof this)
: })();
: 
同上我不知道有什么区别。。。

: DOM/BOM 篇:
: 
: 7.
: 一个容器下有很多子元素, 需要对这些子元素上的事件进行响应. 如果对每一个子元素
: 进行事件绑定, 代价比较高昂, 故可以将事件绑定到父容器上, 此称为事件代理.
: 
: 请你分别用 jQuery 和 native dom api 完成一个事件代理的 demo: 当鼠标移到任意 
: <li> 上时, console.log 它的 .textContent
: 
: jQuery: http://jsfiddle.net/PJ6JV/
: Native Dom Api: http://jsfiddle.net/GrVVf/
: 
昨天回答过了

: 8.
: 列举你所知道的一切 js 跨域方法, 并稍加解释.
: 
如果是指一般浏览器安全策略的话:
1.可以通过frame/img/embed etc的URL参数传递消息
2.两个frame有同样的一级域名的话可以通过设置domain为同一个进行通信
3.ajax可以跨域子域名
4.jsonP之类的

: 9.
: 有一个音乐列表页面和一个播放器页面, 要求:
:     a. 播放器页面正在播放的歌曲名字显示在标题栏, 播放历史显示在页面上.
:     b. 用户点击播放列表页上的任意项, 如果浏览器已经打开了播放器页面, 则播放器
: 页面开始播放该项, 否则弹出播放器页面并开始播放.
:     c. js代码要控制好浏览器, 不能有两个或以上播放器页面.
:     d. 刷新或关掉重开音乐列表页面, 看功能是否还正常.
:     d. 刷新或关掉重开播放器页面, 看功能是否还正常.
: 注: 只要实现窗口控制, 跟 百度音乐 差不多, 不需要真的播放音乐 :)
: 
: playlist.html:
: <!doctype html>
: <html>
:     <head>
:         <title>PlayList</title>
:     </head>
:     <body>
:         I'm PlayList;
:         <ol id="list">
:             <li>Song #1</li>
:             <li>Song #2</li>
:             <li>Song #3</li>
:         </ol>
:         <script>
:             //Write your code here
:         </script>
:     </body>
: </html>
: 
: player.html:
: <!doctype html>
: <html>
:     <head>
:         <title>Now playing: </title>
:     </head>
:     <body>
:         Play history
:         <ol id="history">
:         </ol>
:         <script>
:             //Write your code here
:         </script>
:     </body>
: </html>
是通过audio之类的api控制的吗?好高级。。。我觉得我会但是不是很想查APIshy
有兴趣的同学我可以提供一些线索。。。
http://learnshare.github.io/labs/audio/audio-apis.html
: 
: 
: 蛋疼篇:
: 10. 猜测结果并解释原因.
: console.log(++[[[[]]+[[]-[]]]][[[]-[]]]); 
++[[[[]]+[[]-[]]]][[[]-[]]]
++[[[[]]+[0]]][[0]]
++[["0"]][[0]]
++"0"
++0
1

: --
: 
: ※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]
: 
: ※ 修改:·MiaoMiao 于 2013年04月22日18:02:50 修改内容·[FROM: 211.68.71.66]
: 
: ※ 修改:·MiaoMiao 于 2013年04月22日18:29:25 修改内容·[FROM: 211.68.71.66]


--
    .           ╭
   +¨+         ╰╯ .+¨+。                   + `˙
  不是习惯冷漠﹒ˇ    ˇ而是不想让狂热的深情
  +          一一被窥透      +    ╭╮未了的是一愁      
  ¨+   .+·。+难改的痴情ˇ╰╯ .+¨ 所以最终    ╰╯
  Scorpius 天蝎座              ゜˙ `选择了隐逸

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]

[回复本文][原帖] 发信人: MiaoMiao(毛毛|学生信息员9527), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月23日13:51:35 星期二), 站内信件

最后一道题其实是想问怎么实现播放器窗口的单例, 不想问HTML5 audio 什么的.
【 在 scaret (方糖|似水流年|我是天蝎大使) 的大作中提到: 】
: 【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: : 标  题: JavaScript 十问 (外)
: : 发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件
: : 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: : 运行失败, 请指出.
: : 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: : 语言基础篇:
: : 1.
: : var str = '\u104A0';
: : console.log(str.length);
: .................(以下省略)

--

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]

[回复本文][原帖] 发信人: MiaoMiao(毛毛|学生信息员9527), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月23日14:13:04 星期二), 站内信件


【 在 scaret (方糖|似水流年|我是天蝎大使) 的大作中提到: 】
: 标  题: Re: JavaScript 十问 (外)
: 发信站: 饮水思源 (2013年04月23日13:38:52 星期二), 站内信件
: 
: 
: 【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: : 标  题: JavaScript 十问 (外)
: : 发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件
: : 
: : 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: : 运行失败, 请指出.
: : 
: : 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: : 
: : 语言基础篇:
: : 
: : 1.
: : var str = '\u104A0';
: : console.log(str.length);
: : console.log(String(str) === String(str))
: : console.log(RegExp(str) === RegExp(str))
: 
: \u跟16进制4位,所以两个字符是\u104A 0
: 2
: String()将输入转为字符串,字符串不是Object, ===是直接比较值
: true
: RegExp等号比较是否是同一个Object
: false
: : 

正确

: : 2.
: : console.log(typeof null);
: "Object"
: : console.log(typeof undefined);
: "undefined"
: : var a;
: : console.log(a === undefined);

这里应该是true.

: : var undefined;
: : undefined = 1;
: : console.log(a === undefined);
: 我还真不敢确定,用chrome验证了一下,果然是赋值不报错但是不改变赋值,跟Math.PI
: 一样
: false

正确.
这道题的目的是想提醒一下, 在老旧的浏览器里, undefined 是可以被overwrite 的, 
所以特别谨慎的家伙可以像上面一样, 声明一个变量来获得undefined.

: : 
: : var b = null;
: : var null;
: : null = 1;
: : console.log(b === null);
: 根据上一题的尿性猜是
: false

null 跟 undefined 不一样, 不能声明也不能赋值.

: : 
: : 3.
: : 我们有一个 ES5 兼容的 JS 环境, 请你完成这段代码, 使变量 a 的值为 global 
: : object (即浏览器里的 window), 并判断 console.log 会在控制台输出啥结果
: : (function(){
: :     'strict mode';
: :     /*
: :      * write your code here
: :      */
: :     console.log(a.a === a);
: : })()
: : 
: var a = (function(){return this})()
: false
: 加不加var都一样

在ES5 strict mode 里, this 不再是 global object 了.

如果不能依赖 window, 我所知道的变通的方法有三个:

(function(param){
    'use strict';
    var global;
    global = param;

    global = Function('return this')();
    console.log(global === param);

    var _eval = eval;
    global = _eval('this');
    console.log(global === param);
})(this);

如果a是global object, 那么所有的全局变量都是 a 的属性, 包括 a 自己, 也就是说
a.a === a 成立. 比如浏览器里, window.window === window 成立, top.top === top
成立.

: 
: : 4.
: : (function(){
: :     eval('a=1;');
: : })();
: : console.log(a);
: 1
: : 
: : (function(){
: :     'use strict';
: :     eval('b=2;');
: : })();
: : console.log(b);
: undefined
: 
: : 
: : 5.
: : (function(){
: :     function testA(){
: :         return function(){
: :             var a = 1;
: :             ++a;
: :             return a;
: :         }
: :     }
: :     function testB(){
: :         'use strict';
: :         return function(){
: :             var a = 1;
: :             ++a;
: :             return a;
: :         }
: :     }
: :     console.log(testA() === testA());
: :     console.log(testB() === testB());
: : })();
: 既然return的是function而且是每次重新生成的function应该两个都是false
: : 
: : 6.
: : (function(){
: :     console.log(typeof this)
: : })();
: window是Object的吧。。。还是会BomXXXXX应该不会吧
: : 
: : (function(){
: :     'use strict';
: :     console.log(typeof this)
: : })();
: : 
: 同上我不知道有什么区别。。。

跟第3题一个原理
Object
undefined
: 
: : DOM/BOM 篇:
: : 
: : 7.
: : 一个容器下有很多子元素, 需要对这些子元素上的事件进行响应. 如果对每一个子元素
: : 进行事件绑定, 代价比较高昂, 故可以将事件绑定到父容器上, 此称为事件代理.
: : 
: : 请你分别用 jQuery 和 native dom api 完成一个事件代理的 demo: 当鼠标移到任意 
: : <li> 上时, console.log 它的 .textContent
: : 
: : jQuery: http://jsfiddle.net/PJ6JV/
: : Native Dom Api: http://jsfiddle.net/GrVVf/
: : 
: 昨天回答过了
: 
: : 8.
: : 列举你所知道的一切 js 跨域方法, 并稍加解释.
: : 
: 如果是指一般浏览器安全策略的话:
: 1.可以通过frame/img/embed etc的URL参数传递消息
: 2.两个frame有同样的一级域名的话可以通过设置domain为同一个进行通信
: 3.ajax可以跨域子域名
: 4.jsonP之类的
: 

还有两个比较现代的方法:
5. CROS
6. window.postMessage()

还有 Flash crossdomain.xml , 虽然不常用.

: : 9.
: : 有一个音乐列表页面和一个播放器页面, 要求:
: :     a. 播放器页面正在播放的歌曲名字显示在标题栏, 播放历史显示在页面上.
: :     b. 用户点击播放列表页上的任意项, 如果浏览器已经打开了播放器页面, 则播放器
: : 页面开始播放该项, 否则弹出播放器页面并开始播放.
: :     c. js代码要控制好浏览器, 不能有两个或以上播放器页面.
: :     d. 刷新或关掉重开音乐列表页面, 看功能是否还正常.
: :     d. 刷新或关掉重开播放器页面, 看功能是否还正常.
: : 注: 只要实现窗口控制, 跟 百度音乐 差不多, 不需要真的播放音乐 :)
: : 
: : playlist.html:
: : <!doctype html>
: : <html>
: :     <head>
: :         <title>PlayList</title>
: :     </head>
: :     <body>
: :         I'm PlayList;
: :         <ol id="list">
: :             <li>Song #1</li>
: :             <li>Song #2</li>
: :             <li>Song #3</li>
: :         </ol>
: :         <script>
: :             //Write your code here
: :         </script>
: :     </body>
: : </html>
: : 
: : player.html:
: : <!doctype html>
: : <html>
: :     <head>
: :         <title>Now playing: </title>
: :     </head>
: :     <body>
: :         Play history
: :         <ol id="history">
: :         </ol>
: :         <script>
: :             //Write your code here
: :         </script>
: :     </body>
: : </html>
: 是通过audio之类的api控制的吗?好高级。。。我觉得我会但是不是很想查APIshy
: 有兴趣的同学我可以提供一些线索。。。
: http://learnshare.github.io/labs/audio/audio-apis.html
: : 
: : 
: : 蛋疼篇:
: : 10. 猜测结果并解释原因.
: : console.log(++[[[[]]+[[]-[]]]][[[]-[]]]); 
: ++[[[[]]+[[]-[]]]][[[]-[]]]
: ++[[[[]]+[0]]][[0]]
: ++[["0"]][[0]]
: ++"0"
: ++0
: 1
: 
: : --
: : 
: : ※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]
: : 
: : ※ 修改:·MiaoMiao 于 2013年04月22日18:02:50 修改内容·[FROM: 211.68.71.66]
: : 
: : ※ 修改:·MiaoMiao 于 2013年04月22日18:29:25 修改内容·[FROM: 211.68.71.66]
: 
: 
: --
:     .           ╭
:    +¨+         ╰╯ .+¨+。                   + `˙
:   不是习惯冷漠﹒ˇ    ˇ而是不想让狂热的深情
:   +          一一被窥透      +    ╭╮未了的是一愁      
:   ¨+   .+·。+难改的痴情ˇ╰╯ .+¨ 所以最终    ╰╯
:   Scorpius 天蝎座              ゜˙ `选择了隐逸
: 
: ※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]


--

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]

※ 修改:·MiaoMiao 于 2013年04月23日14:18:29 修改内容·[FROM: 211.68.71.66]

[回复本文][原帖] 发信人: scaret(方糖|似水流年|我是天蝎大使), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月23日13:53:13 星期二), 站内信件


难道不是倒数第二题吗。。。
【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: 最后一道题其实是想问怎么实现播放器窗口的单例, 不想问HTML5 audio 什么的.
: 【 在 scaret (方糖|似水流年|我是天蝎大使) 的大作中提到: 】
: : .................(以下省略)


--
    .           ╭
   +¨+         ╰╯ .+¨+。                   + `˙
  不是习惯冷漠﹒ˇ    ˇ而是不想让狂热的深情
  +          一一被窥透      +    ╭╮未了的是一愁      
  ¨+   .+·。+难改的痴情ˇ╰╯ .+¨ 所以最终    ╰╯
  Scorpius 天蝎座              ゜˙ `选择了隐逸

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]

[回复本文][原帖] 发信人: scaret(方糖|似水流年|我是天蝎大使), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月23日13:53:33 星期二), 站内信件

尿烦!
【 在 scaret (方糖|似水流年|我是天蝎大使) 的大作中提到: 】
: 难道不是倒数第二题吗。。。
: 【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: : 最后一道题其实是想问怎么实现播放器窗口的单例, 不想问HTML5 audio 什么的.


--
    .           ╭
   +¨+         ╰╯ .+¨+。                   + `˙
  不是习惯冷漠﹒ˇ    ˇ而是不想让狂热的深情
  +          一一被窥透      +    ╭╮未了的是一愁      
  ¨+   .+·。+难改的痴情ˇ╰╯ .+¨ 所以最终    ╰╯
  Scorpius 天蝎座              ゜˙ `选择了隐逸

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]

[回复本文][原帖] 发信人: MiaoMiao(毛毛|学生信息员9527), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月23日14:13:25 星期二), 站内信件

倒数第二题! 我晕头了.
【 在 scaret (方糖|似水流年|我是天蝎大使) 的大作中提到: 】
: 难道不是倒数第二题吗。。。
: 【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: : 最后一道题其实是想问怎么实现播放器窗口的单例, 不想问HTML5 audio 什么的.


--

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]

[回复本文][原帖] 发信人: scaret(方糖|似水流年|我是天蝎大使), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月23日15:07:16 星期二), 站内信件


【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: 标  题: Re: JavaScript 十问 (外)
: 发信站: 饮水思源 (2013年04月23日14:13:04 星期二), 站内信件
: 
: 
: 【 在 scaret (方糖|似水流年|我是天蝎大使) 的大作中提到: 】
: : 标  题: Re: JavaScript 十问 (外)
: : 发信站: 饮水思源 (2013年04月23日13:38:52 星期二), 站内信件
: : 
: : 
: : 【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: : : 标  题: JavaScript 十问 (外)
: : : 发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件
: : : 
: : : 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: : : 运行失败, 请指出.
: : : 
: : : 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: : : 
: : : 语言基础篇:
: : : 
: : : 1.
: : : var str = '\u104A0';
: : : console.log(str.length);
: : : console.log(String(str) === String(str))
: : : console.log(RegExp(str) === RegExp(str))
: : 
: : \u跟16进制4位,所以两个字符是\u104A 0
: : 2
: : String()将输入转为字符串,字符串不是Object, ===是直接比较值
: : true
: : RegExp等号比较是否是同一个Object
: : false
: : : 
: 
: 正确
: 
: : : 2.
: : : console.log(typeof null);
: : "Object"
: : : console.log(typeof undefined);
: : "undefined"
: : : var a;
: : : console.log(a === undefined);
: 
: 这里应该是true.
漏了大概
: 
: : : var undefined;
: : : undefined = 1;
: : : console.log(a === undefined);
: : 我还真不敢确定,用chrome验证了一下,果然是赋值不报错但是不改变赋值,跟Math.PI
: : 一样
: : false
: 
: 正确.
: 这道题的目的是想提醒一下, 在老旧的浏览器里, undefined 是可以被overwrite 的, 
: 所以特别谨慎的家伙可以像上面一样, 声明一个变量来获得undefined.
: 
: : : 
: : : var b = null;
: : : var null;
: : : null = 1;
: : : console.log(b === null);
: : 根据上一题的尿性猜是
: : false
: 
: null 跟 undefined 不一样, 不能声明也不能赋值.

所以是会报Error
null是字面量,undefined是常量,不知道我这样理解对不对

: 
: : : 
: : : 3.
: : : 我们有一个 ES5 兼容的 JS 环境, 请你完成这段代码, 使变量 a 的值为 global 
: : : object (即浏览器里的 window), 并判断 console.log 会在控制台输出啥结果
: : : (function(){
: : :     'strict mode';
: : :     /*
: : :      * write your code here
: : :      */
: : :     console.log(a.a === a);
: : : })()
: : : 
: : var a = (function(){return this})()
: : false
: : 加不加var都一样
: 
: 在ES5 strict mode 里, this 不再是 global object 了.
: 
: 如果不能依赖 window, 我所知道的变通的方法有三个:
: 
: (function(param){
:     'use strict';
:     var global;
:     global = param;
: 
:     global = Function('return this')();
:     console.log(global === param);
: 
:     var _eval = eval;
:     global = _eval('this');
:     console.log(global === param);
: })(this);
学习了,没想到直接执行字符串这么bt的方法
: 
: 如果a是global object, 那么所有的全局变量都是 a 的属性, 包括 a 自己, 也就是说
: a.a === a 成立. 比如浏览器里, window.window === window 成立, top.top === top
: 成立.
好的
: 
: : 
: : : 4.
: : : (function(){
: : :     eval('a=1;');
: : : })();
: : : console.log(a);
: : 1
: : : 
: : : (function(){
: : :     'use strict';
: : :     eval('b=2;');
: : : })();
: : : console.log(b);
: : undefined
: 
: 对
: 
: : 
: : : 
: : : 5.
: : : (function(){
: : :     function testA(){
: : :         return function(){
: : :             var a = 1;
: : :             ++a;
: : :             return a;
: : :         }
: : :     }
: : :     function testB(){
: : :         'use strict';
: : :         return function(){
: : :             var a = 1;
: : :             ++a;
: : :             return a;
: : :         }
: : :     }
: : :     console.log(testA() === testA());
: : :     console.log(testB() === testB());
: : : })();
: : 既然return的是function而且是每次重新生成的function应该两个都是false
: : : 
: 
: 对
: 
: : : 6.
: : : (function(){
: : :     console.log(typeof this)
: : : })();
: : window是Object的吧。。。还是会BomXXXXX应该不会吧
: : : 
: : : (function(){
: : :     'use strict';
: : :     console.log(typeof this)
: : : })();
: : : 
: : 同上我不知道有什么区别。。。
: 
: 跟第3题一个原理
: Object
: undefined
: : 
: : : DOM/BOM 篇:
: : : 
: : : 7.
: : : 一个容器下有很多子元素, 需要对这些子元素上的事件进行响应. 如果对每一个子元素
: : : 进行事件绑定, 代价比较高昂, 故可以将事件绑定到父容器上, 此称为事件代理.
: : : 
: : : 请你分别用 jQuery 和 native dom api 完成一个事件代理的 demo: 当鼠标移到任意 
: : : <li> 上时, console.log 它的 .textContent
: : : 
: : : jQuery: http://jsfiddle.net/PJ6JV/
: : : Native Dom Api: http://jsfiddle.net/GrVVf/
: : : 
: : 昨天回答过了
: : 
: : : 8.
: : : 列举你所知道的一切 js 跨域方法, 并稍加解释.
: : : 
: : 如果是指一般浏览器安全策略的话:
: : 1.可以通过frame/img/embed etc的URL参数传递消息
: : 2.两个frame有同样的一级域名的话可以通过设置domain为同一个进行通信
: : 3.ajax可以跨域子域名
: : 4.jsonP之类的
: : 
: 
: 还有两个比较现代的方法:
: 5. CROS
: 6. window.postMessage()
: 
: 还有 Flash crossdomain.xml , 虽然不常用.
: 
不知5
6好高级
7不推荐
忽然想起来还有个P3P?
: : : 9.
: : : 有一个音乐列表页面和一个播放器页面, 要求:
: : :     a. 播放器页面正在播放的歌曲名字显示在标题栏, 播放历史显示在页面上.
: : :     b. 用户点击播放列表页上的任意项, 如果浏览器已经打开了播放器页面, 则播放器
: : : 页面开始播放该项, 否则弹出播放器页面并开始播放.
: : :     c. js代码要控制好浏览器, 不能有两个或以上播放器页面.
: : :     d. 刷新或关掉重开音乐列表页面, 看功能是否还正常.
: : :     d. 刷新或关掉重开播放器页面, 看功能是否还正常.
: : : 注: 只要实现窗口控制, 跟 百度音乐 差不多, 不需要真的播放音乐 :)
: : : 
: : : playlist.html:
: : : <!doctype html>
: : : <html>
: : :     <head>
: : :         <title>PlayList</title>
: : :     </head>
: : :     <body>
: : :         I'm PlayList;
: : :         <ol id="list">
: : :             <li>Song #1</li>
: : :             <li>Song #2</li>
: : :             <li>Song #3</li>
: : :         </ol>
: : :         <script>
: : :             //Write your code here
: : :         </script>
: : :     </body>
: : : </html>
: : : 
: : : player.html:
: : : <!doctype html>
: : : <html>
: : :     <head>
: : :         <title>Now playing: </title>
: : :     </head>
: : :     <body>
: : :         Play history
: : :         <ol id="history">
: : :         </ol>
: : :         <script>
: : :             //Write your code here
: : :         </script>
: : :     </body>
: : : </html>
: : 是通过audio之类的api控制的吗?好高级。。。我觉得我会但是不是很想查APIshy
: : 有兴趣的同学我可以提供一些线索。。。
: : http://learnshare.github.io/labs/audio/audio-apis.html
: : : 
: : : 
: : : 蛋疼篇:
: : : 10. 猜测结果并解释原因.
: : : console.log(++[[[[]]+[[]-[]]]][[[]-[]]]); 
: : ++[[[[]]+[[]-[]]]][[[]-[]]]
: : ++[[[[]]+[0]]][[0]]
: : ++[["0"]][[0]]
: : ++"0"
: : ++0
: : 1
: : 
: : : --
: : : 
: : : ※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]
: : : 
: : : ※ 修改:·MiaoMiao 于 2013年04月22日18:02:50 修改内容·[FROM: 211.68.71.66]
: : : 
: : : ※ 修改:·MiaoMiao 于 2013年04月22日18:29:25 修改内容·[FROM: 211.68.71.66]
: : 
: : 
: : --
: :     .           ╭
: :    +¨+         ╰╯ .+¨+。                   + `˙
: :   不是习惯冷漠﹒ˇ    ˇ而是不想让狂热的深情
: :   +          一一被窥透      +    ╭╮未了的是一愁      
: :   ¨+   .+·。+难改的痴情ˇ╰╯ .+¨ 所以最终    ╰╯
: :   Scorpius 天蝎座              ゜˙ `选择了隐逸
: : 
: : ※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]
: 
: 
: --
: 
: ※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]
: 
: ※ 修改:·MiaoMiao 于 2013年04月23日14:18:29 修改内容·[FROM: 211.68.71.66]


--
    .           ╭
   +¨+         ╰╯ .+¨+。                   + `˙
  不是习惯冷漠﹒ˇ    ˇ而是不想让狂热的深情
  +          一一被窥透      +    ╭未了的是一愁      
  ¨+   .+·。+难改的痴情ˇ╰╯ .+¨ 所以最终    ╰╯
  Scorpius 天蝎座              ゜˙ `选择了隐逸

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]

[回复本文][原帖] 发信人: przhu(仙贝), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年04月23日15:10:09 星期二)


【 在 MiaoMiao 的大作中提到: 】
: 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语..
: 运行失败, 请指出.


这回顿时都不会了 毛毛出题果然高 > _<
--
Yours, Sincerely
    PrZhu
※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 202.120.38.2]

[回复本文][原帖] 发信人: MiaoMiao(毛毛|学生信息员9527), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年05月03日15:40:42 星期五), 站内信件

勘误
【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: 标  题: JavaScript 十问 (外)
: 发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件
: 
: 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: 运行失败, 请指出.
: 
: 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: 
: 语言基础篇:
: 
: 1.
: var str = '\u104A0';
: console.log(str.length);
: console.log(String(str) === String(str))
: console.log(RegExp(str) === RegExp(str))
: 
: 2.
: console.log(typeof null);
: console.log(typeof undefined);
: var a;
: console.log(a === undefined);
: var undefined;
: undefined = 1;
: console.log(a === undefined);
: 
: var b = null;
: var null;
: null = 1;
: console.log(b === null);
: 
: 3.
: 我们有一个 ES5 兼容的 JS 环境, 请你完成这段代码, 使变量 a 的值为 global 
: object (即浏览器里的 window), 并判断 console.log 会在控制台输出啥结果
var a;
: (function(){
:     'strict mode';
:     /*
:      * write your code here
:      */
:     console.log(a.a === a);
: })();
: 
: 4.
: (function(){
:     eval('a=1;');
: })();
: console.log(a);
: 
: (function(){
:     'use strict';
:     eval('b=2;');
: })();
: console.log(b);
: 
: 5.
: (function(){
:     function testA(){
:         return function(){
:             var a = 1;
:             ++a;
:             return a;
:         }
:     }
:     function testB(){
:         'use strict';
:         return function(){
:             var a = 1;
:             ++a;
:             return a;
:         }
:     }
:     console.log(testA() === testA());
:     console.log(testB() === testB());
: })();
: 
: 6.
: (function(){
:     console.log(typeof this)
: })();
: 
: (function(){
:     'use strict';
:     console.log(typeof this)
: })();
: 
: DOM/BOM 篇:
: 
: 7.
: 一个容器下有很多子元素, 需要对这些子元素上的事件进行响应. 如果对每一个子元素
: 进行事件绑定, 代价比较高昂, 故可以将事件绑定到父容器上, 此称为事件代理.
: 
: 请你分别用 jQuery 和 native dom api 完成一个事件代理的 demo: 当鼠标移到任意 
: <li> 上时, console.log 它的 .textContent
: 
: jQuery: http://jsfiddle.net/PJ6JV/
: Native Dom Api: http://jsfiddle.net/GrVVf/
: 
: 8.
: 列举你所知道的一切 js 跨域方法, 并稍加解释.
: 
: 9.
: 有一个音乐列表页面和一个播放器页面, 要求:
:     a. 播放器页面正在播放的歌曲名字显示在标题栏, 播放历史显示在页面上.
:     b. 用户点击播放列表页上的任意项, 如果浏览器已经打开了播放器页面, 则播放器
: 页面开始播放该项, 否则弹出播放器页面并开始播放.
:     c. js代码要控制好浏览器, 不能有两个或以上播放器页面.
:     d. 刷新或关掉重开音乐列表页面, 看功能是否还正常.
:     d. 刷新或关掉重开播放器页面, 看功能是否还正常.
: 注: 只要实现窗口控制, 跟 百度音乐 差不多, 不需要真的播放音乐 :)
: 
: playlist.html:
: <!doctype html>
: <html>
:     <head>
:         <title>PlayList</title>
:     </head>
:     <body>
:         I'm PlayList;
:         <ol id="list">
:             <li>Song #1</li>
:             <li>Song #2</li>
:             <li>Song #3</li>
:         </ol>
:         <script>
:             //Write your code here
:         </script>
:     </body>
: </html>
: 
: player.html:
: <!doctype html>
: <html>
:     <head>
:         <title>Now playing: </title>
:     </head>
:     <body>
:         Play history
:         <ol id="history">
:         </ol>
:         <script>
:             //Write your code here
:         </script>
:     </body>
: </html>
: 
: 
: 蛋疼篇:
: 10. 猜测结果并解释原因.
: console.log(++[[[[]]+[[]-[]]]][[[]-[]]]); 
: --
: 
: ※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]
: 
: ※ 修改:·MiaoMiao 于 2013年04月22日18:02:50 修改内容·[FROM: 211.68.71.66]
: 
: ※ 修改:·MiaoMiao 于 2013年04月22日18:29:25 修改内容·[FROM: 211.68.71.66]
: 
: ※ 修改:·MiaoMiao 于 2013年05月03日15:39:11 修改内容·[FROM: 211.68.71.66]


--

※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 211.68.71.66]

[回复本文][原帖] 发信人: scaret(方糖|似水流年|我是天蝎大使), 信区: WebDevelop
标  题: Re: JavaScript 十问 (外)
发信站: 饮水思源 (2013年05月04日10:16:57 星期六), 站内信件

- -
【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: 勘误
: 【 在 MiaoMiao (毛毛|学生信息员9527) 的大作中提到: 】
: : 标  题: JavaScript 十问 (外)
: : 发信站: 饮水思源 (2013年04月22日17:59:01 星期一), 站内信件
: : 不运行下列代码, 目测一下 console.log 会在控制台输出啥结果. 如果觉得哪句语句会
: : 运行失败, 请指出.
: : 注意: 如果没有特殊说明, 兼容最新版的 Firefox 或 Chrome 即可. 注意全文引用!
: : 语言基础篇:
: : 1.
: : var str = '\u104A0';
: .................(以下省略)

--
※ 来源:·饮水思源 bbs.sjtu.edu.cn·[FROM: 58.32.208.214]

本主题共有 14 篇文章,分 1 页, 当前显示第 1 页 [返回讨论区]

[返回上一页][本讨论区(一般模式)]